Merge branch 'master' of ssh://114.215.109.124:29418/grid-management-vue

riku

2023-10-31 1f96f089eb3546c682313d29513be04ac72e2de5

 src/views/overlay-clue/ClueLayout.vue

@@ -1,95 +1,32 @@
<template>
  <el-row class="container">
    <el-col :span="6" class="grid-content bg-content">
      <div class="title">下发线索清单</div>
      <div class="search-wrap">
        <span>时间</span>
        <el-date-picker
          v-model="updateTime"
          type="datetime"
          placeholder="选择日期和时间"
        />
        <el-button type="primary" @click="getClues">查询</el-button>
      </div>
      <ClueList
        :dataList="clueList"
        @itemSelected="selectClue"
      ></ClueList>
  <el-row class="fy-overlay-container" justify="space-between">
    <el-col :span="6">
      <ClueManage @itemSelected="selectClue"></ClueManage>
    </el-col>
    <el-col :span="6" class="grid-content bg-content-1">
      <ClueReport></ClueReport>
    <el-col :span="6">
      <ClueReport
        v-model:show="show"
        :clueData="selectedClue"
      ></ClueReport>
    </el-col>
  </el-row>
</template>

<script setup>
import ClueList from './components/ClueList.vue';
import ClueReport from './components/ClueReport.vue';
import ClueManage from './list/ClueManage.vue';
import ClueReport from './report/ClueReport.vue';
import { ref } from 'vue';

import clueApi from '@/api/clue/clueApi';
import { onMapMounted } from '@/components/map/baseMap';
import moment from 'moment';
import { ref, watch } from 'vue';

// 下发时间（每次查询大于此时间的数据）
const updateTime = ref(new Date());
// 线索清单
const clueList = ref([]);

/**
 * 查询已下发的线索清单
 */
const getClues = function () {
  const now = moment(updateTime.value);
  const sTime = now.format('YYYY-MM-DD HH:mm:ss');
  const eTime = now.add(1, 'month');
  onMapMounted(() => {
    clueApi.getClue({ sTime, eTime }).then((res) => {
      clueList.value = res;
    });
  });
};
const selectedClue = ref();
const show = ref(false);

/**
 * 选择线索事件
 */
const selectClue = function (clue) {

  show.value = true;
  selectedClue.value = clue;
};
</script>

<style scoped>
.title {
  font-size: var(--el-font-size-large);
}

.container {
  pointer-events: none;
}

.grid-content {
  /* min-width: 180px; */
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 8px 8px;
  pointer-events: auto;
}

.bg-content {
  height: 90vh;
  background: white;
  min-width: calc(var(--screen-min-width) / 6);
}

.bg-content-1 {
  height: 90vh;
  background: white;
}

.search-wrap {
  display: flex;
  gap: 4px;
}
</style>
<style scoped></style>