Merge branch 'lsf-topTask'
| | |
|---|
| | | "semi": true, |
|---|
| | | "tabWidth": 2, |
|---|
| | | "singleQuote": true, |
|---|
| | | "printWidth": 100, |
|---|
| | | "printWidth": 80, |
|---|
| | | "trailingComma": "none" |
|---|
| | | } |
|---|
| | |
|---|
| | | <!DOCTYPE html> |
|---|
| | | <!doctype html> |
|---|
| | | <html lang="en"> |
|---|
| | | <head> |
|---|
| | | <meta charset="UTF-8"> |
|---|
| | | <link rel="icon" href="/favicon.ico"> |
|---|
| | | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|---|
| | | <meta charset="UTF-8" /> |
|---|
| | | <link rel="icon" href="/favicon.ico" /> |
|---|
| | | <meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
|---|
| | | <title>çæç¯å¢çº¿ä¸ç管</title> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app"></div> |
|---|
| | | </body> |
|---|
| | | <script type="text/javascript"> |
|---|
| | | window._AMapSecurityConfig = { |
|---|
| | | serviceHost: 'http://47.100.191.150:8083/_AMapService' |
|---|
| | | //ä¾å¦ ï¼serviceHost:'http://1.1.1.1:80/_AMapService', |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <script |
|---|
| | | type="text/javascript" |
|---|
| | | src="https://webapi.amap.com/maps?v=1.4.5&key=520c5e5cf44c7793104e500cbf0ed711&plugin=Map3D,ElasticMarker,AMap.ControlBar,AMap.Geocoder" |
|---|
| | | ></script> |
|---|
| | | <script type="module" src="/src/main.js"></script> |
|---|
| | | </html> |
|---|
| | |
|---|
| | | "name": "supervision-vue", |
|---|
| | | "version": "0.0.0", |
|---|
| | | "dependencies": { |
|---|
| | | "@amap/amap-jsapi-loader": "^1.0.1", |
|---|
| | | "@ctrl/tinycolor": "^4.0.2", |
|---|
| | | "@element-plus/icons-vue": "^2.0.10", |
|---|
| | | "@vueuse/core": "^9.7.0", |
|---|
| | |
|---|
| | | "vite": "^3.2.5", |
|---|
| | | "vitest": "^0.25.3" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | "node_modules/@amap/amap-jsapi-loader": { |
|---|
| | | "version": "1.0.1", |
|---|
| | | "resolved": "https://registry.npmmirror.com/@amap/amap-jsapi-loader/-/amap-jsapi-loader-1.0.1.tgz", |
|---|
| | | "integrity": "sha512-nPyLKt7Ow/ThHLkSvn2etQlUzqxmTVgK7bIgwdBRTg2HK5668oN7xVxkaiRe3YZEzGzfV2XgH5Jmu2T73ljejw==" |
|---|
| | | }, |
|---|
| | | "node_modules/@ampproject/remapping": { |
|---|
| | | "version": "2.2.0", |
|---|
| | |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | "dependencies": { |
|---|
| | | "@amap/amap-jsapi-loader": { |
|---|
| | | "version": "1.0.1", |
|---|
| | | "resolved": "https://registry.npmmirror.com/@amap/amap-jsapi-loader/-/amap-jsapi-loader-1.0.1.tgz", |
|---|
| | | "integrity": "sha512-nPyLKt7Ow/ThHLkSvn2etQlUzqxmTVgK7bIgwdBRTg2HK5668oN7xVxkaiRe3YZEzGzfV2XgH5Jmu2T73ljejw==" |
|---|
| | | }, |
|---|
| | | "@ampproject/remapping": { |
|---|
| | | "version": "2.2.0", |
|---|
| | | "dev": true, |
|---|
| | |
|---|
| | | "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore" |
|---|
| | | }, |
|---|
| | | "dependencies": { |
|---|
| | | "@amap/amap-jsapi-loader": "^1.0.1", |
|---|
| | | "@ctrl/tinycolor": "^4.0.2", |
|---|
| | | "@element-plus/icons-vue": "^2.0.10", |
|---|
| | | "@vueuse/core": "^9.7.0", |
|---|
| | |
|---|
| | | <Content></Content> |
|---|
| | | <!-- <el-backtop |
|---|
| | | target=".el-main .el-scrollbar__wrap" |
|---|
| | | :right="40" |
|---|
| | | :right="10" |
|---|
| | | :bottom="100" |
|---|
| | | style="width: 120px;z-index: 1000;" |
|---|
| | | style="z-index: 1000;" |
|---|
| | | > |
|---|
| | | <div class="back-top"> |
|---|
| | | <el-icon><ArrowUpBold /></el-icon> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { $fysp } from '../index'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | // è·åå·¡æ¥ä»»å¡ç±»å |
|---|
| | | fetchTaskType() { |
|---|
| | | return $fysp.get(`domainitem/taskType`).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | // è·åå·¡æ¥ä»»å¡æéç±»å |
|---|
| | | fetchDeadlineType() { |
|---|
| | | return $fysp.get(`domainitem/deadlineType`).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | // è·åå·¡æ¥ä»»å¡å±æ¬¡ç±»å |
|---|
| | | fetchLevelType() { |
|---|
| | | return $fysp.get(`domainitem/level`).then((res) => res.data); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | |
|---|
| | | updateScene(scene) { |
|---|
| | | return $fysp.post('scense', scene).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * æ¹éæ´æ°åºæ¯ |
|---|
| | | */ |
|---|
| | | updateSceneList(sceneList) { |
|---|
| | | return $fysp.post('scense/update/list', sceneList).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * è·åææåºæ¯ç±»å |
|---|
| | | */ |
|---|
| | |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | /** |
|---|
| | | * æ°å»ºä»»å¡ |
|---|
| | | * @param {Object} task |
|---|
| | | */ |
|---|
| | | putTask(task){ |
|---|
| | | return $fysp.put(`task/create`, task).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | /** |
|---|
| | | * æ ¹æ®ä¸»é®è·åæ»ä»»å¡ææ¥ä»»å¡ |
|---|
| | | */ |
|---|
| | | fetchTaskById(id){ |
|---|
| | | return $fysp.get(`task/${id}`).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * è·å顶å±ä»»å¡ |
|---|
| | | */ |
|---|
| | | getTopTask() { |
|---|
| | | return $fysp.get('task/alltask/0').then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | getLastTopTask(task){ |
|---|
| | | return $fysp.post(`task/lastTask`, task).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | /** |
|---|
| | |
|---|
| | | /** |
|---|
| | | * è·ååä»»å¡é®é¢è¯¦æ
|
|---|
| | | */ |
|---|
| | | async getProBySubtask(id) { |
|---|
| | | return await $fysp |
|---|
| | | getProBySubtask(id) { |
|---|
| | | return $fysp |
|---|
| | | .get('problemlist/subtask', { |
|---|
| | | params: { |
|---|
| | | stGuid: id |
|---|
| | |
|---|
| | | * è·ååºæ¯çç¨æ·è¯¦æ
|
|---|
| | | */ |
|---|
| | | getUserByScene(sId) { |
|---|
| | | return $fysp.get(`userinfo/scene/get?sceneId=${sId}`).then((res) => res.data); |
|---|
| | | return $fysp |
|---|
| | | .get(`userinfo/scene/get?sceneId=${sId}`) |
|---|
| | | .then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | /** |
|---|
| | |
|---|
| | | autoCreateAccount(sId) { |
|---|
| | | return $fysp.post(`userinfo/create?sceneId=${sId}`).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | /** |
|---|
| | | * è·ååºæ¯å¯¹åºçé£ç¾½ç¯å¢ç³»ç»ç¨æ·id |
|---|
| | | */ |
|---|
| | | getTzId(sceneId) { |
|---|
| | | /** |
|---|
| | | * è·ååºæ¯å¯¹åºçé£ç¾½ç¯å¢ç³»ç»ç¨æ·id |
|---|
| | | */ |
|---|
| | | getTzId(sceneId) { |
|---|
| | | return $fysp.get(`usermap?sceneId=${sceneId}`).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * æç¨æ·ç±»åè·åç¨æ·ä¿¡æ¯ |
|---|
| | | */ |
|---|
| | | getUserByType(typeId, enable = true) { |
|---|
| | | return $fysp |
|---|
| | | .get(`userinfo/type/get`, { params: { typeId, enable } }) |
|---|
| | | .then((res) => res.data); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | |
|---|
| | | * éç½®ç¨æ·å¯ç |
|---|
| | | */ |
|---|
| | | resetPassword(id) { |
|---|
| | | return $fytz.post(`userInfo/resetPw?userId=${id}`).then((res) => res); |
|---|
| | | return $fytz.post(`userInfo/resetPw?userId=${id}`).then((res) => res.data); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | declare module '@vue/runtime-core' { |
|---|
| | | export interface GlobalComponents { |
|---|
| | | BaseContentLayout: typeof import('./components/core/BaseContentLayout.vue')['default'] |
|---|
| | | BaseMap: typeof import('./components/map/BaseMap.vue')['default'] |
|---|
| | | BasePanelLayout: typeof import('./components/core/BasePanelLayout.vue')['default'] |
|---|
| | | CompQuickSet: typeof import('./components/search-option/CompQuickSet.vue')['default'] |
|---|
| | | Content: typeof import('./components/core/Content.vue')['default'] |
|---|
| | | ElAffix: typeof import('element-plus/es')['ElAffix'] |
|---|
| | | ElAside: typeof import('element-plus/es')['ElAside'] |
|---|
| | | ElAvatar: typeof import('element-plus/es')['ElAvatar'] |
|---|
| | | ElBadge: typeof import('element-plus/es')['ElBadge'] |
|---|
| | |
|---|
| | | ElCalendar: typeof import('element-plus/es')['ElCalendar'] |
|---|
| | | ElCard: typeof import('element-plus/es')['ElCard'] |
|---|
| | | ElCascader: typeof import('element-plus/es')['ElCascader'] |
|---|
| | | ElCheckbox: typeof import('element-plus/es')['ElCheckbox'] |
|---|
| | | ElCol: typeof import('element-plus/es')['ElCol'] |
|---|
| | | ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider'] |
|---|
| | | ElContainer: typeof import('element-plus/es')['ElContainer'] |
|---|
| | |
|---|
| | | MenuItems: typeof import('./components/core/MenuItems.vue')['default'] |
|---|
| | | RouterLink: typeof import('vue-router')['RouterLink'] |
|---|
| | | RouterView: typeof import('vue-router')['RouterView'] |
|---|
| | | SceneMap: typeof import('./components/map/SceneMap.vue')['default'] |
|---|
| | | SearchBar: typeof import('./components/SearchBar.vue')['default'] |
|---|
| | | SideList: typeof import('./components/SideList.vue')['default'] |
|---|
| | | SiderMenu: typeof import('./components/core/SiderMenu.vue')['default'] |
|---|
| | |
|---|
| | | <el-form :inline="true" :model="formSearch"> |
|---|
| | | <el-form-item label="æ»ä»»å¡"> |
|---|
| | | <!-- <el-input v-model="formSearch.topTaskId" placeholder="æ»ä»»å¡" /> --> |
|---|
| | | <el-select v-model="formSearch.topTaskId" placeholder="æ»ä»»å¡" style="width: 260px"> |
|---|
| | | <el-select |
|---|
| | | v-model="formSearch.topTaskId" |
|---|
| | | placeholder="æ»ä»»å¡" |
|---|
| | | style="width: 260px" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="s in topTasks" |
|---|
| | | :key="s.value" |
|---|
| | |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item label="åºæ¯ç±»å"> |
|---|
| | | <el-select v-model="formSearch.sceneTypeId" placeholder="åºæ¯ç±»å" style="width: 150px"> |
|---|
| | | <el-select |
|---|
| | | v-model="formSearch.sceneTypeId" |
|---|
| | | placeholder="åºæ¯ç±»å" |
|---|
| | | style="width: 150px" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="s in sceneTypes" |
|---|
| | | :key="s.value" |
|---|
| | |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import taskApi from '@/api/fysp/taskApi'; |
|---|
| | | import { enumScene } from "@/enum/scene"; |
|---|
| | | import { enumScene } from '@/enum/scene'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | emits: ['onSubmit'], |
|---|
| | |
|---|
| | | sceneTypes: enumScene(2, false), |
|---|
| | | formSearch: { |
|---|
| | | topTaskId: '', |
|---|
| | | sceneTypeId: '', |
|---|
| | | obj: '', |
|---|
| | | }, |
|---|
| | | sceneTypeId: '' |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | //è·åæ¥è¯¢æ¡ä»¶ |
|---|
| | | getOptions() { |
|---|
| | | taskApi.getTopTask().then((res) => { |
|---|
| | | const list = []; |
|---|
| | | res.forEach((r) => { |
|---|
| | | list.push({ |
|---|
| | | const list = res.map((r) => { |
|---|
| | | return { |
|---|
| | | value: r.tguid, |
|---|
| | | label: r.name, |
|---|
| | | obj: r, |
|---|
| | | towncode: r.towncode, |
|---|
| | | districtCode: r.districtcode, |
|---|
| | | month: r.starttime.slice(0, 7), |
|---|
| | | }); |
|---|
| | | data: r |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | this.topTasks = list; |
|---|
| | | this.formSearch.topTaskId = list[0].value; |
|---|
| | | this.formSearch.obj = list[0].obj; |
|---|
| | | this.$emit('onSubmit', this.formSearch); |
|---|
| | | this.onSubmit(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | //æ¥è¯¢åä»»å¡ç»è®¡ä¿¡æ¯ |
|---|
| | | onSubmit() { |
|---|
| | | // console.log(this.formSearch.sceneTypeId) |
|---|
| | | this.$emit('onSubmit', this.formSearch); |
|---|
| | | }, |
|---|
| | | const task = this.topTasks.find( |
|---|
| | | (t) => t.data.tguid == this.formSearch.topTaskId |
|---|
| | | ); |
|---|
| | | const param = { |
|---|
| | | topTask: task ? task.data : {}, |
|---|
| | | sceneTypeId: this.formSearch.sceneTypeId |
|---|
| | | }; |
|---|
| | | console.log(param); |
|---|
| | | |
|---|
| | | this.$emit('onSubmit', param); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | this.formSearch.sceneTypeId = this.sceneTypes[0].value; |
|---|
| | | this.getOptions(); |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <el-container> |
|---|
| | | <el-header class="el-header"> |
|---|
| | | <el-header ref="headerRef" class="el-header"> |
|---|
| | | <slot name="header"></slot> |
|---|
| | | </el-header> |
|---|
| | | <el-container> |
|---|
| | | <el-aside class="el-aside"> |
|---|
| | | <el-aside class="el-aside" :style="'height: ' + mainHeight"> |
|---|
| | | <el-scrollbar> |
|---|
| | | <slot name="aside"></slot> |
|---|
| | | </el-scrollbar> |
|---|
| | | </el-aside> |
|---|
| | | <el-main class="el-main"> |
|---|
| | | <el-main class="el-main" :style="'height: ' + mainHeight"> |
|---|
| | | <slot name="main"></slot> |
|---|
| | | </el-main> |
|---|
| | | </el-container> |
|---|
| | |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | // å³ä¾§æä½çé¢åºç¡å¸å± |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | mainHeight: 'calc(100vh - 60px * 2 - var(--el-main-padding) * 2)' |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // å
容é«åº¦ |
|---|
| | | calHeight() { |
|---|
| | | if (this.$refs.headerRef) { |
|---|
| | | const h1 = this.$refs.headerRef.$el.offsetHeight; |
|---|
| | | const h = h1; |
|---|
| | | return `calc(100vh - ${h}px - 60px - var(--el-main-padding) * 2 + 6px)`; |
|---|
| | | } else { |
|---|
| | | return `calc(100vh - 60px * 2 - var(--el-main-padding) * 2)`; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | setTimeout(() => { |
|---|
| | | this.mainHeight = this.calHeight(); |
|---|
| | | }, 150); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | |
|---|
| | | .el-aside { |
|---|
| | | /* width: initial; */ |
|---|
| | | position: relative; |
|---|
| | | height: calc(100vh - 60px * 2 - 20px * 2); |
|---|
| | | /* height: calc(100vh - 60px * 2 - 20px * 2); */ |
|---|
| | | /* background-color: aqua; */ |
|---|
| | | /* overflow-y: auto; */ |
|---|
| | | border-right: 1px solid var(--el-color-info-light-7); |
|---|
| | |
|---|
| | | .el-main { |
|---|
| | | position: relative; |
|---|
| | | /* background-color: whitesmoke; */ |
|---|
| | | height: calc(100vh - 60px * 2 - 20px * 2); |
|---|
| | | /* height: calc(100vh - 60px * 2 - 20px * 2); */ |
|---|
| | | padding: initial; |
|---|
| | | padding-left: 20px; |
|---|
| | | /* overflow: hidden; */ |
|---|
| | |
|---|
| | | > |
|---|
| | | <slot name="form-item" :formObj="formObj"></slot> |
|---|
| | | <el-form-item v-if="showButtons"> |
|---|
| | | <el-button :disabled="!edit" type="primary" @click="onSubmit" :loading="loading" |
|---|
| | | >æ交</el-button |
|---|
| | | <el-button |
|---|
| | | :disabled="!edit" |
|---|
| | | type="primary" |
|---|
| | | @click="onSubmit" |
|---|
| | | :loading="loading" |
|---|
| | | >{{ submitName }}</el-button |
|---|
| | | > |
|---|
| | | <el-button v-if="useReset" :disabled="!edit" @click="onReset">éç½®</el-button> |
|---|
| | | <el-button v-if="useReset" :disabled="!edit" @click="onReset" |
|---|
| | | >éç½®</el-button |
|---|
| | | > |
|---|
| | | <el-button v-if="useCancel" @click="onCancel">åæ¶</el-button> |
|---|
| | | </el-form-item> |
|---|
| | | </el-form> |
|---|
| | |
|---|
| | | * å¯ä¼ å
¥åå§è¡¨åæ°æ®formInfoï¼è¡¨åæ ¡éªè§årules |
|---|
| | | * å®ç°submitåcancel触åå½æ° |
|---|
| | | */ |
|---|
| | | import { defineProps, defineEmits, reactive, ref, watch, computed, defineExpose } from 'vue'; |
|---|
| | | import { |
|---|
| | | defineProps, |
|---|
| | | defineEmits, |
|---|
| | | reactive, |
|---|
| | | ref, |
|---|
| | | watch, |
|---|
| | | computed, |
|---|
| | | defineExpose |
|---|
| | | } from 'vue'; |
|---|
| | | import { useFormConfirm } from '@/composables/formConfirm'; |
|---|
| | | |
|---|
| | | const props = defineProps({ |
|---|
| | |
|---|
| | | showButtons: { |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | submitName: { |
|---|
| | | type: String, |
|---|
| | | default: 'æ交' |
|---|
| | | }, |
|---|
| | | //åæ¶æé®æ¯å¦å¯ç¨ |
|---|
| | | useCancel: Boolean, |
|---|
| | |
|---|
| | | }); |
|---|
| | | |
|---|
| | | //表åæä½å½æ° |
|---|
| | | const { formObj, formRef, edit, onSubmit, onCancel, onReset, clear } = useFormConfirm({ |
|---|
| | | submit: { |
|---|
| | | do: submit |
|---|
| | | }, |
|---|
| | | cancel: { |
|---|
| | | do: cancel |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | const { formObj, formRef, edit, onSubmit, onCancel, onReset, clear } = |
|---|
| | | useFormConfirm({ |
|---|
| | | submit: { |
|---|
| | | do: submit |
|---|
| | | }, |
|---|
| | | cancel: { |
|---|
| | | do: cancel |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | //å è½½ç¶æ |
|---|
| | | const loading = ref(false); |
|---|
| | |
|---|
| | | }, |
|---|
| | | (err) => { |
|---|
| | | loading.value = false; |
|---|
| | | reject(err); |
|---|
| | | reject(err ? err : ''); |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | }); |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <div class="wrapper"> |
|---|
| | | <div> |
|---|
| | | <el-text truncated>{{ item.name }}</el-text> |
|---|
| | | <el-text truncated class="w-250px" size="large">{{ item.name }}</el-text> |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <el-space fill> |
|---|
| | | <el-text truncated class="w-250px" size="small">{{ item.scenseaddress }}</el-text> |
|---|
| | | <el-text truncated class="w-250px" size="small">{{ |
|---|
| | | $fm.formatYMDH(item.planstarttime) |
|---|
| | | }}</el-text> |
|---|
| | | <el-text truncated class="w-250px" size="small">{{ item.executorrealtimes }}</el-text> |
|---|
| | | </el-space> |
|---|
| | | <el-text truncated class="w-250px" size="small">{{ item.scenseaddress }}</el-text> |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <el-text truncated size="small">{{ |
|---|
| | | $fm.formatYMDH(item.planstarttime) |
|---|
| | | }}</el-text> |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <el-text truncated class="w-250px" size="small">{{ |
|---|
| | | item.executorrealtimes |
|---|
| | | }}</el-text> |
|---|
| | | </div> |
|---|
| | | <el-row justify="end" style="margin-top: 4px"> |
|---|
| | | <slot :item="item"></slot> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div id="container"></div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script setup> |
|---|
| | | import { onMounted } from 'vue'; |
|---|
| | | import { createMap } from '@/utils/map/index_old'; |
|---|
| | | onMounted(() => { |
|---|
| | | // é«å¾·å°å¾åå§å |
|---|
| | | createMap('container'); |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style> |
|---|
| | | #container { |
|---|
| | | position: relative; |
|---|
| | | width: 100%; |
|---|
| | | height: 100vh; |
|---|
| | | min-height: var(--screen-min-height); |
|---|
| | | min-width: var(--screen-min-width); |
|---|
| | | z-index: 0px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /* å»é¤é«å¾·å°å¾çåºå®çå·å¾æ */ |
|---|
| | | .amap-logo { |
|---|
| | | display: none; |
|---|
| | | opacity: 0 !important; |
|---|
| | | } |
|---|
| | | .amap-copyright { |
|---|
| | | display: none; |
|---|
| | | opacity: 0 !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .amap-marker-label { |
|---|
| | | font-size: 13px; |
|---|
| | | text-align: center; |
|---|
| | | color: white; |
|---|
| | | background-color: transparent; |
|---|
| | | text-shadow: black 2px 2px 2px; |
|---|
| | | border-radius: 2px; |
|---|
| | | border: 0px; |
|---|
| | | padding: 4px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="width: 70vw; height: 500px; background-color: aliceblue"> |
|---|
| | | <BaseMap></BaseMap> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script setup> |
|---|
| | | const props = defineProps({ |
|---|
| | | // åºæ¯ç¹ä½ä¿¡æ¯ |
|---|
| | | data: Array |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style scoped></style> |
|---|
| | |
|---|
| | | default: '_locations' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | emits: ['update:value'], |
|---|
| | | emits: ['update:value', 'change'], |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | locations: enumLocation(this.allOption, this.level), |
|---|
| | |
|---|
| | | methods: { |
|---|
| | | handleChange(value) { |
|---|
| | | this.$emit('update:value', this.optionFormat(value)); |
|---|
| | | this.$emit('change', this.optionFormat(value)); |
|---|
| | | }, |
|---|
| | | /** |
|---|
| | | * å°åºé项ç»ææ ¼å¼å |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <el-form-item label="æ¶é´" :prop="prop"> |
|---|
| | | <el-form-item :label="label" :prop="prop"> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="date" |
|---|
| | | @change="handleChange" |
|---|
| | | :type="type" |
|---|
| | | placeholder="éæ©æ¶é´" |
|---|
| | | start-placeholder="éæ©å¼å§æ¶é´" |
|---|
| | | end-placeholder="éæ©ç»ææ¶é´" |
|---|
| | | style="width: 150px" |
|---|
| | | /> |
|---|
| | | </el-form-item> |
|---|
| | |
|---|
| | | |
|---|
| | | const MONTH = 'month'; |
|---|
| | | const DATE = 'date'; |
|---|
| | | const RANGE = 'datetimerange'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | |
|---|
| | | default: MONTH |
|---|
| | | }, |
|---|
| | | // è¿åç»æ |
|---|
| | | value: Date, |
|---|
| | | value: Date || Array, |
|---|
| | | // æ¯å¦é»è®¤è¿ååå§é项 |
|---|
| | | initValue: { |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | prop: String |
|---|
| | | label: { |
|---|
| | | type: String, |
|---|
| | | default: 'æ¶é´' |
|---|
| | | }, |
|---|
| | | prop: { |
|---|
| | | type: String, |
|---|
| | | default: 'time' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | emits: ['update:value'], |
|---|
| | | emits: ['update:value', 'change'], |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | date: this.value |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | computed:{ |
|---|
| | | }, |
|---|
| | | computed: {}, |
|---|
| | | methods: { |
|---|
| | | handleChange(value) { |
|---|
| | | this.$emit('update:value', value); |
|---|
| | | }, |
|---|
| | | this.$emit('change', value); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | if (this.initValue) { |
|---|
| | | this.date = new Date() |
|---|
| | | this.date = new Date(); |
|---|
| | | this.handleChange(this.date); |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | // ] |
|---|
| | | // }, |
|---|
| | | { |
|---|
| | | path: '/fysp/task/manage', |
|---|
| | | icon: 'CircleCheck', |
|---|
| | | name: 'ç管任å¡' |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: '/fysp/procheck', |
|---|
| | | icon: 'CircleCheck', |
|---|
| | | name: 'é®é¢å®¡æ ¸' |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | icon: 'List', |
|---|
| | | name: 'ä»»å¡ç®¡ç', |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | path: '/fysp/task/manage', |
|---|
| | | icon: 'CircleCheck', |
|---|
| | | name: 'ç管任å¡', |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: '/fysp/sceneInfo', |
|---|
| | | icon: 'Files', |
|---|
| | | name: 'åºæ¯ä¿¡æ¯', |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // path: '/changecheck', |
|---|
| | | // icon: 'Search', |
|---|
| | | // name: 'æ´æ¹å®¡æ ¸', |
|---|
| | | // }, |
|---|
| | | { |
|---|
| | | path: '/fysp/sceneInfo', |
|---|
| | | icon: 'Files', |
|---|
| | | name: 'åºæ¯ä¿¡æ¯' |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | icon: 'DocumentChecked', |
|---|
| | | name: 'èªå¨è¯ä¼°', |
|---|
| | |
|---|
| | | component: () => import('@/views/fysp/task/MonitorPlanEdit.vue') |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | //ç管任å¡è®¡åç¼è¾ |
|---|
| | | name: 'monitorTaskCreate', |
|---|
| | | path: '/fysp/task/create', |
|---|
| | | component: () => import('@/views/fysp/task/MonitorTaskCreate.vue') |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | //é®é¢å®¡æ ¸ |
|---|
| | | name: 'procheck', |
|---|
| | | path: '/fysp/procheck', |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { ref } from 'vue'; |
|---|
| | | import { defineStore } from 'pinia'; |
|---|
| | | |
|---|
| | | export const useToolboxStore = defineStore('toolbox', () => { |
|---|
| | | // å¼å
³å°ç©æ 注 |
|---|
| | | const featuresStatus = ref(false); |
|---|
| | | // å¼å
³å«æå°å¾ |
|---|
| | | const satelliteStatus = ref(false); |
|---|
| | | // å¼å
³æ§å¶ç½ç |
|---|
| | | const controlbarStatus = ref(false); |
|---|
| | | // å¼å
³åæ æ¾å |
|---|
| | | const coorPickStatus = ref(false); |
|---|
| | | // å¼å
³æ°æ®æ è®° |
|---|
| | | const dataMarkerStatus = ref(true); |
|---|
| | | // å¼å
³æ°æ®å¼¹æ¡ |
|---|
| | | const dataDialogStatus = ref(true); |
|---|
| | | // å¼å
³æº¯æºæ¸
å |
|---|
| | | const sceneSearchStatus = ref(true); |
|---|
| | | |
|---|
| | | return { |
|---|
| | | featuresStatus, |
|---|
| | | satelliteStatus, |
|---|
| | | controlbarStatus, |
|---|
| | | coorPickStatus, |
|---|
| | | dataMarkerStatus, |
|---|
| | | dataDialogStatus, |
|---|
| | | sceneSearchStatus |
|---|
| | | }; |
|---|
| | | }); |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | /* eslint-disable no-undef */ |
|---|
| | | // import '@/lib/AMap'; |
|---|
| | | import { useToolboxStore } from '@/stores/toolbox'; |
|---|
| | | |
|---|
| | | const toolboxStore = useToolboxStore(); |
|---|
| | | |
|---|
| | | var mapInitDone = false; |
|---|
| | | var onMapMountedEvents = []; |
|---|
| | | |
|---|
| | | // å°å¾å¯¹è±¡ |
|---|
| | | var map; |
|---|
| | | // å«æå¾å± |
|---|
| | | var satellite; |
|---|
| | | // å°å¾æå¨æ§å¶ |
|---|
| | | var controlbar; |
|---|
| | | // é¼ æ ç»å¾ |
|---|
| | | var mouseTool; |
|---|
| | | // 3Då¾å± |
|---|
| | | var object3Dlayer; |
|---|
| | | // å°å¾æå¨ç¶æ |
|---|
| | | var isDragging = false; |
|---|
| | | |
|---|
| | | // å°å¾å è½½å®æ触å |
|---|
| | | function onMapMounted(...events) { |
|---|
| | | if (mapInitDone) { |
|---|
| | | events.forEach((e) => { |
|---|
| | | e(); |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | onMapMountedEvents = onMapMountedEvents.concat(events); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | function createMap(id) { |
|---|
| | | _initMap(id); |
|---|
| | | mapInitDone = true; |
|---|
| | | onMapMountedEvents.forEach((e) => { |
|---|
| | | e(); |
|---|
| | | }); |
|---|
| | | onMapMountedEvents = []; |
|---|
| | | } |
|---|
| | | |
|---|
| | | function _initMap(elementId) { |
|---|
| | | map = new AMap.Map(elementId, { |
|---|
| | | rotateEnable: true, |
|---|
| | | pitchEnable: true, |
|---|
| | | alwaysRender: false, |
|---|
| | | showLabel: true, |
|---|
| | | showBuildingBlock: true, |
|---|
| | | mapStyle: 'amap://styles/e1e78509de64ddcd2efb4cb34c6fae2a', |
|---|
| | | features: ['bg', 'road'], |
|---|
| | | pitch: 45, // å°å¾ä¿¯ä»°è§åº¦ï¼ææèå´ 0 度- 83 度 |
|---|
| | | viewMode: '3D', // å°å¾æ¨¡å¼ |
|---|
| | | resizeEnable: true, |
|---|
| | | center: [121.6039283, 31.25295567], |
|---|
| | | zooms: [0, 18], |
|---|
| | | zoom: 14 |
|---|
| | | }); |
|---|
| | | |
|---|
| | | // æ·»å å«æå°å¾ |
|---|
| | | satellite = new AMap.TileLayer.Satellite(); |
|---|
| | | satellite.show(); |
|---|
| | | map.add([satellite]); |
|---|
| | | toolboxStore.featuresStatus = true; |
|---|
| | | |
|---|
| | | // _initControlbar(); |
|---|
| | | // _initMouseTool(); |
|---|
| | | _init3DLayer(); |
|---|
| | | _initDragEvent(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function _initControlbar() { |
|---|
| | | controlbar = new AMap.ControlBar({ |
|---|
| | | position: { |
|---|
| | | right: '300px', |
|---|
| | | top: '260px' |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | map.addControl(controlbar); |
|---|
| | | toolboxStore.controlbarStatus = true; |
|---|
| | | } |
|---|
| | | |
|---|
| | | // é¼ æ ç»å¾åå§å |
|---|
| | | // function _initMouseTool() { |
|---|
| | | // mouseTool = new AMap.MouseTool(map); |
|---|
| | | // } |
|---|
| | | |
|---|
| | | // 3Då¾å±åå§å |
|---|
| | | function _init3DLayer() { |
|---|
| | | object3Dlayer = new AMap.Object3DLayer(); |
|---|
| | | map.add(object3Dlayer); |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 设置å°å¾ææ½çå¬äºä»¶ |
|---|
| | | function _initDragEvent() { |
|---|
| | | let dragEndEvent; |
|---|
| | | map.on('dragstart', () => { |
|---|
| | | clearTimeout(dragEndEvent); |
|---|
| | | isDragging = true; |
|---|
| | | }); |
|---|
| | | map.on('dragend', function () { |
|---|
| | | dragEndEvent = setTimeout(() => { |
|---|
| | | isDragging = false; |
|---|
| | | }, 8000); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | export { |
|---|
| | | createMap, |
|---|
| | | onMapMounted, |
|---|
| | | map, |
|---|
| | | controlbar, |
|---|
| | | mouseTool, |
|---|
| | | satellite, |
|---|
| | | object3Dlayer, |
|---|
| | | isDragging |
|---|
| | | }; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | /** |
|---|
| | | * é«å¾·å°å¾ç¹æ è®°ç»å¶ç¸å
³ |
|---|
| | | */ |
|---|
| | | |
|---|
| | | import { map } from './index_old'; |
|---|
| | | import { useToolboxStore } from '@/stores/toolbox'; |
|---|
| | | |
|---|
| | | const toolboxStore = useToolboxStore(); |
|---|
| | | |
|---|
| | | var _massMarks = undefined; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | /** |
|---|
| | | * ç»å¶æµ·éç¹æ è®° |
|---|
| | | * @param fDatas å®æ´çæµæ°æ® |
|---|
| | | * @param _factor å½åå±ç¤ºççæµå å对象 |
|---|
| | | */ |
|---|
| | | drawMassMarks(fDatas, _factor, onClick) { |
|---|
| | | if (!toolboxStore.dataMarkerStatus) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.clearMassMarks(); |
|---|
| | | const lnglats = fDatas.lnglats_GD; |
|---|
| | | var data = []; |
|---|
| | | for (let i = 0; i < lnglats.length; i++) { |
|---|
| | | data.push({ |
|---|
| | | lnglat: lnglats[i], //ç¹æ è®°ä½ç½® |
|---|
| | | name: `${fDatas.times[i]}<br/>${_factor.factorName}: ${_factor.datas[i].factorData} mg/m³`, |
|---|
| | | id: i |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | // åå»ºæ ·å¼å¯¹è±¡ |
|---|
| | | var styleObject = { |
|---|
| | | url: 'https://a.amap.com/jsapi_demos/static/images/mass1.png', |
|---|
| | | // url: './asset/mipmap/ic_up_white.png', // å¾æ å°å |
|---|
| | | // eslint-disable-next-line no-undef |
|---|
| | | size: new AMap.Size(11, 11), // å¾æ å¤§å° |
|---|
| | | // eslint-disable-next-line no-undef |
|---|
| | | anchor: new AMap.Pixel(5, 5) // å¾æ æ¾ç¤ºä½ç½®å移éï¼åºåç¹ä¸ºå¾æ å·¦ä¸è§ |
|---|
| | | }; |
|---|
| | | // eslint-disable-next-line no-undef |
|---|
| | | var massMarks = new AMap.MassMarks(data, { |
|---|
| | | zIndex: 5, // æµ·éç¹å¾å±å å çé¡ºåº |
|---|
| | | zooms: [15, 18], // å¨æå®å°å¾ç¼©æ¾çº§å«èå´å
å±ç¤ºæµ·éç¹å¾å± |
|---|
| | | style: styleObject // è®¾ç½®æ ·å¼å¯¹è±¡ |
|---|
| | | }); |
|---|
| | | massMarks.on('click', (event) => { |
|---|
| | | const i = event.data.id; |
|---|
| | | // 3. èªå®ä¹ç¹å»äºä»¶ |
|---|
| | | onClick(i); |
|---|
| | | }); |
|---|
| | | // eslint-disable-next-line no-undef |
|---|
| | | var marker = new AMap.Marker({ |
|---|
| | | content: ' ', |
|---|
| | | map: map, |
|---|
| | | // eslint-disable-next-line no-undef |
|---|
| | | offset: new AMap.Pixel(13, 12) |
|---|
| | | }); |
|---|
| | | var timeout; |
|---|
| | | massMarks.on('mouseover', (e) => { |
|---|
| | | if (timeout) { |
|---|
| | | clearTimeout(timeout); |
|---|
| | | } |
|---|
| | | marker.setPosition(e.data.lnglat); |
|---|
| | | marker.setLabel({ content: e.data.name }); |
|---|
| | | map.add(marker); |
|---|
| | | timeout = setTimeout(() => { |
|---|
| | | map.remove(marker); |
|---|
| | | }, 2000); |
|---|
| | | }); |
|---|
| | | _massMarks = massMarks; |
|---|
| | | map.add(massMarks); |
|---|
| | | }, |
|---|
| | | clearMassMarks() { |
|---|
| | | if (_massMarks) { |
|---|
| | | map.remove(_massMarks); |
|---|
| | | _massMarks = undefined; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * å建æ è®°ç¹ |
|---|
| | | * @param {string | Array} img å¾æ æå¾æ æ°ç» |
|---|
| | | * @param {Array} dataList çæµæ°æ® |
|---|
| | | * @param {boolean} collision æ 注é¿è®© |
|---|
| | | * @returns |
|---|
| | | */ |
|---|
| | | createLabelMarks(img, dataList, collision = true) { |
|---|
| | | // eslint-disable-next-line no-undef |
|---|
| | | const layer = new AMap.LabelsLayer({ |
|---|
| | | zooms: [3, 20], |
|---|
| | | zIndex: 1000, |
|---|
| | | // å¼å¯æ 注é¿è®©ï¼é»è®¤ä¸ºå¼å¯ï¼v1.4.15 æ°å¢å±æ§ |
|---|
| | | collision: collision, |
|---|
| | | // å¼å¯æ 注淡å
¥å¨ç»ï¼é»è®¤ä¸ºå¼å¯ï¼v1.4.15 æ°å¢å±æ§ |
|---|
| | | animation: true |
|---|
| | | }); |
|---|
| | | |
|---|
| | | map.add(layer); |
|---|
| | | |
|---|
| | | // var markers = []; |
|---|
| | | for (var i = 0; i < dataList.length; i++) { |
|---|
| | | const data = dataList[i]; |
|---|
| | | var curData = { |
|---|
| | | name: data.name, |
|---|
| | | position: [data.longitude, data.latitude], |
|---|
| | | zooms: [10, 20], |
|---|
| | | opacity: 1, |
|---|
| | | zIndex: 10, |
|---|
| | | icon: { |
|---|
| | | type: 'image', |
|---|
| | | image: typeof img === 'string' ? img : img[i], |
|---|
| | | // clipOrigin: [14, 92], |
|---|
| | | // clipSize: [50, 68], |
|---|
| | | size: [30, 30], |
|---|
| | | anchor: 'bottom-center', |
|---|
| | | angel: 0, |
|---|
| | | retina: true |
|---|
| | | }, |
|---|
| | | text: { |
|---|
| | | content: data.name, |
|---|
| | | direction: 'top', |
|---|
| | | offset: [0, -5], |
|---|
| | | style: { |
|---|
| | | fontSize: 16, |
|---|
| | | fontWeight: 'normal', |
|---|
| | | fillColor: '#fff', |
|---|
| | | strokeColor: '#333', |
|---|
| | | strokeWidth: 0, |
|---|
| | | backgroundColor: '#122b54a9' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | curData.extData = { |
|---|
| | | index: i |
|---|
| | | }; |
|---|
| | | |
|---|
| | | // eslint-disable-next-line no-undef |
|---|
| | | var labelMarker = new AMap.LabelMarker(curData); |
|---|
| | | |
|---|
| | | // markers.push(labelMarker); |
|---|
| | | |
|---|
| | | layer.add(labelMarker); |
|---|
| | | } |
|---|
| | | |
|---|
| | | return layer; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | // å
³é设å¤å¾å¼¹çª |
|---|
| | | beforeDeviceShowDialogclose() { |
|---|
| | | this.deviceShowDialog = false; |
|---|
| | | beforeDeviceShowDialogclose(done) { |
|---|
| | | // this.deviceShowDialog = false; |
|---|
| | | done() |
|---|
| | | }, |
|---|
| | | // å
³éä»»æå¾çå¼¹çª |
|---|
| | | beforeAnyPhotoDialogclose() { |
|---|
| | |
|---|
| | | }, |
|---|
| | | //æ¥è¯¢åä»»å¡ç»è®¡ä¿¡æ¯ |
|---|
| | | search(formSearch) { |
|---|
| | | this.topTask = formSearch.obj; |
|---|
| | | this.topTask = formSearch.topTask; |
|---|
| | | this.sideLoading = true; |
|---|
| | | this.mainLoading = true; |
|---|
| | | this.curProList = []; |
|---|
| | | this.curSubtask = {}; |
|---|
| | | taskApi.getSubtaskSummary(formSearch).then((res) => { |
|---|
| | | const param = { |
|---|
| | | topTaskId: formSearch.topTask.tguid, |
|---|
| | | sceneTypeId :formSearch.sceneTypeId |
|---|
| | | } |
|---|
| | | taskApi.getSubtaskSummary(param).then((res) => { |
|---|
| | | const list = []; |
|---|
| | | res.forEach((s) => { |
|---|
| | | const t = this.getSubtaskType(s); |
|---|
| | |
|---|
| | | /** |
|---|
| | | * è·åè¿ææ
åµ |
|---|
| | | * */ |
|---|
| | | async getRecentPros() { |
|---|
| | | getRecentPros() { |
|---|
| | | this.loading = true; |
|---|
| | | this.subtaskCount = 0 |
|---|
| | | // è·ååä»»å¡å表 |
|---|
| | | await taskApi.getSubtaskByScene(this.generateQueryParam()).then((subtasks) => { |
|---|
| | | taskApi.getSubtaskByScene(this.generateQueryParam()).then((subtasks) => { |
|---|
| | | this.curProList = []; |
|---|
| | | if (subtasks) { |
|---|
| | | subtasks.forEach((subtask) => { |
|---|
| | |
|---|
| | | this.loading = false; |
|---|
| | | }, |
|---|
| | | // æ ¹æ®åä»»å¡è·åéé¢çé®é¢å表 |
|---|
| | | async getProBySubtask(subtask) { |
|---|
| | | getProBySubtask(subtask) { |
|---|
| | | taskApi.getProBySubtask(subtask.stGuid).then((pros) => { |
|---|
| | | if (pros) { |
|---|
| | | pros.forEach((pro) => { |
|---|
| | |
|---|
| | | return new Date(x.dlCreateTime) - new Date(y.dlCreateTime); // éåºï¼ååºååä¹ |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | async getDeviceImgList() { |
|---|
| | | getDeviceImgList() { |
|---|
| | | this.deviceImgObjList = []; |
|---|
| | | for (const deviceTopTypeElement of this.deviceTopTypes) { |
|---|
| | | const topTypeId = deviceTopTypeElement.id; |
|---|
| | | await deviceApi.fetchDevices(this.subtask.sceneId, topTypeId).then((result) => { |
|---|
| | | this.deviceTopTypes.forEach(e => { |
|---|
| | | |
|---|
| | | const topTypeId = e.id; |
|---|
| | | deviceApi.fetchDevices(this.subtask.sceneId, topTypeId).then((result) => { |
|---|
| | | // æ ååå±æ§å |
|---|
| | | for (let i = 0; i < result.data.length; i++) { |
|---|
| | | var element = this.convertKeys(result.data[i]); |
|---|
| | |
|---|
| | | .catch((err) => {}); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | initOptions() { |
|---|
| | | if (this.problem == undefined || this.problem == null) { |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <el-affix :offset="60" target=".el-main"> |
|---|
| | | <div class="page-header"> |
|---|
| | | <el-page-header @back="goBack"> |
|---|
| | | <template #content> |
|---|
| | | <span> {{title}} </span> |
|---|
| | | </template> |
|---|
| | | <template #extra> |
|---|
| | | <div> |
|---|
| | | <el-button type="primary" :disabled="!isEdit" :loading="saveLoading" @click="saveEdit" |
|---|
| | | >ä¿åä¿®æ¹</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-page-header> |
|---|
| | | <!-- <el-divider /> --> |
|---|
| | | </div> |
|---|
| | | </el-affix> |
|---|
| | | <el-row gutter="20"> |
|---|
| | | <el-col :span="16"> |
|---|
| | | <div> |
|---|
| | | <el-text>å·²éåºæ¯</el-text> |
|---|
| | | </div> |
|---|
| | | <el-divider /> |
|---|
| | | <CompMonitorObj |
|---|
| | | :data="curMonitorObjList" |
|---|
| | | show-btn |
|---|
| | | v-model:tabName="curSceneType" |
|---|
| | | v-model:showData="showMonitorObjList" |
|---|
| | | :tabOptions="sceneTypeOptions" |
|---|
| | | @item-click="deleteMov" |
|---|
| | | > |
|---|
| | | </CompMonitorObj> |
|---|
| | | </el-col> |
|---|
| | | <el-col :span="8"> |
|---|
| | | <el-affix :offset="140"> |
|---|
| | | <div> |
|---|
| | | <el-text>å¯éåºæ¯</el-text> |
|---|
| | | </div> |
|---|
| | | <el-divider /> |
|---|
| | | <div> |
|---|
| | | <el-segmented v-model="curSceneType" :options="sceneTypeOptions" /> |
|---|
| | | </div> |
|---|
| | | <FYInfoSearch |
|---|
| | | placeholder="请è¾å
¥åºæ¯å称å
³é®å" |
|---|
| | | :data="showSceneList" |
|---|
| | | :on-search="searchScene" |
|---|
| | | :total="total" |
|---|
| | | scroll-height="65vh" |
|---|
| | | :page-show="false" |
|---|
| | | > |
|---|
| | | <template #default="{ row }"> |
|---|
| | | <ItemScene :item="row"> |
|---|
| | | <el-button-group> |
|---|
| | | <el-button size="small" type="primary" @click="openInsertDialog(row)" |
|---|
| | | >æå
¥</el-button |
|---|
| | | > |
|---|
| | | <el-button size="small" type="primary" @click="openAddDialog(row)">æ°å¢</el-button> |
|---|
| | | </el-button-group> |
|---|
| | | </ItemScene> |
|---|
| | | </template> |
|---|
| | | </FYInfoSearch> |
|---|
| | | </el-affix> |
|---|
| | | </el-col> |
|---|
| | | </el-row> |
|---|
| | | |
|---|
| | | <el-dialog v-model="insertDialog" title="æå
¥åºæ¯è³ç©ºä½ç¼å·" width="500"> |
|---|
| | | <div v-if="valibleIndex.length > 0">以ä¸ä¸ºå¯éç空ä½ç¼å·</div> |
|---|
| | | <div v-else>æ å¯éç空ä½ç¼å·</div> |
|---|
| | | <el-radio-group v-model="selectedIndex" size="default"> |
|---|
| | | <el-radio-button v-for="item in valibleIndex" :key="item" :label="item" :value="item" /> |
|---|
| | | </el-radio-group> |
|---|
| | | <template #footer> |
|---|
| | | <div class="dialog-footer"> |
|---|
| | | <el-button @click="insertDialog = false">åæ¶</el-button> |
|---|
| | | <el-button :disabled="!selectedIndex" type="primary" @click="insertMov"> 确认 </el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-dialog> |
|---|
| | | <el-dialog v-model="addDialog" title="æ°å¢åºæ¯ç¼å·é¡ºå»¶" width="500"> |
|---|
| | | <div>顺延ç¼å·ä¸º:{{ lastIndex }}</div> |
|---|
| | | <template #footer> |
|---|
| | | <div class="dialog-footer"> |
|---|
| | | <el-button @click="addDialog = false">åæ¶</el-button> |
|---|
| | | <el-button type="primary" @click="addMov"> 确认 </el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-dialog> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import CompMonitorObj from './components/CompMonitorObj.vue'; |
|---|
| | | import svUserApi from '@/api/fysp/userApi'; |
|---|
| | | import taskApi from '@/api/fysp/taskApi'; |
|---|
| | | import sceneApi from '@/api/fysp/sceneApi'; |
|---|
| | | import { ElMessage, ElNotification, ElMessageBox } from 'element-plus'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | async beforeRouteLeave(to, from) { |
|---|
| | | // å¨å¯¼èªç¦»å¼æ¸²æ该ç»ä»¶ç对åºè·¯ç±æ¶è°ç¨ |
|---|
| | | // ä¸ `beforeRouteUpdate` ä¸æ ·ï¼å®å¯ä»¥è®¿é®ç»ä»¶å®ä¾ `this` |
|---|
| | | // return this.routerChangeCheck(); |
|---|
| | | }, |
|---|
| | | components: { CompMonitorObj }, |
|---|
| | | props: { |
|---|
| | | title:{ |
|---|
| | | type:String, |
|---|
| | | default: 'æ»ä»»å¡ç¼è¾' |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | // ç管åºæ¯ |
|---|
| | | curMonitorObjList: [], |
|---|
| | | // å½åçéçåºæ¯ç±»å |
|---|
| | | curSceneType: undefined, |
|---|
| | | showMonitorObjList: [], |
|---|
| | | |
|---|
| | | // è¡æ¿åºå |
|---|
| | | area: {}, |
|---|
| | | // ææåºæ¯ |
|---|
| | | sceneList: [], |
|---|
| | | total: 0, |
|---|
| | | |
|---|
| | | // æå
¥å¼¹åºæ¡ |
|---|
| | | insertDialog: false, |
|---|
| | | // æå
¥ææ°å¢çç¼å· |
|---|
| | | selectedIndex: undefined, |
|---|
| | | // æå
¥ææ°å¢çåºæ¯ |
|---|
| | | selectedScene: undefined, |
|---|
| | | // çç®¡æ¬¡æ° |
|---|
| | | monitorTimes: 1, |
|---|
| | | // æ°å¢å¼¹åºæ¡ |
|---|
| | | addDialog: false, |
|---|
| | | // æ°å¢çç管åºæ¯ |
|---|
| | | insertObj: [], |
|---|
| | | // æ´æ°çç管åºæ¯ |
|---|
| | | updateObj: [], |
|---|
| | | // å é¤çç管åºæ¯ |
|---|
| | | deleteObj: [] |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | // å½ååºæ¯ç±»åä¸çå±ç¤ºåºæ¯ |
|---|
| | | showSceneList() { |
|---|
| | | return this.sceneList.filter((v) => { |
|---|
| | | const index = this.curMonitorObjList.findIndex((o) => { |
|---|
| | | return o.sguid == v.guid; |
|---|
| | | }); |
|---|
| | | return index == -1 && v.type == this.curSceneType; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | sceneTypeOptions() { |
|---|
| | | const list = []; |
|---|
| | | this.sceneList.forEach((d) => { |
|---|
| | | if (list.indexOf(d.type) == -1) list.push(d.type); |
|---|
| | | }); |
|---|
| | | return list; |
|---|
| | | }, |
|---|
| | | // å½ååºæ¯ç±»åä¸çå¯æå
¥ç¼å· |
|---|
| | | valibleIndex() { |
|---|
| | | // åå表已ç»æç
§ç¼å·é¡ºåºæå |
|---|
| | | let index = 1; |
|---|
| | | const indexList = []; |
|---|
| | | this.showMonitorObjList.forEach((l) => { |
|---|
| | | while (l.displayid > index) { |
|---|
| | | indexList.push(index); |
|---|
| | | index++; |
|---|
| | | } |
|---|
| | | index++; |
|---|
| | | }); |
|---|
| | | if (this.showMonitorObjList.length == 0 && indexList.length == 0) { |
|---|
| | | indexList.push(1); |
|---|
| | | } |
|---|
| | | return indexList; |
|---|
| | | }, |
|---|
| | | lastIndex() { |
|---|
| | | const len = this.showMonitorObjList.length; |
|---|
| | | if (len > 0) { |
|---|
| | | return this.showMonitorObjList[len - 1].displayid + 1; |
|---|
| | | } else { |
|---|
| | | return 1; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | isEdit() { |
|---|
| | | return this.insertObj.length > 0 || this.deleteObj.length > 0 || this.updateObj.length > 0; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // æ¥è¯¢ |
|---|
| | | searchScene({ text, page, pageSize }) { |
|---|
| | | this.area.sceneName = text; |
|---|
| | | return sceneApi.searchScene(this.area, 1, 10000).then((res) => { |
|---|
| | | if (res.success) { |
|---|
| | | // æ¥è¯¢ç»æ |
|---|
| | | this.sceneList = res.data; |
|---|
| | | // æ»æ°æ®é |
|---|
| | | this.total = res.head.totalCount; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | deleteMov(item) { |
|---|
| | | if (item.extension1) { |
|---|
| | | ElMessage({ |
|---|
| | | message: 'å·²ç管åºæ¯æ æ³ç§»é¤', |
|---|
| | | type: 'error' |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | const i = this.curMonitorObjList.indexOf(item); |
|---|
| | | this.curMonitorObjList.splice(i, 1); |
|---|
| | | const i1 = this.insertObj.indexOf(item); |
|---|
| | | this.insertObj.splice(i1, 1); |
|---|
| | | const i2 = this.updateObj.indexOf(item); |
|---|
| | | this.updateObj.splice(i2, 1); |
|---|
| | | |
|---|
| | | this.deleteObj.push(item); |
|---|
| | | }, |
|---|
| | | openInsertDialog(item) { |
|---|
| | | this.insertDialog = true; |
|---|
| | | this.selectedScene = item; |
|---|
| | | this.monitorTimes = 1; |
|---|
| | | }, |
|---|
| | | openAddDialog(item) { |
|---|
| | | this.addDialog = true; |
|---|
| | | this.selectedScene = item; |
|---|
| | | this.monitorTimes = 1; |
|---|
| | | }, |
|---|
| | | insertMov() { |
|---|
| | | // 1. å建æ°åºæ¯ |
|---|
| | | let mov = this.createMov(this.selectedIndex, this.selectedScene); |
|---|
| | | // 2. æ¥æ¾ç¬¬ä¸ä¸ªç¼å·å¤§äºæå
¥ç¼å·çå¼ï¼å°æ°ç管对象æå
¥å
¶ä¹å |
|---|
| | | const insertAtIndex = this.curMonitorObjList.findIndex((v) => { |
|---|
| | | return v.displayid > this.selectedIndex; |
|---|
| | | }); |
|---|
| | | this.curMonitorObjList.splice(insertAtIndex, 0, mov); |
|---|
| | | this.selectedIndex = undefined; |
|---|
| | | this.insertDialog = false; |
|---|
| | | }, |
|---|
| | | addMov() { |
|---|
| | | // 1. å建æ°åºæ¯ |
|---|
| | | let mov = this.createMov(this.lastIndex, this.selectedScene); |
|---|
| | | // 2. æ·»å è³æ«å°¾ |
|---|
| | | this.curMonitorObjList.push(mov); |
|---|
| | | this.addDialog = false; |
|---|
| | | }, |
|---|
| | | // å建ä¸ä¸ªæ°çç管对象 |
|---|
| | | createMov(displayid, scene) { |
|---|
| | | // 1. æ¥æ¾è¯¥åºæ¯æ¯å¦ä¹å已被å é¤ |
|---|
| | | const index = this.deleteObj.findIndex((v) => { |
|---|
| | | return v.sguid == scene.guid; |
|---|
| | | }); |
|---|
| | | let mov; |
|---|
| | | // 2. è¥æ¯å
¨æ°çåºæ¯ï¼åæ°çæä¸ä¸ªç管对象ï¼å¦ååªæ´æ°ç¼å· |
|---|
| | | if (index == -1) { |
|---|
| | | mov = { |
|---|
| | | tid: this.task.tguid, |
|---|
| | | sguid: scene.guid, |
|---|
| | | sensename: scene.name, |
|---|
| | | tasktypeid: 1, |
|---|
| | | tasktype: 'å·¡æ¥', |
|---|
| | | monitornum: this.monitorTimes, |
|---|
| | | displayid: displayid, |
|---|
| | | sceneTypeId: scene.typeid, |
|---|
| | | sceneType: scene.type |
|---|
| | | }; |
|---|
| | | this.insertObj.push(mov); |
|---|
| | | } else { |
|---|
| | | mov = this.deleteObj[index]; |
|---|
| | | mov.displayid = displayid; |
|---|
| | | this.updateObj.push(mov); |
|---|
| | | this.deleteObj.splice(index, 1); |
|---|
| | | } |
|---|
| | | return mov; |
|---|
| | | }, |
|---|
| | | // ä¿åä¿®æ¹ |
|---|
| | | saveEdit() { |
|---|
| | | // this.saveLoading = true; |
|---|
| | | if (this.insertObj.length > 0) { |
|---|
| | | const p1 = taskApi.addMonitorObject(this.insertObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡æ°å¢å®æ`, |
|---|
| | | message: `æ°å¢åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.insertObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (this.updateObj.length > 0) { |
|---|
| | | const p2 = taskApi.updateMonitorObject(this.updateObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡æ´æ°å®æ`, |
|---|
| | | message: `æ´æ°åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.updateObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (this.deleteObj.length > 0) { |
|---|
| | | const p3 = taskApi.deleteMonitorObject(this.deleteObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡å é¤å®æ`, |
|---|
| | | message: `å é¤åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.deleteObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | // return Promise.all([p1, p2, p3]).finally(() => { |
|---|
| | | // this.saveLoading = false; |
|---|
| | | // }); |
|---|
| | | }, |
|---|
| | | async goBack() { |
|---|
| | | // const answer = await this.routerChangeCheck() |
|---|
| | | // if (answer) { |
|---|
| | | // this.$router.back(); |
|---|
| | | // } |
|---|
| | | this.$router.back(); |
|---|
| | | }, |
|---|
| | | async routerChangeCheck() { |
|---|
| | | if (this.isEdit) { |
|---|
| | | const answer = await ElMessageBox.confirm('æ¯å¦æ¾å¼å·²ä¿®æ¹çæ»ä»»å¡ï¼', 'åæ¶æ»ä»»å¡ä¿®æ¹', { |
|---|
| | | confirmButtonText: '确认', |
|---|
| | | cancelButtonText: 'åæ¶', |
|---|
| | | type: 'warning' |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | return true; |
|---|
| | | }) |
|---|
| | | .catch(() => { |
|---|
| | | return false; |
|---|
| | | }); |
|---|
| | | return answer; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | // ç管åºæ¯ä¿¡æ¯ |
|---|
| | | this.curMonitorObjList = JSON.parse(decodeURIComponent(this.$route.query.data)); |
|---|
| | | // æ ¹æ®æ»ä»»å¡è·åè¡æ¿åºåä¿¡æ¯ |
|---|
| | | const task = JSON.parse(decodeURIComponent(this.$route.query.task)); |
|---|
| | | this.task = task; |
|---|
| | | this.area = { |
|---|
| | | provincecode: task.provincecode, |
|---|
| | | provincename: task.provincename, |
|---|
| | | citycode: task.citycode, |
|---|
| | | cityname: task.cityname, |
|---|
| | | districtcode: task.districtcode, |
|---|
| | | districtname: task.districtname, |
|---|
| | | towncode: task.towncode, |
|---|
| | | townname: task.townname, |
|---|
| | | online: true |
|---|
| | | }; |
|---|
| | | this.searchScene({ text: '' }); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped> |
|---|
| | | .page-header { |
|---|
| | | background-color: white; |
|---|
| | | padding: 10px 0; |
|---|
| | | border-bottom: 1px solid var(--el-color-info-light-7); |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <el-affix :offset="60"> |
|---|
| | | <el-affix :offset="60" target=".el-main"> |
|---|
| | | <div class="page-header"> |
|---|
| | | <el-page-header @back="goBack"> |
|---|
| | | <template #content> |
|---|
| | |
|---|
| | | </template> |
|---|
| | | <template #extra> |
|---|
| | | <div> |
|---|
| | | <el-button type="primary" :disabled="!isEdit" :loading="saveLoading" @click="saveEdit" |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | :disabled="!isEdit" |
|---|
| | | :loading="saveLoading" |
|---|
| | | @click="handleSaveClick" |
|---|
| | | >ä¿åä¿®æ¹</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <el-divider /> |
|---|
| | | </div> |
|---|
| | | </el-affix> |
|---|
| | | <el-row gutter="20"> |
|---|
| | | <el-col :span="16"> |
|---|
| | | <div> |
|---|
| | | <el-text>å·²éåºæ¯</el-text> |
|---|
| | | </div> |
|---|
| | | <el-divider /> |
|---|
| | | <CompMonitorObj |
|---|
| | | :data="curMonitorObjList" |
|---|
| | | show-btn |
|---|
| | | v-model:tabName="curSceneType" |
|---|
| | | v-model:showData="showMonitorObjList" |
|---|
| | | :tabOptions="sceneTypeOptions" |
|---|
| | | @item-click="deleteMov" |
|---|
| | | > |
|---|
| | | </CompMonitorObj> |
|---|
| | | </el-col> |
|---|
| | | <el-col :span="8"> |
|---|
| | | <el-affix :offset="140"> |
|---|
| | | <div> |
|---|
| | | <el-text>å¯éåºæ¯</el-text> |
|---|
| | | </div> |
|---|
| | | <el-divider /> |
|---|
| | | <div> |
|---|
| | | <el-segmented v-model="curSceneType" :options="sceneTypeOptions" /> |
|---|
| | | </div> |
|---|
| | | <FYInfoSearch |
|---|
| | | placeholder="请è¾å
¥åºæ¯å称å
³é®å" |
|---|
| | | :data="showSceneList" |
|---|
| | | :on-search="searchScene" |
|---|
| | | :total="total" |
|---|
| | | scroll-height="70vh" |
|---|
| | | :page-show="false" |
|---|
| | | > |
|---|
| | | <template #default="{ row }"> |
|---|
| | | <ItemScene :item="row"> |
|---|
| | | <el-button-group> |
|---|
| | | <el-button size="small" type="primary" @click="openInsertDialog(row)" |
|---|
| | | >æå
¥</el-button |
|---|
| | | > |
|---|
| | | <el-button size="small" type="primary" @click="openAddDialog(row)">æ°å¢</el-button> |
|---|
| | | </el-button-group> |
|---|
| | | </ItemScene> |
|---|
| | | </template> |
|---|
| | | </FYInfoSearch> |
|---|
| | | </el-affix> |
|---|
| | | </el-col> |
|---|
| | | </el-row> |
|---|
| | | |
|---|
| | | <el-dialog v-model="insertDialog" title="æå
¥åºæ¯è³ç©ºä½ç¼å·" width="500"> |
|---|
| | | <div>以ä¸ä¸ºå¯éç空ä½ç¼å·</div> |
|---|
| | | <el-radio-group v-model="selectedIndex" size="default"> |
|---|
| | | <el-radio-button v-for="item in valibleIndex" :key="item" :label="item" :value="item" /> |
|---|
| | | </el-radio-group> |
|---|
| | | <template #footer> |
|---|
| | | <div class="dialog-footer"> |
|---|
| | | <el-button @click="insertDialog = false">åæ¶</el-button> |
|---|
| | | <el-button :disabled="!selectedIndex" type="primary" @click="insertMov"> 确认 </el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-dialog> |
|---|
| | | <el-dialog v-model="addDialog" title="æ°å¢åºæ¯ç¼å·é¡ºå»¶" width="500"> |
|---|
| | | <div>顺延ç¼å·ä¸º:{{ lastIndex }}</div> |
|---|
| | | <template #footer> |
|---|
| | | <div class="dialog-footer"> |
|---|
| | | <el-button @click="addDialog = false">åæ¶</el-button> |
|---|
| | | <el-button type="primary" @click="addMov"> 确认 </el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-dialog> |
|---|
| | | <CompMonitorObjEdit |
|---|
| | | ref="objEditRef" |
|---|
| | | :task="task" |
|---|
| | | :objList="curMonitorObjList" |
|---|
| | | @upload-success="goBack" |
|---|
| | | ></CompMonitorObjEdit> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import CompMonitorObj from './components/CompMonitorObj.vue'; |
|---|
| | | import svUserApi from '@/api/fysp/userApi'; |
|---|
| | | import taskApi from '@/api/fysp/taskApi'; |
|---|
| | | import sceneApi from '@/api/fysp/sceneApi'; |
|---|
| | | import { ElMessage, ElNotification, ElMessageBox } from 'element-plus'; |
|---|
| | | <script setup> |
|---|
| | | import { ref, computed, onMounted } from 'vue'; |
|---|
| | | import CompMonitorObjEdit from './components/CompMonitorObjEdit.vue'; |
|---|
| | | import { useRoute, useRouter } from 'vue-router'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | async beforeRouteLeave(to, from) { |
|---|
| | | // å¨å¯¼èªç¦»å¼æ¸²æ该ç»ä»¶ç对åºè·¯ç±æ¶è°ç¨ |
|---|
| | | // ä¸ `beforeRouteUpdate` ä¸æ ·ï¼å®å¯ä»¥è®¿é®ç»ä»¶å®ä¾ `this` |
|---|
| | | // return this.routerChangeCheck(); |
|---|
| | | }, |
|---|
| | | components: { CompMonitorObj }, |
|---|
| | | props: {}, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | // ç管åºæ¯ |
|---|
| | | curMonitorObjList: [], |
|---|
| | | // å½åçéçåºæ¯ç±»å |
|---|
| | | curSceneType: undefined, |
|---|
| | | showMonitorObjList: [], |
|---|
| | | const route = useRoute(); |
|---|
| | | const router = useRouter(); |
|---|
| | | |
|---|
| | | // è¡æ¿åºå |
|---|
| | | area: {}, |
|---|
| | | // ææåºæ¯ |
|---|
| | | sceneList: [], |
|---|
| | | total: 0, |
|---|
| | | const objEditRef = ref(null); |
|---|
| | | const curMonitorObjList = ref([]); |
|---|
| | | const task = ref({}); |
|---|
| | | |
|---|
| | | // æå
¥å¼¹åºæ¡ |
|---|
| | | insertDialog: false, |
|---|
| | | // æå
¥ææ°å¢çç¼å· |
|---|
| | | selectedIndex: undefined, |
|---|
| | | // æå
¥ææ°å¢çåºæ¯ |
|---|
| | | selectedScene: undefined, |
|---|
| | | // çç®¡æ¬¡æ° |
|---|
| | | monitorTimes: 1, |
|---|
| | | // æ°å¢å¼¹åºæ¡ |
|---|
| | | addDialog: false, |
|---|
| | | // æ°å¢çç管åºæ¯ |
|---|
| | | insertObj: [], |
|---|
| | | // æ´æ°çç管åºæ¯ |
|---|
| | | updateObj: [], |
|---|
| | | // å é¤çç管åºæ¯ |
|---|
| | | deleteObj: [] |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | // å½ååºæ¯ç±»åä¸çå±ç¤ºåºæ¯ |
|---|
| | | showSceneList() { |
|---|
| | | return this.sceneList.filter((v) => { |
|---|
| | | const index = this.curMonitorObjList.findIndex((o) => { |
|---|
| | | return o.sguid == v.guid; |
|---|
| | | }); |
|---|
| | | return index == -1 && v.type == this.curSceneType; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | sceneTypeOptions() { |
|---|
| | | const list = []; |
|---|
| | | this.sceneList.forEach((d) => { |
|---|
| | | if (list.indexOf(d.type) == -1) list.push(d.type); |
|---|
| | | }); |
|---|
| | | return list; |
|---|
| | | }, |
|---|
| | | // å½ååºæ¯ç±»åä¸çå¯æå
¥ç¼å· |
|---|
| | | valibleIndex() { |
|---|
| | | // åå表已ç»æç
§ç¼å·é¡ºåºæå |
|---|
| | | let index = 1; |
|---|
| | | const indexList = []; |
|---|
| | | this.showMonitorObjList.forEach((l) => { |
|---|
| | | while (l.displayid > index) { |
|---|
| | | indexList.push(index); |
|---|
| | | index++; |
|---|
| | | } |
|---|
| | | index++; |
|---|
| | | }); |
|---|
| | | if (indexList.length == 0) { |
|---|
| | | indexList.push(1); |
|---|
| | | } |
|---|
| | | return indexList; |
|---|
| | | }, |
|---|
| | | lastIndex() { |
|---|
| | | const len = this.showMonitorObjList.length; |
|---|
| | | if (len > 0) { |
|---|
| | | return this.showMonitorObjList[len - 1].displayid + 1; |
|---|
| | | } else { |
|---|
| | | return 1; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | isEdit() { |
|---|
| | | return this.insertObj.length > 0 || this.deleteObj.length > 0 || this.updateObj.length > 0; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // æ¥è¯¢ |
|---|
| | | searchScene({ text, page, pageSize }) { |
|---|
| | | this.area.sceneName = text; |
|---|
| | | return sceneApi.searchScene(this.area, 1, 10000).then((res) => { |
|---|
| | | if (res.success) { |
|---|
| | | // æ¥è¯¢ç»æ |
|---|
| | | this.sceneList = res.data; |
|---|
| | | // æ»æ°æ®é |
|---|
| | | this.total = res.head.totalCount; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | deleteMov(item) { |
|---|
| | | if (item.extension1) { |
|---|
| | | ElMessage({ |
|---|
| | | message: 'å·²ç管åºæ¯æ æ³ç§»é¤', |
|---|
| | | type: 'error' |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | const i = this.curMonitorObjList.indexOf(item); |
|---|
| | | this.curMonitorObjList.splice(i, 1); |
|---|
| | | const i1 = this.insertObj.indexOf(item); |
|---|
| | | this.insertObj.splice(i1, 1); |
|---|
| | | const i2 = this.updateObj.indexOf(item); |
|---|
| | | this.updateObj.splice(i2, 1); |
|---|
| | | const isEdit = computed(() => { |
|---|
| | | return objEditRef.value ? objEditRef.value.isEdit : false; |
|---|
| | | }); |
|---|
| | | |
|---|
| | | this.deleteObj.push(item); |
|---|
| | | }, |
|---|
| | | openInsertDialog(item) { |
|---|
| | | this.insertDialog = true; |
|---|
| | | this.selectedScene = item; |
|---|
| | | this.monitorTimes = 1; |
|---|
| | | }, |
|---|
| | | openAddDialog(item) { |
|---|
| | | this.addDialog = true; |
|---|
| | | this.selectedScene = item; |
|---|
| | | this.monitorTimes = 1; |
|---|
| | | }, |
|---|
| | | insertMov() { |
|---|
| | | // 1. å建æ°åºæ¯ |
|---|
| | | let mov = this.createMov(this.selectedIndex, this.selectedScene); |
|---|
| | | // 2. æ¥æ¾ç¬¬ä¸ä¸ªç¼å·å¤§äºæå
¥ç¼å·çå¼ï¼å°æ°ç管对象æå
¥å
¶ä¹å |
|---|
| | | const insertAtIndex = this.curMonitorObjList.findIndex((v) => { |
|---|
| | | return v.displayid > this.selectedIndex; |
|---|
| | | }); |
|---|
| | | this.curMonitorObjList.splice(insertAtIndex, 0, mov); |
|---|
| | | this.selectedIndex = undefined; |
|---|
| | | this.insertDialog = false; |
|---|
| | | }, |
|---|
| | | addMov() { |
|---|
| | | // 1. å建æ°åºæ¯ |
|---|
| | | let mov = this.createMov(this.lastIndex, this.selectedScene); |
|---|
| | | // 2. æ·»å è³æ«å°¾ |
|---|
| | | this.curMonitorObjList.push(mov); |
|---|
| | | this.addDialog = false; |
|---|
| | | }, |
|---|
| | | // å建ä¸ä¸ªæ°çç管对象 |
|---|
| | | createMov(displayid, scene) { |
|---|
| | | // 1. æ¥æ¾è¯¥åºæ¯æ¯å¦ä¹å已被å é¤ |
|---|
| | | const index = this.deleteObj.findIndex((v) => { |
|---|
| | | return v.sguid == scene.guid; |
|---|
| | | }); |
|---|
| | | let mov; |
|---|
| | | // 2. è¥æ¯å
¨æ°çåºæ¯ï¼åæ°çæä¸ä¸ªç管对象ï¼å¦ååªæ´æ°ç¼å· |
|---|
| | | if (index == -1) { |
|---|
| | | mov = { |
|---|
| | | tid: this.task.tguid, |
|---|
| | | sguid: scene.guid, |
|---|
| | | sensename: scene.name, |
|---|
| | | tasktypeid: 1, |
|---|
| | | tasktype: 'å·¡æ¥', |
|---|
| | | monitornum: this.monitorTimes, |
|---|
| | | displayid: displayid, |
|---|
| | | sceneTypeId: scene.typeid, |
|---|
| | | sceneType: scene.type |
|---|
| | | }; |
|---|
| | | this.insertObj.push(mov); |
|---|
| | | } else { |
|---|
| | | mov = this.deleteObj[index]; |
|---|
| | | mov.displayid = displayid; |
|---|
| | | this.updateObj.push(mov); |
|---|
| | | this.deleteObj.splice(index, 1); |
|---|
| | | } |
|---|
| | | return mov; |
|---|
| | | }, |
|---|
| | | // ä¿åä¿®æ¹ |
|---|
| | | saveEdit() { |
|---|
| | | // this.saveLoading = true; |
|---|
| | | if (this.insertObj.length > 0) { |
|---|
| | | const p1 = taskApi.addMonitorObject(this.insertObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡ä¿®æ¹æå`, |
|---|
| | | message: `æ°å¢åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.insertObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (this.updateObj.length > 0) { |
|---|
| | | const p2 = taskApi.updateMonitorObject(this.updateObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡ä¿®æ¹æå`, |
|---|
| | | message: `æ´æ°åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.updateObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (this.deleteObj.length > 0) { |
|---|
| | | const p3 = taskApi.deleteMonitorObject(this.deleteObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡ä¿®æ¹æå`, |
|---|
| | | message: `å é¤åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.deleteObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | // return Promise.all([p1, p2, p3]).finally(() => { |
|---|
| | | // this.saveLoading = false; |
|---|
| | | // }); |
|---|
| | | }, |
|---|
| | | async goBack() { |
|---|
| | | // const answer = await this.routerChangeCheck() |
|---|
| | | // if (answer) { |
|---|
| | | // this.$router.back(); |
|---|
| | | // } |
|---|
| | | this.$router.back(); |
|---|
| | | }, |
|---|
| | | async routerChangeCheck() { |
|---|
| | | if (this.isEdit) { |
|---|
| | | const answer = await ElMessageBox.confirm('æ¯å¦æ¾å¼å·²ä¿®æ¹çæ»ä»»å¡ï¼', 'åæ¶æ»ä»»å¡ä¿®æ¹', { |
|---|
| | | confirmButtonText: '确认', |
|---|
| | | cancelButtonText: 'åæ¶', |
|---|
| | | type: 'warning' |
|---|
| | | }) |
|---|
| | | .then(() => { |
|---|
| | | return true; |
|---|
| | | }) |
|---|
| | | .catch(() => { |
|---|
| | | return false; |
|---|
| | | }); |
|---|
| | | return answer; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | // ç管åºæ¯ä¿¡æ¯ |
|---|
| | | this.curMonitorObjList = JSON.parse(decodeURIComponent(this.$route.query.data)); |
|---|
| | | // æ ¹æ®æ»ä»»å¡è·åè¡æ¿åºåä¿¡æ¯ |
|---|
| | | const task = JSON.parse(decodeURIComponent(this.$route.query.task)); |
|---|
| | | this.task = task; |
|---|
| | | this.area = { |
|---|
| | | provincecode: task.provincecode, |
|---|
| | | provincename: task.provincename, |
|---|
| | | citycode: task.citycode, |
|---|
| | | cityname: task.cityname, |
|---|
| | | districtcode: task.districtcode, |
|---|
| | | districtname: task.districtname, |
|---|
| | | towncode: task.towncode, |
|---|
| | | townname: task.townname, |
|---|
| | | online: true |
|---|
| | | }; |
|---|
| | | this.searchScene({ text: '' }); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | function handleSaveClick() { |
|---|
| | | objEditRef.value.saveEdit(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function goBack() { |
|---|
| | | router.back(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | onMounted(() => { |
|---|
| | | // ç管åºæ¯ä¿¡æ¯ |
|---|
| | | // curMonitorObjList.value = JSON.parse(decodeURIComponent(route.query.data)); |
|---|
| | | // æ»ä»»å¡ |
|---|
| | | task.value = JSON.parse(decodeURIComponent(route.query.task)); |
|---|
| | | // ç管åºæ¯ä¿¡æ¯ |
|---|
| | | curMonitorObjList.value = JSON.parse( |
|---|
| | | decodeURIComponent(route.query.data) |
|---|
| | | ); |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped> |
|---|
| | | .page-header { |
|---|
| | | background-color: #fff; |
|---|
| | | background-color: white; |
|---|
| | | padding: 10px 0; |
|---|
| | | /* border-bottom: 1px solid var(--el-color-info-light-7); */ |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <el-affix :offset="60" target=".el-main"> |
|---|
| | | <div class="page-header"> |
|---|
| | | <el-page-header @back="goBack"> |
|---|
| | | <template #content> |
|---|
| | | <span> æ°å»ºå·¡æ¥æ»ä»»å¡ </span> |
|---|
| | | <el-text type="info">ï¼ä»»å¡æ¨¡æ¿ï¼{{ lastTask.name }}ï¼</el-text> |
|---|
| | | </template> |
|---|
| | | <template #extra> |
|---|
| | | <div> |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | :disabled="!isEdit" |
|---|
| | | :loading="saveLoading" |
|---|
| | | @click="handleSaveClick" |
|---|
| | | >æ交</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-page-header> |
|---|
| | | <el-divider /> |
|---|
| | | </div> |
|---|
| | | </el-affix> |
|---|
| | | <CompMonitorObjEdit |
|---|
| | | ref="objEditRef" |
|---|
| | | create |
|---|
| | | :task="task" |
|---|
| | | :objList="curMonitorObjList" |
|---|
| | | @upload-success="goBack" |
|---|
| | | ></CompMonitorObjEdit> |
|---|
| | | </template> |
|---|
| | | <script setup> |
|---|
| | | import { ref, computed, onMounted } from 'vue'; |
|---|
| | | import { useRoute, useRouter } from 'vue-router'; |
|---|
| | | import CompMonitorObjEdit from './components/CompMonitorObjEdit.vue'; |
|---|
| | | import taskApi from '../../../api/fysp/taskApi'; |
|---|
| | | |
|---|
| | | const route = useRoute(); |
|---|
| | | const router = useRouter(); |
|---|
| | | |
|---|
| | | const objEditRef = ref(null); |
|---|
| | | const curMonitorObjList = ref([]); |
|---|
| | | const task = ref({}); |
|---|
| | | const lastTask = ref({}) |
|---|
| | | |
|---|
| | | const isEdit = computed(()=>{ |
|---|
| | | return objEditRef.value ? objEditRef.value.isEdit : false |
|---|
| | | }) |
|---|
| | | |
|---|
| | | function handleSaveClick() { |
|---|
| | | objEditRef.value.saveEdit() |
|---|
| | | } |
|---|
| | | |
|---|
| | | function goBack() { |
|---|
| | | router.back(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function getLastTopTask(task) { |
|---|
| | | taskApi.getLastTopTask(task).then(t=>{ |
|---|
| | | lastTask.value = t |
|---|
| | | if (t) { |
|---|
| | | taskApi |
|---|
| | | .fetchMonitorObjectVersion(t.tguid) |
|---|
| | | .then((res) => { |
|---|
| | | // 以åå²ç管åºæ¯ä¸ºåºç¡ï¼åæ¶åå§åé¨åå±æ§ |
|---|
| | | res.forEach(e => { |
|---|
| | | e.movid = null |
|---|
| | | e.tid = task.tguid |
|---|
| | | e.extension1 = null |
|---|
| | | }); |
|---|
| | | curMonitorObjList.value = res; |
|---|
| | | }) |
|---|
| | | .finally(() => { |
|---|
| | | // this.mainLoading = false; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | onMounted(() => { |
|---|
| | | // ç管åºæ¯ä¿¡æ¯ |
|---|
| | | // curMonitorObjList.value = JSON.parse(decodeURIComponent(route.query.data)); |
|---|
| | | // æ»ä»»å¡ |
|---|
| | | task.value = JSON.parse(decodeURIComponent(route.query.task)); |
|---|
| | | getLastTopTask(task.value) |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style scoped> |
|---|
| | | .page-header { |
|---|
| | | background-color: white; |
|---|
| | | padding-top: 20px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <BaseContentLayout> |
|---|
| | | <template #header> |
|---|
| | | <FYSearchBar @search="search"> |
|---|
| | | <!-- <FYSearchBar @search="search"> |
|---|
| | | <template #options> |
|---|
| | | <!-- åºå¿ --> |
|---|
| | | <FYOptionLocation |
|---|
| | | :allOption="true" |
|---|
| | | :level="3" |
|---|
| | |
|---|
| | | v-model:value="formSearch.locations" |
|---|
| | | ></FYOptionLocation> |
|---|
| | | </template> |
|---|
| | | <!-- <template #buttons> |
|---|
| | | <slot name="buttons"></slot> |
|---|
| | | </template> --> |
|---|
| | | </FYSearchBar> |
|---|
| | | </FYSearchBar> --> |
|---|
| | | </template> |
|---|
| | | <template #aside> |
|---|
| | | <SideList :items="tasks" :loading="sideLoading" @item-click="chooseTask"></SideList> |
|---|
| | | <SideList |
|---|
| | | :items="tasks" |
|---|
| | | :loading="sideLoading" |
|---|
| | | @item-click="chooseTask" |
|---|
| | | ></SideList> |
|---|
| | | </template> |
|---|
| | | <template #main> |
|---|
| | | <ToolBar |
|---|
| | |
|---|
| | | v-loading="mainLoading" |
|---|
| | | > |
|---|
| | | <el-row justify="space-between"> |
|---|
| | | <div><el-text>ç管计å</el-text></div> |
|---|
| | | <el-button type="warning" size="small" @click="editPlan">计åè°æ´</el-button> |
|---|
| | | <CompMonitorPlan :task="curTask.data"></CompMonitorPlan> |
|---|
| | | <!-- <div><el-text>ç管计å</el-text></div> |
|---|
| | | <el-button type="warning" size="small" @click="editPlan" |
|---|
| | | >计åè°æ´</el-button |
|---|
| | | > --> |
|---|
| | | <el-tabs model-value="first"> |
|---|
| | | <el-tab-pane label="ç管计å" name="first"> |
|---|
| | | <el-row> |
|---|
| | | <el-col :span="curSubTaskList.length > 0 ? 16 : 24"> |
|---|
| | | <CompMonitorPlan |
|---|
| | | :task="curTask.data" |
|---|
| | | @date-change="onDateChange" |
|---|
| | | ></CompMonitorPlan> |
|---|
| | | </el-col> |
|---|
| | | <el-col v-if="curSubTaskList.length > 0" :span="8"> |
|---|
| | | <CompSubTaskList |
|---|
| | | :data="curSubTaskList" |
|---|
| | | height="56vh" |
|---|
| | | @add="subTaskDrawer = true" |
|---|
| | | ></CompSubTaskList> |
|---|
| | | </el-col> |
|---|
| | | </el-row> |
|---|
| | | </el-tab-pane> |
|---|
| | | <el-tab-pane label="ç管å°å¾" name="second"> |
|---|
| | | <CompTaskMap></CompTaskMap> |
|---|
| | | </el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | </el-row> |
|---|
| | | <el-divider></el-divider> |
|---|
| | | <el-row justify="space-between"> |
|---|
| | | <div><el-text>ç管åºæ¯</el-text></div> |
|---|
| | | <el-button type="warning" size="small" @click="editTask">åºæ¯è°æ´</el-button> |
|---|
| | | <el-button type="warning" size="small" @click="editTask" |
|---|
| | | >åºæ¯è°æ´</el-button |
|---|
| | | > |
|---|
| | | </el-row> |
|---|
| | | <CompMonitorObj :data="curMonitorObjList"></CompMonitorObj> |
|---|
| | | <!-- <div><el-text>ç管åºæ¯</el-text></div> |
|---|
| | | <div> |
|---|
| | | <el-space wrap> |
|---|
| | | <ItemMonitorObj |
|---|
| | | v-for="item in curMonitorObjList" |
|---|
| | | :key="item.movid" |
|---|
| | | :item="item" |
|---|
| | | ></ItemMonitorObj> |
|---|
| | | </el-space> |
|---|
| | | </div> --> |
|---|
| | | </el-scrollbar> |
|---|
| | | <el-empty v-else description="ææ è®°å½" v-loading="mainLoading" /> |
|---|
| | | <div v-else> |
|---|
| | | <el-empty description="ææ è®°å½" v-loading="mainLoading" /> |
|---|
| | | <el-row v-if="!mainLoading" justify="center"> |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | size="default" |
|---|
| | | @click="navToTaskCreate(curTask.data)" |
|---|
| | | >æ·»å ç管åºæ¯</el-button |
|---|
| | | > |
|---|
| | | </el-row> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </BaseContentLayout> |
|---|
| | | <el-drawer |
|---|
| | | v-model="subTaskDrawer" |
|---|
| | | title="æ¥è®¡å管ç" |
|---|
| | | direction="btt" |
|---|
| | | size="96%" |
|---|
| | | destroy-on-close |
|---|
| | | > |
|---|
| | | <CompDayTask |
|---|
| | | :day-task="curDayTask" |
|---|
| | | :mObjList="curMonitorObjList" |
|---|
| | | ></CompDayTask> |
|---|
| | | </el-drawer> |
|---|
| | | <el-dialog |
|---|
| | | v-model="topTaskAddVisible" |
|---|
| | | width="600" |
|---|
| | | title="ä¸é®å建æ»ä»»å¡" |
|---|
| | | destroy-on-close |
|---|
| | | :close-on-click-modal="false" |
|---|
| | | :close-on-press-escape="false" |
|---|
| | | :show-close="false" |
|---|
| | | > |
|---|
| | | <CompTaskEdit |
|---|
| | | @submit="navToTaskCreate" |
|---|
| | | @cancel="topTaskAddVisible = false" |
|---|
| | | ></CompTaskEdit> |
|---|
| | | </el-dialog> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import taskApi from '@/api/fysp/taskApi'; |
|---|
| | | import CompMonitorObj from './components/CompMonitorObj.vue'; |
|---|
| | | import CompMonitorPlan from './components/CompMonitorPlan.vue'; |
|---|
| | | import CompDayTask from './components/CompDayTask.vue'; |
|---|
| | | import CompTaskMap from './components/CompTaskMap.vue'; |
|---|
| | | import CompTaskEdit from './components/CompTaskEdit.vue'; |
|---|
| | | import CompSubTaskList from './components/CompSubTaskList.vue'; |
|---|
| | | export default { |
|---|
| | | beforeRouteEnter(to, from, next) { |
|---|
| | | // å¨æ¸²æ该ç»ä»¶ç对åºè·¯ç±è¢«éªè¯åè°ç¨ |
|---|
| | |
|---|
| | | next((vm) => { |
|---|
| | | if (from.name == 'monitorObjEdit' && vm.task) { |
|---|
| | | vm.chooseTask(vm.task); |
|---|
| | | } else if (from.name == 'monitorTaskCreate') { |
|---|
| | | vm.search(); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | components: { CompMonitorObj, CompMonitorPlan }, |
|---|
| | | components: { |
|---|
| | | CompMonitorObj, |
|---|
| | | CompMonitorPlan, |
|---|
| | | CompDayTask, |
|---|
| | | CompTaskMap, |
|---|
| | | CompTaskEdit, |
|---|
| | | CompSubTaskList |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | formSearch: { |
|---|
| | |
|---|
| | | curTask: {}, |
|---|
| | | //æä½æé® |
|---|
| | | buttons: [ |
|---|
| | | // { |
|---|
| | | // name: '计åè°æ´', |
|---|
| | | // color: 'success' |
|---|
| | | // }, |
|---|
| | | { |
|---|
| | | name: 'ä¸é®å建æ»ä»»å¡', |
|---|
| | | color: 'success', |
|---|
| | | click: () => { |
|---|
| | | this.topTaskAddVisible = true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // { |
|---|
| | | // name: 'åºæ¯è°æ´', |
|---|
| | | // color: 'warning' |
|---|
| | | // } |
|---|
| | | ] |
|---|
| | | ], |
|---|
| | | // åä»»å¡ç¼è¾å¼¹åºæ¡ |
|---|
| | | subTaskDrawer: false, |
|---|
| | | // å½åéæ©çæ¥ä»»å¡ |
|---|
| | | curDayTask: {}, |
|---|
| | | // å½åéæ©çæ¥ä»»å¡ä¸çåä»»å¡ |
|---|
| | | curSubTaskList: [], |
|---|
| | | // æ»ä»»å¡æ°å¢å¼¹åºæ¡ |
|---|
| | | topTaskAddVisible: false |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | |
|---|
| | | this.task = task; |
|---|
| | | this.sideLoading = false; |
|---|
| | | this.mainLoading = true; |
|---|
| | | this.curSubTaskList = [] |
|---|
| | | taskApi |
|---|
| | | .fetchMonitorObjectVersion(task.data.tguid) |
|---|
| | | .then((res) => { |
|---|
| | |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | editPlan(){ |
|---|
| | | editPlan() { |
|---|
| | | this.$router.push({ |
|---|
| | | name: 'monitorPlanEdit', |
|---|
| | | query: { |
|---|
| | | data: encodeURIComponent(JSON.stringify(this.curMonitorObjList)), |
|---|
| | | task: encodeURIComponent(JSON.stringify(this.curTask.data)), |
|---|
| | | task: encodeURIComponent(JSON.stringify(this.curTask.data)) |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | onDateChange(dayTask) { |
|---|
| | | // this.subTaskDrawer = true; |
|---|
| | | this.curDayTask = dayTask; |
|---|
| | | taskApi.fetchSubtaskByDayTask(dayTask.guid).then((res) => { |
|---|
| | | this.curSubTaskList = res; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | navToTaskCreate(value) { |
|---|
| | | this.topTaskAddVisible = false; |
|---|
| | | this.$router.push({ |
|---|
| | | name: 'monitorTaskCreate', |
|---|
| | | query: { |
|---|
| | | task: encodeURIComponent(JSON.stringify(value)) |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-scrollbar { |
|---|
| | | height: calc((100vh - 60px * 2 - 20px * 2 - var(--height-toolbar))); |
|---|
| | | height: calc((100vh - 60px - 20px * 2 - var(--height-toolbar))); |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | export default { |
|---|
| | | /** |
|---|
| | | * çæå·¡æ¥åä»»å¡å¯¹è±¡ |
|---|
| | | */ |
|---|
| | | ceateSubTask(){ |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <el-row gutter="20"> |
|---|
| | | <el-col :span="16"> |
|---|
| | | <div> |
|---|
| | | <el-text>ç管åºæ¯</el-text> |
|---|
| | | </div> |
|---|
| | | <el-divider /> |
|---|
| | | <CompSubTaskSelect |
|---|
| | | :data="seletedSceneList" |
|---|
| | | :dayTask="dayTask" |
|---|
| | | @delete="deleteScene" |
|---|
| | | ></CompSubTaskSelect> |
|---|
| | | <div> |
|---|
| | | <!-- <el-scrollbar height="50vh"> --> |
|---|
| | | <CompMonitorObj :data="curMonitorObjList" height="50vh"> |
|---|
| | | <template #default="{ item }"> |
|---|
| | | <el-button |
|---|
| | | v-if="item.select" |
|---|
| | | size="small" |
|---|
| | | type="info" |
|---|
| | | plain |
|---|
| | | disabled |
|---|
| | | icon="select" |
|---|
| | | >éæ©</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | v-else |
|---|
| | | size="small" |
|---|
| | | type="primary" |
|---|
| | | plain |
|---|
| | | @click="selectScene(item)" |
|---|
| | | >éæ©</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | | </CompMonitorObj> |
|---|
| | | <!-- </el-scrollbar> --> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | <el-col :span="8"> |
|---|
| | | <el-row justify="space-between"> |
|---|
| | | <el-text>åæ¥è®¡å</el-text> |
|---|
| | | <el-button type="success" size="small" @click="editTask" |
|---|
| | | >æ°å¢</el-button |
|---|
| | | > |
|---|
| | | </el-row> |
|---|
| | | <el-divider /> |
|---|
| | | <div> |
|---|
| | | <el-scrollbar :height="height"> |
|---|
| | | <ItemSubTask |
|---|
| | | v-for="stask in curSubTaskList" |
|---|
| | | :key="stask.guid" |
|---|
| | | :item="stask" |
|---|
| | | > |
|---|
| | | <template #default="{ item }"> |
|---|
| | | <el-button type="danger" size="small" @click="editTask" |
|---|
| | | >移é¤</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | | </ItemSubTask> |
|---|
| | | </el-scrollbar> |
|---|
| | | </div> |
|---|
| | | </el-col> |
|---|
| | | </el-row> |
|---|
| | | </template> |
|---|
| | | <script setup> |
|---|
| | | import { ref, watch, onMounted } from 'vue'; |
|---|
| | | import { useCloned } from '@vueuse/core'; |
|---|
| | | import { useRoute, useRouter } from 'vue-router'; |
|---|
| | | import taskApi from '@/api/fysp/taskApi'; |
|---|
| | | import TaskProxy from '../TaskProxy'; |
|---|
| | | |
|---|
| | | import CompMonitorObj from './CompMonitorObj.vue'; |
|---|
| | | import CompSubTaskSelect from './CompSubTaskSelect.vue'; |
|---|
| | | |
|---|
| | | const route = useRoute(); |
|---|
| | | |
|---|
| | | const props = defineProps({ |
|---|
| | | // æ¥ä»»å¡ |
|---|
| | | dayTask: Object, |
|---|
| | | mObjList: Array |
|---|
| | | }); |
|---|
| | | |
|---|
| | | /*************************** æ°æ®åå§å ************************************/ |
|---|
| | | // å·¡æ¥åä»»å¡éå |
|---|
| | | const curMonitorObjList = ref([]); |
|---|
| | | const curSubTaskList = ref([]); |
|---|
| | | const height = ref('70vh'); |
|---|
| | | |
|---|
| | | // çå¬æ¥ä»»å¡åå |
|---|
| | | watch( |
|---|
| | | () => props.dayTask, |
|---|
| | | (nV) => { |
|---|
| | | onDayTaskChange(nV); |
|---|
| | | }, |
|---|
| | | { immediate: true } |
|---|
| | | ); |
|---|
| | | |
|---|
| | | // çå¬ç管åºæ¯åå |
|---|
| | | watch( |
|---|
| | | () => props.mObjList, |
|---|
| | | (nV, oV) => { |
|---|
| | | if (nV != oV) { |
|---|
| | | curMonitorObjList.value = useCloned(nV).cloned.value; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { immediate: true } |
|---|
| | | ); |
|---|
| | | |
|---|
| | | // æ ¹æ®æ¥ä»»å¡è·å对åºåä»»å¡ |
|---|
| | | function onDayTaskChange(dayTask) { |
|---|
| | | if (dayTask) { |
|---|
| | | fetchSubTask(dayTask.guid); |
|---|
| | | } else { |
|---|
| | | curSubTaskList.value = []; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // è·åå·¡æ¥åä»»å¡ |
|---|
| | | function fetchSubTask(dayTaskId) { |
|---|
| | | taskApi.fetchSubtaskByDayTask(dayTaskId).then((res) => { |
|---|
| | | curSubTaskList.value = res; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*************************** æ·»å åä»»å¡ ************************************/ |
|---|
| | | |
|---|
| | | // æéåºæ¯ |
|---|
| | | const seletedSceneList = ref([]); |
|---|
| | | // éæ©ä»»å¡åºæ¯ |
|---|
| | | function selectScene(item) { |
|---|
| | | item.select = true; |
|---|
| | | seletedSceneList.value.push(item); |
|---|
| | | } |
|---|
| | | // 移é¤ä»»å¡åºæ¯ |
|---|
| | | function deleteScene(item) { |
|---|
| | | item.select = false; |
|---|
| | | const index = seletedSceneList.value.indexOf(item); |
|---|
| | | seletedSceneList.value.splice(index, 1); |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | <style scoped></style> |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <el-segmented :model-value="activeName" :options="activeTabs" @change="tabChange" /> |
|---|
| | | <div class="monitor-obj-wrapper"> |
|---|
| | | <el-affix v-if="affix" :offset="60" target=".monitor-obj-wrapper"> |
|---|
| | | <div> |
|---|
| | | <el-segmented |
|---|
| | | :model-value="activeName" |
|---|
| | | :options="activeTabs" |
|---|
| | | @change="tabChange" |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | </el-affix> |
|---|
| | | <div v-else> |
|---|
| | | <el-segmented |
|---|
| | | :model-value="activeName" |
|---|
| | | :options="activeTabs" |
|---|
| | | @change="tabChange" |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | <el-scrollbar :height="height"> |
|---|
| | | <el-space wrap> |
|---|
| | | <ItemMonitorObj v-for="obj in activeData" :key="obj.movid" :item="obj"> |
|---|
| | | <template #default="{ item }"> |
|---|
| | | <slot :item="item"> |
|---|
| | | <el-button |
|---|
| | | v-if="showBtn" |
|---|
| | | size="small" |
|---|
| | | plain |
|---|
| | | :type="btnType" |
|---|
| | | @click="itemClick(item)" |
|---|
| | | >{{ btnName }}</el-button |
|---|
| | | > |
|---|
| | | </slot> |
|---|
| | | </template> |
|---|
| | | </ItemMonitorObj> |
|---|
| | | </el-space> |
|---|
| | | </el-scrollbar> |
|---|
| | | </div> |
|---|
| | | <el-space wrap> |
|---|
| | | <ItemMonitorObj v-for="obj in activeData" :key="obj.movid" :item="obj"> |
|---|
| | | <template #default="{ item }"> |
|---|
| | | <!-- <slot :item="item"></slot> --> |
|---|
| | | <el-button v-if="showBtn" size="small" type="danger" @click="itemClick(item)">{{ |
|---|
| | | btnName |
|---|
| | | }}</el-button> |
|---|
| | | </template> |
|---|
| | | </ItemMonitorObj> |
|---|
| | | </el-space> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | |
|---|
| | | btnName: { |
|---|
| | | type: String, |
|---|
| | | default: '移é¤' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | btnType: { |
|---|
| | | type: String, |
|---|
| | | default: 'danger' |
|---|
| | | }, |
|---|
| | | // 头é¨é项æ¯å¦å¸é¡¶ |
|---|
| | | affix: Boolean, |
|---|
| | | height: String |
|---|
| | | }, |
|---|
| | | emits: ['update:tabName', 'update:showData', 'itemClick'], |
|---|
| | | data() { |
|---|
| | |
|---|
| | | computed: { |
|---|
| | | activeData() { |
|---|
| | | const list = this.data.filter((v) => { |
|---|
| | | return this.activeName == defaultTabName || v.sceneType == this.activeName; |
|---|
| | | return ( |
|---|
| | | this.activeName == defaultTabName || v.sceneType == this.activeName |
|---|
| | | ); |
|---|
| | | // return this.tabName == defaultTabName || v.sceneType == this.tabName; |
|---|
| | | }); |
|---|
| | | this.$emit('update:showData', list); |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <el-row gutter="20"> |
|---|
| | | <el-col |
|---|
| | | :span="16" |
|---|
| | | style="border-right: 1px solid var(--el-color-info-light-7)" |
|---|
| | | > |
|---|
| | | <div> |
|---|
| | | <el-text>å·²éåºæ¯</el-text> |
|---|
| | | <el-text type="info" size="small">{{ statisticText }}</el-text> |
|---|
| | | </div> |
|---|
| | | <el-divider /> |
|---|
| | | <CompMonitorObj |
|---|
| | | height="68vh" |
|---|
| | | :data="curMonitorObjList" |
|---|
| | | show-btn |
|---|
| | | v-model:tabName="curSceneType" |
|---|
| | | v-model:showData="showMonitorObjList" |
|---|
| | | :tabOptions="sceneTypeOptions" |
|---|
| | | @item-click="deleteMov" |
|---|
| | | > |
|---|
| | | </CompMonitorObj> |
|---|
| | | </el-col> |
|---|
| | | <el-col :span="8"> |
|---|
| | | <el-affix :offset="140"> |
|---|
| | | <div> |
|---|
| | | <el-text>å¯éåºæ¯</el-text> |
|---|
| | | </div> |
|---|
| | | <el-divider /> |
|---|
| | | <div> |
|---|
| | | <el-segmented v-model="curSceneType" :options="sceneTypeOptions" /> |
|---|
| | | </div> |
|---|
| | | <FYInfoSearch |
|---|
| | | placeholder="请è¾å
¥åºæ¯å称å
³é®å" |
|---|
| | | :data="showSceneList" |
|---|
| | | :on-search="searchScene" |
|---|
| | | :total="total" |
|---|
| | | scroll-height="60vh" |
|---|
| | | :page-show="false" |
|---|
| | | > |
|---|
| | | <template #default="{ row }"> |
|---|
| | | <ItemScene :item="row"> |
|---|
| | | <el-button-group> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | type="primary" |
|---|
| | | @click="openInsertDialog(row)" |
|---|
| | | >æå
¥</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | type="primary" |
|---|
| | | @click="openAddDialog(row)" |
|---|
| | | >æ°å¢</el-button |
|---|
| | | > |
|---|
| | | </el-button-group> |
|---|
| | | </ItemScene> |
|---|
| | | </template> |
|---|
| | | </FYInfoSearch> |
|---|
| | | </el-affix> |
|---|
| | | </el-col> |
|---|
| | | </el-row> |
|---|
| | | |
|---|
| | | <el-dialog v-model="insertDialog" title="æå
¥åºæ¯è³ç©ºä½ç¼å·" width="500"> |
|---|
| | | <div v-if="valibleIndex.length > 0">以ä¸ä¸ºå¯éç空ä½ç¼å·</div> |
|---|
| | | <div v-else>æ å¯éç空ä½ç¼å·</div> |
|---|
| | | <el-radio-group v-model="selectedIndex" size="default"> |
|---|
| | | <el-radio-button |
|---|
| | | v-for="item in valibleIndex" |
|---|
| | | :key="item" |
|---|
| | | :label="item" |
|---|
| | | :value="item" |
|---|
| | | /> |
|---|
| | | </el-radio-group> |
|---|
| | | <template #footer> |
|---|
| | | <div class="dialog-footer"> |
|---|
| | | <el-button @click="insertDialog = false">åæ¶</el-button> |
|---|
| | | <el-button :disabled="!selectedIndex" type="primary" @click="insertMov"> |
|---|
| | | 确认 |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-dialog> |
|---|
| | | <el-dialog v-model="addDialog" title="æ°å¢åºæ¯ç¼å·é¡ºå»¶" width="500"> |
|---|
| | | <div>顺延ç¼å·ä¸º:{{ lastIndex }}</div> |
|---|
| | | <template #footer> |
|---|
| | | <div class="dialog-footer"> |
|---|
| | | <el-button @click="addDialog = false">åæ¶</el-button> |
|---|
| | | <el-button type="primary" @click="addMov"> 确认 </el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-dialog> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import { useCloned } from '@vueuse/core'; |
|---|
| | | import CompMonitorObj from './CompMonitorObj.vue'; |
|---|
| | | import taskApi from '@/api/fysp/taskApi'; |
|---|
| | | import sceneApi from '@/api/fysp/sceneApi'; |
|---|
| | | import { ElMessage, ElNotification, ElMessageBox } from 'element-plus'; |
|---|
| | | |
|---|
| | | const MODE_CREATE = 'create'; |
|---|
| | | const MODE_UPDATE = 'update'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | components: { CompMonitorObj }, |
|---|
| | | props: { |
|---|
| | | // ç¼è¾æ¨¡å¼ï¼æ°å¢createææ´æ°update |
|---|
| | | mode: { |
|---|
| | | type: String, |
|---|
| | | default: MODE_CREATE |
|---|
| | | }, |
|---|
| | | create: Boolean, |
|---|
| | | // å·¡æ¥æ»ä»»å¡ |
|---|
| | | task: { |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // ç管åºæ¯éå |
|---|
| | | objList: Array |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | // ç管åºæ¯ |
|---|
| | | curMonitorObjList: [], |
|---|
| | | // å½åçéçåºæ¯ç±»å |
|---|
| | | curSceneType: undefined, |
|---|
| | | showMonitorObjList: [], |
|---|
| | | |
|---|
| | | // ææåºæ¯ |
|---|
| | | sceneList: [], |
|---|
| | | total: 0, |
|---|
| | | |
|---|
| | | // æå
¥å¼¹åºæ¡ |
|---|
| | | insertDialog: false, |
|---|
| | | // æå
¥ææ°å¢çç¼å· |
|---|
| | | selectedIndex: undefined, |
|---|
| | | // æå
¥ææ°å¢çåºæ¯ |
|---|
| | | selectedScene: undefined, |
|---|
| | | // çç®¡æ¬¡æ° |
|---|
| | | monitorTimes: 1, |
|---|
| | | // æ°å¢å¼¹åºæ¡ |
|---|
| | | addDialog: false, |
|---|
| | | // æ°å¢çç管åºæ¯ |
|---|
| | | insertObj: [], |
|---|
| | | // æ´æ°çç管åºæ¯ |
|---|
| | | updateObj: [], |
|---|
| | | // å é¤çç管åºæ¯ |
|---|
| | | deleteObj: [], |
|---|
| | | // æ´æ°çåºæ¯åºæ¬ä¿¡æ¯ï¼æ´æ°åºæ¯çç¼å·ï¼ |
|---|
| | | updateScene: [] |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | emits: ['uploadSuccess', 'uploadFail'], |
|---|
| | | watch: { |
|---|
| | | objList: { |
|---|
| | | handler(nV, oV) { |
|---|
| | | if (nV != oV) { |
|---|
| | | this.curMonitorObjList = useCloned(nV).cloned.value; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | immediate: true |
|---|
| | | } |
|---|
| | | // task: { |
|---|
| | | // handler(nV, oV) { |
|---|
| | | // if (nV != oV) { |
|---|
| | | // this.searchScene({ text: '' }); |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // immediate: true |
|---|
| | | // } |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | // æ¥è¯¢åºæ¯èå´æ¡ä»¶ |
|---|
| | | area() { |
|---|
| | | return { |
|---|
| | | provincecode: this.task.provincecode, |
|---|
| | | provincename: this.task.provincename, |
|---|
| | | citycode: this.task.citycode, |
|---|
| | | cityname: this.task.cityname, |
|---|
| | | districtcode: this.task.districtcode, |
|---|
| | | districtname: this.task.districtname, |
|---|
| | | towncode: this.task.towncode, |
|---|
| | | townname: this.task.townname, |
|---|
| | | online: true |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | // å½ååºæ¯ç±»åä¸çå±ç¤ºåºæ¯ |
|---|
| | | showSceneList() { |
|---|
| | | return this.sceneList.filter((v) => { |
|---|
| | | const index = this.curMonitorObjList.findIndex((o) => { |
|---|
| | | return o.sguid == v.guid; |
|---|
| | | }); |
|---|
| | | return index == -1 && v.type == this.curSceneType; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | sceneTypeOptions() { |
|---|
| | | const list = []; |
|---|
| | | this.sceneList.forEach((d) => { |
|---|
| | | if (list.indexOf(d.type) == -1) list.push(d.type); |
|---|
| | | }); |
|---|
| | | return list; |
|---|
| | | }, |
|---|
| | | // å½ååºæ¯ç±»åä¸çå¯æå
¥ç¼å· |
|---|
| | | valibleIndex() { |
|---|
| | | // åå表已ç»æç
§ç¼å·é¡ºåºæå |
|---|
| | | let index = 1; |
|---|
| | | const indexList = []; |
|---|
| | | this.showMonitorObjList.forEach((l) => { |
|---|
| | | while (l.displayid > index) { |
|---|
| | | indexList.push(index); |
|---|
| | | index++; |
|---|
| | | } |
|---|
| | | index++; |
|---|
| | | }); |
|---|
| | | if (this.showMonitorObjList.length == 0 && indexList.length == 0) { |
|---|
| | | indexList.push(1); |
|---|
| | | } |
|---|
| | | return indexList; |
|---|
| | | }, |
|---|
| | | lastIndex() { |
|---|
| | | const len = this.showMonitorObjList.length; |
|---|
| | | if (len > 0) { |
|---|
| | | return this.showMonitorObjList[len - 1].displayid + 1; |
|---|
| | | } else { |
|---|
| | | return 1; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | isEdit() { |
|---|
| | | // æ°å»ºç管æ»ä»»å¡æ¨¡å¼ |
|---|
| | | if (this.create) { |
|---|
| | | return this.curMonitorObjList.length > 0; |
|---|
| | | } |
|---|
| | | // æ´æ°ç管æ»ä»»å¡æ¨¡å¼ |
|---|
| | | else { |
|---|
| | | return ( |
|---|
| | | this.insertObj.length > 0 || |
|---|
| | | this.deleteObj.length > 0 || |
|---|
| | | this.updateObj.length > 0 |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | statisticText() { |
|---|
| | | const total = this.curMonitorObjList.length; |
|---|
| | | const map = new Map(); |
|---|
| | | this.curMonitorObjList.forEach((e) => { |
|---|
| | | const d = e.scene |
|---|
| | | if (!map.has(d.type)) { |
|---|
| | | map.set(d.type, { num: 1 }); |
|---|
| | | } |
|---|
| | | map.get(d.type).num++; |
|---|
| | | }); |
|---|
| | | |
|---|
| | | let res = `ï¼æ»è®¡${total}个`; |
|---|
| | | for (const [key, value] of map) { |
|---|
| | | res += `ï¼${key}${value.num}个`; |
|---|
| | | } |
|---|
| | | res += 'ï¼'; |
|---|
| | | return res; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // æ¥è¯¢ |
|---|
| | | searchScene({ text, page, pageSize }) { |
|---|
| | | this.area.sceneName = text; |
|---|
| | | return sceneApi.searchScene(this.area, 1, 10000).then((res) => { |
|---|
| | | if (res.success) { |
|---|
| | | // æ¥è¯¢ç»æ |
|---|
| | | this.sceneList = res.data; |
|---|
| | | // æ»æ°æ®é |
|---|
| | | this.total = res.head.totalCount; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | deleteMov(item) { |
|---|
| | | if (item.extension1) { |
|---|
| | | ElMessage({ |
|---|
| | | message: 'å·²ç管åºæ¯æ æ³ç§»é¤', |
|---|
| | | type: 'error' |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | const i = this.curMonitorObjList.indexOf(item); |
|---|
| | | this.curMonitorObjList.splice(i, 1); |
|---|
| | | const i1 = this.insertObj.indexOf(item); |
|---|
| | | this.insertObj.splice(i1, 1); |
|---|
| | | const i2 = this.updateObj.indexOf(item); |
|---|
| | | this.updateObj.splice(i2, 1); |
|---|
| | | const i3 = this.updateScene.findIndex((s) => { |
|---|
| | | return s.guid == item.sguid; |
|---|
| | | }); |
|---|
| | | this.updateScene.splice(i3, 1); |
|---|
| | | |
|---|
| | | this.deleteObj.push(item); |
|---|
| | | }, |
|---|
| | | openInsertDialog(item) { |
|---|
| | | this.insertDialog = true; |
|---|
| | | this.selectedScene = item; |
|---|
| | | this.monitorTimes = 1; |
|---|
| | | }, |
|---|
| | | openAddDialog(item) { |
|---|
| | | this.addDialog = true; |
|---|
| | | this.selectedScene = item; |
|---|
| | | this.monitorTimes = 1; |
|---|
| | | }, |
|---|
| | | insertMov() { |
|---|
| | | // 1. å建æ°åºæ¯ |
|---|
| | | let mov = this.createMov(this.selectedIndex, this.selectedScene); |
|---|
| | | // 2. æ¥æ¾ç¬¬ä¸ä¸ªç¼å·å¤§äºæå
¥ç¼å·çå¼ï¼å°æ°ç管对象æå
¥å
¶ä¹å |
|---|
| | | const insertAtIndex = this.curMonitorObjList.findIndex((v) => { |
|---|
| | | return v.displayid > this.selectedIndex; |
|---|
| | | }); |
|---|
| | | this.curMonitorObjList.splice(insertAtIndex, 0, mov); |
|---|
| | | this.selectedIndex = undefined; |
|---|
| | | this.insertDialog = false; |
|---|
| | | }, |
|---|
| | | addMov() { |
|---|
| | | // 1. å建æ°åºæ¯ |
|---|
| | | let mov = this.createMov(this.lastIndex, this.selectedScene); |
|---|
| | | // 2. æ·»å è³æ«å°¾ |
|---|
| | | this.curMonitorObjList.push(mov); |
|---|
| | | this.addDialog = false; |
|---|
| | | }, |
|---|
| | | // å建ä¸ä¸ªæ°çç管对象 |
|---|
| | | createMov(displayid, scene) { |
|---|
| | | // 1. æ¥æ¾è¯¥åºæ¯æ¯å¦ä¹å已被å é¤ |
|---|
| | | const index = this.deleteObj.findIndex((v) => { |
|---|
| | | return v.sguid == scene.guid; |
|---|
| | | }); |
|---|
| | | let mov; |
|---|
| | | // 2. è¥æ¯å
¨æ°çåºæ¯ï¼åæ°çæä¸ä¸ªç管对象ï¼å¦ååªæ´æ°ç¼å· |
|---|
| | | if (index == -1) { |
|---|
| | | mov = { |
|---|
| | | tid: this.task.tguid, |
|---|
| | | sguid: scene.guid, |
|---|
| | | sensename: scene.name, |
|---|
| | | tasktypeid: 1, |
|---|
| | | tasktype: 'å·¡æ¥', |
|---|
| | | monitornum: this.monitorTimes, |
|---|
| | | displayid: displayid, |
|---|
| | | sceneTypeId: scene.typeid, |
|---|
| | | sceneType: scene.type |
|---|
| | | }; |
|---|
| | | this.insertObj.push(mov); |
|---|
| | | } else { |
|---|
| | | mov = this.deleteObj[index]; |
|---|
| | | mov.displayid = displayid; |
|---|
| | | this.updateObj.push(mov); |
|---|
| | | this.deleteObj.splice(index, 1); |
|---|
| | | } |
|---|
| | | // 3. åæ¥æ´æ°åºæ¯åºæ¬ä¿¡æ¯ä¸çç¼å· |
|---|
| | | scene._index = displayid; |
|---|
| | | this.updateScene.push(scene); |
|---|
| | | |
|---|
| | | return mov; |
|---|
| | | }, |
|---|
| | | // ä¿åä¿®æ¹ |
|---|
| | | saveEdit() { |
|---|
| | | if (this.create) { |
|---|
| | | this.createTask(); |
|---|
| | | } else { |
|---|
| | | this.updateTask(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | createTask() { |
|---|
| | | if (this.curMonitorObjList.length > 0) { |
|---|
| | | taskApi |
|---|
| | | .addMonitorObject(this.curMonitorObjList) |
|---|
| | | .then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥æ»ä»»å¡å建å®æ`, |
|---|
| | | message: `æ°å¢åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.$emit('uploadSuccess'); |
|---|
| | | }) |
|---|
| | | .catch((err) => this.$emit('uploadFail', err)); |
|---|
| | | } |
|---|
| | | this.updateSceneList(); |
|---|
| | | }, |
|---|
| | | updateTask() { |
|---|
| | | // new Promise((resolve, reject)=>{ |
|---|
| | | |
|---|
| | | // }) |
|---|
| | | // this.saveLoading = true; |
|---|
| | | if (this.insertObj.length > 0) { |
|---|
| | | const p1 = taskApi.addMonitorObject(this.insertObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡æ°å¢å®æ`, |
|---|
| | | message: `æ°å¢åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.insertObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (this.updateObj.length > 0) { |
|---|
| | | const p2 = taskApi.updateMonitorObject(this.updateObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡æ´æ°å®æ`, |
|---|
| | | message: `æ´æ°åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.updateObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (this.deleteObj.length > 0) { |
|---|
| | | const p3 = taskApi.deleteMonitorObject(this.deleteObj).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `å·¡æ¥ä»»å¡å é¤å®æ`, |
|---|
| | | message: `å é¤åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.deleteObj = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | this.updateSceneList(); |
|---|
| | | // return Promise.all([p1, p2, p3]).finally(() => { |
|---|
| | | // this.saveLoading = false; |
|---|
| | | // }); |
|---|
| | | }, |
|---|
| | | updateSceneList() { |
|---|
| | | if (this.updateScene.length > 0) { |
|---|
| | | this.updateScene.forEach((s) => { |
|---|
| | | s.index = s._index; |
|---|
| | | }); |
|---|
| | | sceneApi.updateSceneList(this.updateScene).then((res) => { |
|---|
| | | ElNotification({ |
|---|
| | | title: `åºæ¯ç¼å·æ´æ°å®æ`, |
|---|
| | | message: `æ´æ°åºæ¯${res}个`, |
|---|
| | | type: 'success', |
|---|
| | | position: 'bottom-left' |
|---|
| | | }); |
|---|
| | | this.updateScene = []; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | setTimeout(() => { |
|---|
| | | this.searchScene({ text: '' }); |
|---|
| | | }, 1000); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped></style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <el-row justify="space-between"> |
|---|
| | | <el-text>åæ¥è®¡å</el-text> |
|---|
| | | <el-button type="success" size="small" @click="add">æ°å¢</el-button> |
|---|
| | | </el-row> |
|---|
| | | <el-divider /> |
|---|
| | | <div> |
|---|
| | | <el-scrollbar :height="height"> |
|---|
| | | <el-space fill direction="vertical"> |
|---|
| | | <ItemSubTask v-for="s in data" :key="s.guid" :item="s"> |
|---|
| | | <template #default="{ item }"> |
|---|
| | | <el-button type="danger" size="small" @click="remove(item)" |
|---|
| | | >移é¤</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | | </ItemSubTask> |
|---|
| | | </el-space> |
|---|
| | | </el-scrollbar> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script setup> |
|---|
| | | import { ref, watch, onMounted } from 'vue'; |
|---|
| | | |
|---|
| | | const props = defineProps({ |
|---|
| | | data: Array, |
|---|
| | | height: { |
|---|
| | | type: String, |
|---|
| | | default: '70vh' |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | const curSubTaskList = ref([]); |
|---|
| | | |
|---|
| | | const emit = defineEmits(['add', 'remove']); |
|---|
| | | |
|---|
| | | function remove(item) { |
|---|
| | | emit('remove', item); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function add() { |
|---|
| | | emit('add'); |
|---|
| | | } |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="wrapper"> |
|---|
| | | <el-row> |
|---|
| | | <FYForm |
|---|
| | | :inline="true" |
|---|
| | | label-width="" |
|---|
| | | :form-info="formInfo" |
|---|
| | | :rules="rules" |
|---|
| | | @submit="submit" |
|---|
| | | > |
|---|
| | | <template #form-item="{ formObj }"> |
|---|
| | | <el-form-item label="æ§è¡äºº" prop="executor"> |
|---|
| | | <el-select |
|---|
| | | v-model="formObj.executor" |
|---|
| | | multiple |
|---|
| | | clearable |
|---|
| | | collapse-tags |
|---|
| | | placeholder="éæ©æ§è¡äºº" |
|---|
| | | :max-collapse-tags="1" |
|---|
| | | style="width: 240px" |
|---|
| | | > |
|---|
| | | <template #header> |
|---|
| | | <el-checkbox |
|---|
| | | v-model="checkAll" |
|---|
| | | :indeterminate="indeterminate" |
|---|
| | | @change="handleCheckAll" |
|---|
| | | > |
|---|
| | | å
¨é |
|---|
| | | </el-checkbox> |
|---|
| | | </template> |
|---|
| | | <el-option |
|---|
| | | v-for="item in executors" |
|---|
| | | :key="item.value" |
|---|
| | | :label="item.label" |
|---|
| | | :value="item.value" |
|---|
| | | /> |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | </template> |
|---|
| | | </FYForm> |
|---|
| | | </el-row> |
|---|
| | | <div> |
|---|
| | | <el-scrollbar :height="scrollHeight" v-if="data.length > 0"> |
|---|
| | | <el-space wrap> |
|---|
| | | <ItemMonitorObj v-for="obj in data" :key="obj.movid" :item="obj"> |
|---|
| | | <template #default="{ item }"> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | type="danger" |
|---|
| | | plain |
|---|
| | | @click="deleteScene(item)" |
|---|
| | | >移é¤</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | | </ItemMonitorObj> |
|---|
| | | </el-space> |
|---|
| | | </el-scrollbar> |
|---|
| | | <el-empty v-else description=" "> |
|---|
| | | <template #image> |
|---|
| | | <el-row align="middle"> |
|---|
| | | <el-icon size="20"><WarningFilled /></el-icon> |
|---|
| | | <el-text size="small" type="info">æªéæ©åºæ¯</el-text> |
|---|
| | | </el-row> |
|---|
| | | </template> |
|---|
| | | </el-empty> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script setup> |
|---|
| | | /** |
|---|
| | | * å·¡æ¥åä»»å¡å建 |
|---|
| | | */ |
|---|
| | | import { ref, reactive, watch, computed, onMounted } from 'vue'; |
|---|
| | | import { ElMessageBox, ElNotification, ElMessage } from 'element-plus'; |
|---|
| | | import taskApi from '@/api/fysp/taskApi'; |
|---|
| | | |
|---|
| | | onMounted(() => { |
|---|
| | | // if (props.height) { |
|---|
| | | // scrollHeight.value = |
|---|
| | | // } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | const props = defineProps({ |
|---|
| | | // åä»»å¡éå |
|---|
| | | data: { |
|---|
| | | type: Array, |
|---|
| | | default: () => [] |
|---|
| | | }, |
|---|
| | | height: String, |
|---|
| | | // æ¥ä»»å¡ |
|---|
| | | dayTask: Object |
|---|
| | | }); |
|---|
| | | |
|---|
| | | const emit = defineEmits(['delete']); |
|---|
| | | |
|---|
| | | const scrollHeight = ref('14vh'); |
|---|
| | | |
|---|
| | | // 移é¤ä»»å¡åºæ¯ |
|---|
| | | function deleteScene(item) { |
|---|
| | | emit('delete', item); |
|---|
| | | } |
|---|
| | | |
|---|
| | | /************************* ä»»å¡å建表å *******************************/ |
|---|
| | | const formInfo = ref({}); |
|---|
| | | const rules = reactive({ |
|---|
| | | name: [ |
|---|
| | | { |
|---|
| | | required: true, |
|---|
| | | message: 'åºæ¯å称ä¸è½ä¸ºç©º', |
|---|
| | | trigger: 'blur' |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }); |
|---|
| | | function submit(v, success, fail) { |
|---|
| | | if (props.data.length == 0) { |
|---|
| | | // ElMessage({ |
|---|
| | | // message: 'æªéæ©ç管åºæ¯', |
|---|
| | | // type: 'warning' |
|---|
| | | // }); |
|---|
| | | fail('æªéæ©ç管åºæ¯'); |
|---|
| | | } else { |
|---|
| | | success(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /************************* ä»»å¡æ§è¡äººä¸æéæ¡ *******************************/ |
|---|
| | | const executors = ref([]); |
|---|
| | | // æ¯å¦å
¨é |
|---|
| | | const checkAll = ref(false); |
|---|
| | | // å¤éæ¡æ¯å¦ä¸é´ç¶æ |
|---|
| | | const indeterminate = ref(false); |
|---|
| | | // å
¨éäºä»¶ |
|---|
| | | function handleCheckAll(val) { |
|---|
| | | indeterminate.value = false; |
|---|
| | | if (val) { |
|---|
| | | formInfo.value.executor = executors.value.map((_) => _.value); |
|---|
| | | } else { |
|---|
| | | formInfo.value.executor = []; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | watch( |
|---|
| | | () => props.dayTask, |
|---|
| | | (nV, oV) => { |
|---|
| | | if (nV != oV) { |
|---|
| | | taskApi.fetchTaskById(nV.guid).then((res) => { |
|---|
| | | const ids = res.executorguids.split('#'); |
|---|
| | | const userNames = res.executorusernames.split('#'); |
|---|
| | | const realNames = res.executorrealnames.split('#'); |
|---|
| | | const list = []; |
|---|
| | | ids.forEach((e, i) => { |
|---|
| | | if (i < userNames.length && i < realNames.length) { |
|---|
| | | list.push({ |
|---|
| | | label: realNames[i], |
|---|
| | | value: e, |
|---|
| | | data: { |
|---|
| | | id: e, |
|---|
| | | userName: userNames[i], |
|---|
| | | realName: realNames[i] |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | executors.value = list; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { immediate: true } |
|---|
| | | ); |
|---|
| | | // |
|---|
| | | watch( |
|---|
| | | () => formInfo.value.executor, |
|---|
| | | (val) => { |
|---|
| | | if (val.length === 0) { |
|---|
| | | checkAll.value = false; |
|---|
| | | indeterminate.value = false; |
|---|
| | | } else if (val.length === executors.value.length) { |
|---|
| | | checkAll.value = true; |
|---|
| | | indeterminate.value = false; |
|---|
| | | } else { |
|---|
| | | indeterminate.value = true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | </script> |
|---|
| | | <style scoped> |
|---|
| | | .wrapper { |
|---|
| | | border-bottom: 1px solid var(--el-color-info-light-7); |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <FYForm |
|---|
| | | ref="formRef" |
|---|
| | | :form-info="formInfo" |
|---|
| | | :rules="rules" |
|---|
| | | :useCancel="true" |
|---|
| | | label-width="120px" |
|---|
| | | submit-name="å建" |
|---|
| | | @submit="submit" |
|---|
| | | @cancel="cancel" |
|---|
| | | > |
|---|
| | | <template #form-item="{ formObj }"> |
|---|
| | | <!-- åºå¿ --> |
|---|
| | | <FYOptionLocation |
|---|
| | | :allOption="false" |
|---|
| | | :level="3" |
|---|
| | | :initValue="false" |
|---|
| | | :checkStrictly="false" |
|---|
| | | v-model:value="formObj._locations" |
|---|
| | | @change="handleLocationChange" |
|---|
| | | ></FYOptionLocation> |
|---|
| | | <el-form-item label="ä»»å¡å称" prop="name"> |
|---|
| | | <el-input |
|---|
| | | clearable |
|---|
| | | show-word-limit |
|---|
| | | v-model="formObj.name" |
|---|
| | | placeholder="ä»»å¡å称" |
|---|
| | | /> |
|---|
| | | </el-form-item> |
|---|
| | | <FYOptionTime |
|---|
| | | label="èµ·æ¢æ¥æ" |
|---|
| | | prop="_timeArr" |
|---|
| | | :initValue="false" |
|---|
| | | type="daterange" |
|---|
| | | v-model:value="formObj._timeArr" |
|---|
| | | @change="handleTimeChange" |
|---|
| | | ></FYOptionTime> |
|---|
| | | |
|---|
| | | <el-form-item v-show="showMore" label="ä»»å¡ç±»å" prop="_type"> |
|---|
| | | <el-select v-model="formObj._type" style="width: 150px"> |
|---|
| | | <el-option |
|---|
| | | v-for="s in taskTypeOptions" |
|---|
| | | :key="s.label" |
|---|
| | | :label="s.label" |
|---|
| | | :value="s.value" |
|---|
| | | /> |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item v-show="showMore" label="ä»»å¡æéç±»å«" prop="_deadlinetype"> |
|---|
| | | <el-select v-model="formObj._deadlinetype" style="width: 150px"> |
|---|
| | | <el-option |
|---|
| | | v-for="s in deadlineTypeOptions" |
|---|
| | | :key="s.label" |
|---|
| | | :label="s.label" |
|---|
| | | :value="s.value" |
|---|
| | | /> |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item v-show="showMore" label="ä»»å¡å±æ¬¡" prop="levelnum"> |
|---|
| | | <el-select v-model="formObj.levelnum" style="width: 150px"> |
|---|
| | | <el-option |
|---|
| | | v-for="s in levelOptions" |
|---|
| | | :key="s.label" |
|---|
| | | :label="s.label" |
|---|
| | | :value="s.value" |
|---|
| | | /> |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item v-show="showMore" label="æ§è¡äºº" prop="_executors"> |
|---|
| | | <el-select |
|---|
| | | v-model="formObj._executors" |
|---|
| | | multiple |
|---|
| | | clearable |
|---|
| | | collapse-tags |
|---|
| | | placeholder="éæ©æ§è¡äºº" |
|---|
| | | :max-collapse-tags="3" |
|---|
| | | style="width: 300px" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="s in executorOptions" |
|---|
| | | :key="s.value" |
|---|
| | | :label="s.label" |
|---|
| | | :value="s.value" |
|---|
| | | /> |
|---|
| | | </el-select> |
|---|
| | | </el-form-item> |
|---|
| | | <el-form-item> |
|---|
| | | <el-row justify="center"> |
|---|
| | | <el-link type="primary" @click="showMore = !showMore"> |
|---|
| | | {{ showMore ? 'æ¶èµ·' : 'æ¥çæ´å¤é项' }} |
|---|
| | | <el-icon v-if="showMore"><ArrowUp /></el-icon> |
|---|
| | | <el-icon v-else><ArrowDown /></el-icon> |
|---|
| | | </el-link> |
|---|
| | | </el-row> |
|---|
| | | </el-form-item> |
|---|
| | | </template> |
|---|
| | | </FYForm> |
|---|
| | | </template> |
|---|
| | | <script setup> |
|---|
| | | import { ref, reactive, watch, onMounted } from 'vue'; |
|---|
| | | import domainApi from '@/api/fysp/domainApi'; |
|---|
| | | import userApi from '@/api/fysp/userApi'; |
|---|
| | | import dayjs from 'dayjs'; |
|---|
| | | import taskApi from '@/api/fysp/taskApi'; |
|---|
| | | |
|---|
| | | const props = defineProps({ |
|---|
| | | //æ°æ® |
|---|
| | | model: { |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | //æ¯å建æè
æ´æ°åºæ¯ï¼é»è®¤æ´æ° |
|---|
| | | create: Boolean |
|---|
| | | }); |
|---|
| | | |
|---|
| | | const emit = defineEmits(['submit', 'cancel']); |
|---|
| | | |
|---|
| | | const rules = reactive({ |
|---|
| | | name: [ |
|---|
| | | { |
|---|
| | | required: true, |
|---|
| | | message: 'ä»»å¡å称ä¸è½ä¸ºç©º', |
|---|
| | | trigger: 'change' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | _type: [ |
|---|
| | | { |
|---|
| | | required: true, |
|---|
| | | message: 'ä»»å¡ç±»åä¸è½ä¸ºç©º', |
|---|
| | | trigger: 'change' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | _deadlinetype: [ |
|---|
| | | { |
|---|
| | | required: true, |
|---|
| | | message: 'ä»»å¡æéç±»åä¸è½ä¸ºç©º', |
|---|
| | | trigger: 'change' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | levelnum: [ |
|---|
| | | { |
|---|
| | | required: true, |
|---|
| | | message: 'ä»»å¡å±æ¬¡ä¸è½ä¸ºç©º', |
|---|
| | | trigger: 'change' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | // starttime: [ |
|---|
| | | // { |
|---|
| | | // required: true, |
|---|
| | | // message: 'å¼å§æ¥æä¸è½ä¸ºç©º', |
|---|
| | | // trigger: 'change' |
|---|
| | | // } |
|---|
| | | // ], |
|---|
| | | // endtime: [ |
|---|
| | | // { |
|---|
| | | // required: true, |
|---|
| | | // message: 'ç»ææ¥æä¸è½ä¸ºç©º', |
|---|
| | | // trigger: 'change' |
|---|
| | | // } |
|---|
| | | // ], |
|---|
| | | _timeArr: [ |
|---|
| | | { |
|---|
| | | required: true, |
|---|
| | | message: 'èµ·æ¢æ¥æä¸è½ä¸ºç©º', |
|---|
| | | trigger: 'change' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | _executors: [ |
|---|
| | | { |
|---|
| | | required: true, |
|---|
| | | message: 'ä»»å¡æ§è¡äººä¸è½ä¸ºç©º', |
|---|
| | | trigger: 'change' |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }); |
|---|
| | | |
|---|
| | | const formRef = ref(null); |
|---|
| | | const formInfo = ref({ |
|---|
| | | starttime: dayjs().add(1, 'month').startOf('month').toDate(), |
|---|
| | | endtime: dayjs().add(1, 'month').endOf('month').toDate(), |
|---|
| | | _timeArr: [ |
|---|
| | | dayjs().add(1, 'month').startOf('month').toDate(), |
|---|
| | | dayjs().add(1, 'month').endOf('month').set('millisecond', 0).toDate() |
|---|
| | | ] |
|---|
| | | }); |
|---|
| | | // ä»»å¡ç±»åé项 |
|---|
| | | const taskTypeOptions = ref([]); |
|---|
| | | // ä»»å¡æéç±»å«é项 |
|---|
| | | const deadlineTypeOptions = ref([]); |
|---|
| | | // ä»»å¡å±æ¬¡ç±»å«é项 |
|---|
| | | const levelOptions = ref([]); |
|---|
| | | // ä»»å¡æ§è¡äººé项 |
|---|
| | | const executorOptions = ref([]); |
|---|
| | | const showMore = ref(false); |
|---|
| | | |
|---|
| | | function locationText(location) { |
|---|
| | | if (location.pName == (undefined | null)) return ''; |
|---|
| | | let res = location.pName; |
|---|
| | | if (location.cName && location.cName != location.pName) { |
|---|
| | | res += location.cName; |
|---|
| | | } |
|---|
| | | if (location.dName && location.dName != location.cName) { |
|---|
| | | res += location.dName; |
|---|
| | | } |
|---|
| | | return res; |
|---|
| | | } |
|---|
| | | |
|---|
| | | function handleLocationChange(location) { |
|---|
| | | genTaskName(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function handleTimeChange(timeArr) { |
|---|
| | | genTaskName(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function genTaskName() { |
|---|
| | | let name = dayjs(formRef.value.formObj._timeArr[0]).format('YYYYå¹´MMæ'); |
|---|
| | | name += locationText(formRef.value.formObj._locations); |
|---|
| | | name += formRef.value.formObj._type.text; |
|---|
| | | name += 'ä»»å¡'; |
|---|
| | | formRef.value.formObj.name = name; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*************************** æ°æ®æ´æ° ************************************/ |
|---|
| | | |
|---|
| | | function getExecutors(data) { |
|---|
| | | const ids = []; |
|---|
| | | const uNames = []; |
|---|
| | | const rNames = []; |
|---|
| | | executorOptions.value.forEach((e) => { |
|---|
| | | const index = data._executors.indexOf(e.value); |
|---|
| | | if (index != -1) { |
|---|
| | | ids.push(e.data.guid); |
|---|
| | | uNames.push(e.data.acountname); |
|---|
| | | rNames.push(e.data.realname); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | return { |
|---|
| | | id: ids.join('#'), |
|---|
| | | uName: uNames.join('#'), |
|---|
| | | rName: rNames.join('#') |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | |
|---|
| | | function submit(data, success, fail) { |
|---|
| | | const v = data.value; |
|---|
| | | const executors = getExecutors(v); |
|---|
| | | const task = { |
|---|
| | | levelnum: v.levelnum, |
|---|
| | | name: v.name, |
|---|
| | | typeno: v._type.value, |
|---|
| | | typename: v._type.text, |
|---|
| | | deadlinetype: v._deadlinetype.text, |
|---|
| | | provincecode: v._locations.pCode, |
|---|
| | | provincename: v._locations.pName, |
|---|
| | | citycode: v._locations.cCode, |
|---|
| | | cityname: v._locations.cName, |
|---|
| | | districtcode: v._locations.dCode, |
|---|
| | | districtname: v._locations.dName, |
|---|
| | | starttime: v._timeArr[0], |
|---|
| | | endtime: v._timeArr[1], |
|---|
| | | // fixme 2024.10.16ï¼ åç»å å
¥ç¨æ·ç³»ç»åï¼éç¨å½åç»å½ç¨æ·ä¿¡æ¯ |
|---|
| | | plannerguid: 'rAR0A4gJdlOZEqZs', |
|---|
| | | plannerusername: 'ccheck', |
|---|
| | | plannerrealname: 'æ´æ¹å®¡æ ¸', |
|---|
| | | settime: new Date(), |
|---|
| | | executorguids: executors.id, |
|---|
| | | executorusernames: executors.uName, |
|---|
| | | executorrealnames: executors.rName, |
|---|
| | | t1stverifierguid: 'rAR0A4gJdlOZEqZs', |
|---|
| | | t1stverifierusername: 'ccheck', |
|---|
| | | t1stverifierrealname: 'æ´æ¹å®¡æ ¸', |
|---|
| | | t1stverifytime: new Date(), |
|---|
| | | t1stisverify: true, |
|---|
| | | runingstatus: 'æªæ§è¡', |
|---|
| | | extension1: '3', |
|---|
| | | extension2: '0' |
|---|
| | | }; |
|---|
| | | // success(); |
|---|
| | | // emit('submit', task); |
|---|
| | | taskApi |
|---|
| | | .putTask(task) |
|---|
| | | .then((res) => { |
|---|
| | | success(); |
|---|
| | | emit('submit', res.data); |
|---|
| | | }) |
|---|
| | | .catch((err) => fail(err)); |
|---|
| | | } |
|---|
| | | function cancel() { |
|---|
| | | emit('cancel'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*************************** æ°æ®åå§å ************************************/ |
|---|
| | | |
|---|
| | | // åé项çåå§å |
|---|
| | | function initOptions() { |
|---|
| | | domainApi.fetchTaskType().then((res) => { |
|---|
| | | taskTypeOptions.value = res.map((v) => { |
|---|
| | | return { |
|---|
| | | label: v.text, |
|---|
| | | value: v |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | formInfo.value._type = taskTypeOptions.value[0].value; |
|---|
| | | }); |
|---|
| | | domainApi.fetchDeadlineType().then((res) => { |
|---|
| | | deadlineTypeOptions.value = res.map((v) => { |
|---|
| | | return { |
|---|
| | | label: v.text, |
|---|
| | | value: v |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | formInfo.value._deadlinetype = deadlineTypeOptions.value[0].value; |
|---|
| | | }); |
|---|
| | | domainApi.fetchLevelType().then((res) => { |
|---|
| | | levelOptions.value = res.map((v) => { |
|---|
| | | return { |
|---|
| | | label: v.text, |
|---|
| | | value: v.value |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | formInfo.value.levelnum = levelOptions.value[1].value; |
|---|
| | | }); |
|---|
| | | userApi.getUserByType(1).then((res) => { |
|---|
| | | executorOptions.value = res.map((v) => { |
|---|
| | | return { |
|---|
| | | label: v.realname, |
|---|
| | | value: v.guid, |
|---|
| | | data: v |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | formInfo.value._executors = executorOptions.value.map((v) => v.value); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | onMounted(() => { |
|---|
| | | initOptions(); |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style scoped></style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <SceneMap></SceneMap> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script setup> |
|---|
| | | |
|---|
| | | |
|---|
| | | </script> |
|---|
