From 0d0968ec2d1a39c21e15e447c4f2227f70d6a11b Mon Sep 17 00:00:00 2001 From: 张晓波 <bingbo1993@126.com> Date: 星期一, 11 十二月 2023 10:38:37 +0800 Subject: [PATCH] Merge branch 'master' of http://111.30.93.211:10101/r/supipe --- web/src/views/SecureManage/RiskGrad/AreaPolling.vue | 392 ++----------------------------------------------------- 1 files changed, 16 insertions(+), 376 deletions(-) diff --git a/web/src/views/SecureManage/RiskGrad/AreaPolling.vue b/web/src/views/SecureManage/RiskGrad/AreaPolling.vue index 5a9c94f..61cee9b 100644 --- a/web/src/views/SecureManage/RiskGrad/AreaPolling.vue +++ b/web/src/views/SecureManage/RiskGrad/AreaPolling.vue @@ -7,400 +7,40 @@ <el-tab-pane label="任务打卡" name="second"></el-tab-pane> </el-tabs> </div> - <div class="main_header"> - <div class="header_item"> - <span class="header_label">巡检任务:</span> - <el-input size="mini" v-model="queryInfo.task" placeholder="请输入巡检任务" clearable></el-input> - </div> - <div class="header_item"> - <span class="header_label">巡检人员:</span> - <el-input size="mini" v-model="queryInfo.realName" placeholder="请输入巡检人员" clearable></el-input> - </div> - <div class="header_item"> - <el-button icon="el-icon-search" v-permission="'search'" @click="queryReset">查询</el-button> - <el-button icon="el-icon-plus" v-permission="'insert'" @click="addRow">新增</el-button> - </div> + <div class="content"> + <component :is="cpns[activeName]"></component> </div> - <div class="main_content"> - <cpn-table :table-index="true" :table-loading="tableConfig.loading" :table-data="tableConfig.tableData" - :table-columns="tableConfig.tableColumns" :page-total="tableConfig.total" :page-num.sync="queryInfo.pageNum" - :page-size.sync="queryInfo.pageSize" :page-change="pageChange"> - </cpn-table> - </div> - <!-- dialog --> - <el-dialog width="400px" class="prop_dialog" v-if="isRenderDialog" :title="dialogTitle" :visible.sync="asyncVisible" - @close="closeForm"> - - <!-- <cpn-form :form-config="formConfig" :form-items="formConfig.formItems"></cpn-form> --> - - <el-form class="rule_form" ref="ruleForm" :model="ruleForm" :rules="rules" label-width="auto"> - - <el-form-item label="巡检任务:" prop="task"> - <el-input v-model="ruleForm.task" placeholder="请输入巡检任务" clearable></el-input> - </el-form-item> - - <el-form-item label="巡检标准:" prop="standard"> - <el-input type="textarea" v-model="ruleForm.standard" placeholder="请输入巡检标准" clearable></el-input> - </el-form-item> - - <el-form-item label="巡检人员:" prop="realNames"> - <el-select v-model="ruleForm.realNames" multiple value-key="id" placeholder="请选择巡检人员"> - <el-option v-for="item in allPersons" :key="item.id" :label="item.label" :value="item"></el-option> - </el-select> - </el-form-item> - - <div class="divider"><span>巡检路线</span></div> - - <el-form-item label-width="0" v-for="(itemP, index) in ruleForm.paths " :key="index" :prop="'paths.' + - index + '.value'" :rules="{ required: true, message: '请选择巡检路线', trigger: 'change' }"> - <el-select style="margin-right: 10px;width: 323px;" v-model="itemP.value" value-key="id" - placeholder="请选择巡检路线"> - <el-option v-for=" item in allPath" :key="item.id" :label="item.label" :value="item"></el-option> - </el-select> - <el-button class="delete_btn" @click="delPath(itemP)">删除</el-button> - <el-button class="table_btn" v-show="index === ruleForm.paths.length - 1" - @click="addPath">添加</el-button> - </el-form-item> - <!-- <el-form-item label="区域名称:" prop="regionHazardInformId"> - <el-select v-model="ruleForm.regionHazardInformId" placeholder="请选择区域名称"> - <el-option v-for="item in areaNames" :key="item.id" :label="item.region" :value="item.id"> - </el-option> - </el-select> - </el-form-item> --> - </el-form> - <div slot="footer"> - <el-button @click="asyncVisible = false">取 消</el-button> - <el-button class="submit_btn" @click="onSubmit('ruleForm')">提 交</el-button> - </div> - </el-dialog> </div> </template> <script> -import {throttle} from '@/plugins/public' -import cpnTable from '@/components/element/Table' -// import cpnForm from '@/components/element/Form' +import PollingTask from './components/PollingTask' // 巡检任务 +import TaskPunchcard from './components/TaskPunchcard' // 任务打卡 export default { data() { return { - isRenderDialog: false, - asyncVisible: false, - activeName: 'first', // tabs切换 - submitMode: '', // 提交方式: add / update - allPersons: [], // 巡检人员 - allPath: [], // 巡检路线 - queryInfo: { - pageNum: 1, - pageSize: 10, - task: '', - realName: '', - }, - ruleForm: { - id: '', - task: '', - standard: '', - realNames: [], - paths: [ - {value: ''}, - ], - }, - rules: { - task: [{required: true, message: '请输入巡检任务', trigger: 'blur'}], - standard: [{required: true, message: '请输入巡检标准', trigger: 'blur'}], - realNames: [{required: true, message: '请选择巡检人员', trigger: 'change'}], - }, - tableConfig: { - loading: true, - tableData: [], - tableColumns: [], - total: 0, - }, - formConfig: {} + activeName: 'first', + cpns: { + first: 'PollingTask', + second: 'TaskPunchcard', + } } }, components: { - cpnTable, - // cpnForm, + PollingTask, + TaskPunchcard, }, - computed: { - isUpdate() { - return this.submitMode === 'update' - }, - dialogTitle() { - return this.isUpdate ? '修改巡检任务' : '新增巡检任务' - }, - }, - beforeCreate() { - this.$http = this.$api.Safety.RiskGrad.polling - }, - created() { - this.setTableColumn() - this.setFormColumn() - this.getLists() - }, - methods: { - // 获取table列表数据 - getLists() { - let params = this.queryInfo - let tableConfig = this.tableConfig - this.$http.getLists(params).then(res => { - if (res.statusMsg === 'ok') { - tableConfig.total = res.data.total - tableConfig.tableData = res.data.list - } - tableConfig.loading = false - }) - }, - // 获取管服人员数据(巡检人员) - getPerson() { - return new Promise(resolve => { - this.$api.Personnerl.SEARCHMORTGAGEELIST({ - userType: 1, - pageNum: 1, - pageSize: 9999 - }).then((res) => { - if (res.success) { - const list = res.data.list - const out = [] - list.forEach(item => { - out.push({ - id: item.userId, - label: item.realName, - }) - }) - this.allPersons.push(...out) - resolve() - } - }) - }) - }, - // 获取巡检路线 - getPath() { - new Promise(resolve => { - this.$api.Safety.RiskGrad.warning.getLists({ - pageNum: 1, - pageSize: 9999 - }).then((res) => { - if (res.success) { - const list = res.data.list - const out = [] - list.forEach(item => { - out.push({ - id: item.id, - label: item.region - }) - }) - this.allPath.push(...out) - resolve() - } - }) - }) - }, - // 初始化 table 配置 - setTableColumn() { - this.tableConfig.tableColumns = [ - {index: true}, - {name: "巡检任务", key: "task"}, - {name: "巡检标准", key: "standard"}, - {name: "巡检人员", key: "regionUsersList", formatter: row => row.realNames}, - {name: "巡检路线", key: "regionList", formatter: row => row.regions}, - { - operation: true, name: "操作", width: 140, value: [ - {name: "修改", permission: "update", handleRow: this.updateRow}, - {name: "删除", permission: "delete", handleRow: this.deleteRow},] - }, - ] - }, - // 初始化 form 配置 - setFormColumn() { - this.formConfig = { - formModels: { - task: '', - standard: '', - realNames: [], - }, - formItems: [ - {type: 'input', label: '巡检任务'}, - {type: 'textarea', label: '巡检标准'}, - { - type: 'select', label: '用户状态', options: this.allPersons, - } - // { - // type: 'datepicker', label: '创建时间', otherOptions: { - // startPlaceholder: '开始时间', - // endPlaceholder: '结束时间', - // type: 'daterange', - // 'unlink-panels': true - // } - // } - ], - itemColLayout: { - span: 8 - } - } - }, - // 查询按钮列表信息 - queryReset() { - this.queryInfo.pageNum = 1 - this.queryInfo.pageSize = 10 - this.getLists() - }, - // 重置表单 - resetForm(formName) { - this.$refs[formName].resetFields() - this.ruleForm.paths = [{value: ''}] - }, - // 显示表单 - async showForm() { - !this.allPath.length && this.getPath() - !this.allPersons.length && this.getPerson() - !this.isRenderDialog && (this.isRenderDialog = true) - this.asyncVisible = true - }, - closeForm() { - this.resetForm('ruleForm') - this.asyncVisible = false - }, - // 添加数据 - addRow() { - this.submitMode = 'add' - this.showForm() - - - console.log(this.allPersons) - console.log(this.formConfig) - }, - updateRow(row) { - this.submitMode = 'update' - this.showForm() - this.$nextTick(() => { - const {id, task, standard, regionUsersList, regionList} = row - const realNames = regionUsersList.map(item => { - return { - id: item.userId, - label: item.realName, - } - }) - const paths = regionList.map(item => { - return { - value: { - id: item.regionHazardInformId, - label: item.region, - }, - } - }) - this.ruleForm = { - id, - task, - standard, - realNames, - paths, - } - }) - }, - deleteRow(row) { - const params = {id: row.id} - this.$confirm("该操作将删除该信息,是否继续删除?", "提示", { - confirmButtonText: "确定", - cancelButtonText: "取消", - type: "warning" - }).then(() => { - this.$http.delete(params).then(res => { - if (res.statusMsg === 'ok') { - this.queryReset() - this.$message.success("删除成功!") - } else { - this.$message.warning(res.statusMsg) - } - }) - }).catch(() => { - this.$message.warning("您已取消") - }) - - }, - // 提交表单 - onSubmit: throttle(function (formName) { - this.$refs[formName].validate(valid => { - if (!valid) return - const {id, task, standard, realNames, paths} = this.ruleForm - const regionList = paths.map((item, index) => { - return { - sort: index + 1, - regionHazardInformId: item.value.id, - } - }) - const regionUsersList = realNames.map(item => { - return { - userId: item.id, - } - }) - const params = { - task, - standard, - regionList, - regionUsersList, - } - if (this.isUpdate) { - // 更新 - params.id = id - this.$http.update(params).then((res) => { - if (res.statusMsg === 'ok') { - this.closeForm() - this.getLists() - this.$message.success('更新成功!') - } else { - this.$message.warning(res.statusMsg) - } - }) - } else { - // 添加 - this.$http.insert(params).then((res) => { - if (res.statusMsg === 'ok') { - this.closeForm() - this.getLists() - this.$message.success('添加成功!') - } else { - this.$message.warning(res.statusMsg) - } - }) - } - }) - }, 1000), - addPath() { - this.ruleForm.paths.push({ - value: '' - }) - }, - delPath(item) { - var index = this.ruleForm.paths.indexOf(item) - if (index !== -1) { - this.ruleForm.paths.splice(index, 1) - } - }, - pageChange() { - this.getLists() - }, - } } </script> <style lang="scss" scoped> @import '@/style/layout-main.scss'; -.divider { - position: relative; - margin-bottom: 30px; - text-indent: 10px; - color: #fff; - border-left: 3px solid #18F6F8; +.main { + display: flex; - &::after { - content: ""; - position: absolute; - left: 0; - bottom: -8px; - width: 100%; - padding: 20px 0; - border-bottom: 1px solid #0C4D6F; + .content { + overflow: hidden; + flex: 1; } } </style> \ No newline at end of file -- Gitblit v1.9.3