| | |
| | | <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" |
| | | @pushed="(e) => (selectedClue.cuploaded = e)" |
| | | @onClueTaskChange="handleClueTaskChange" |
| | | ></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 time = moment(updateTime.value).format('YYYY-MM-DD HH:mm:ss'); |
| | | onMapMounted(() => { |
| | | clueApi.getClues(time).then((res) => { |
| | | clueList.value = res; |
| | | }); |
| | | }); |
| | | }; |
| | | const selectedClue = ref(); |
| | | const show = ref(false); |
| | | |
| | | /** |
| | | * 选择线索事件 |
| | | */ |
| | | const selectClue = function (clue) {}; |
| | | const selectClue = function (clue) { |
| | | show.value = true; |
| | | selectedClue.value = clue; |
| | | }; |
| | | |
| | | function handleClueTaskChange() { |
| | | selectedClue.value.taskCount = 1; |
| | | } |
| | | </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> |