riku
2023-07-20 d22ce1ad1c4656f5c2212bbabb35ba498300aced
src/views/overlay-clue/ClueLayout.vue
@@ -1,7 +1,7 @@
<template>
  <el-row class="container">
  <el-row class="container" justify="space-between">
    <el-col :span="6" class="grid-content bg-content">
      <div class="title">下发线索清单</div>
      <div class="fy-h1">线索清单</div>
      <div class="search-wrap">
        <span>时间</span>
        <el-date-picker
@@ -10,6 +10,9 @@
          placeholder="选择日期和时间"
        />
        <el-button type="primary" @click="getClues">查询</el-button>
        <el-button type="primary" @click="fetchRemoteClue"
          >拉取线索</el-button
        >
      </div>
      <ClueList
        :dataList="clueList"
@@ -17,7 +20,10 @@
      ></ClueList>
    </el-col>
    <el-col :span="6" class="grid-content bg-content-1">
      <ClueReport></ClueReport>
      <div class="fy-h1">线索反馈</div>
      <el-scrollbar height="80vh" class="bg-fill">
        <ClueReport :clueData="selectedClue"></ClueReport>
      </el-scrollbar>
    </el-col>
  </el-row>
</template>
@@ -35,23 +41,37 @@
const updateTime = ref(new Date());
// 线索清单
const clueList = ref([]);
const selectedClue = ref();
/**
 * 查询已下发的线索清单
 */
const getClues = function () {
  const time = moment(updateTime.value).format('YYYY-MM-DD HH:mm:ss');
  const now = moment(updateTime.value);
  const sTime = now.format('YYYY-MM-DD HH:mm:ss');
  const eTime = now.add(1, 'month').format('YYYY-MM-DD HH:mm:ss');
  onMapMounted(() => {
    clueApi.getClues(time).then((res) => {
    clueApi.getClue({ sTime, eTime }).then((res) => {
      clueList.value = res;
    });
  });
};
function fetchRemoteClue() {
  const time = moment(updateTime.value).format('YYYY-MM-DD HH:mm:ss');
  onMapMounted(() => {
    clueApi.fetchRemoteClue(time).then((res) => {
      clueList.value = res;
    });
  });
}
/**
 * 选择线索事件
 */
const selectClue = function (clue) {};
const selectClue = function (clue) {
  selectedClue.value = clue;
};
</script>
<style scoped>
@@ -65,12 +85,13 @@
.grid-content {
  /* min-width: 180px; */
  border-radius: 4px;
  border-radius: var(--el-border-radius-round);
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 8px 8px;
  /* padding: 8px 8px; */
  pointer-events: auto;
  box-shadow: var(--el-box-shadow-dark);
}
.bg-content {
@@ -85,7 +106,14 @@
}
.search-wrap {
  padding: 0 8px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bg-fill {
  /* background: var(--el-fill-color-extra-light); */
  padding: 0 8px;
}
</style>