|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <GlobalWindow | 
|---|
|  |  |  | :title="title" | 
|---|
|  |  |  | :visible.sync="visible" | 
|---|
|  |  |  | :confirm-working="isWorking" | 
|---|
|  |  |  | @confirm="confirm" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <GlobalWindow width="520px" :title="title" @close="close" :visible.sync="visible" :confirm-working="isWorking" | 
|---|
|  |  |  | @confirm="confirm"> | 
|---|
|  |  |  | <div class="warnning"> | 
|---|
|  |  |  | {{ form.id ? '编辑计划对已生成的任务无效,会在下次生成任务时生效,且当天不会生成两个任务' : '新建巡检计划会从当天开始,按照配置规则产生对应的巡检任务' }} | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <el-form :model="form" ref="form" :rules="rules"> | 
|---|
|  |  |  | <el-form-item label="创建人编码" prop="creator"> | 
|---|
|  |  |  | <el-input v-model="form.creator" placeholder="请输入创建人编码" v-trim/> | 
|---|
|  |  |  | <el-form-item label="计划名称" prop="title"> | 
|---|
|  |  |  | <el-input v-model="form.title" placeholder="请输入标题" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="创建时间" prop="createDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.createDate" value-format="yyyy-MM-dd" placeholder="请输入创建时间"></el-date-picker> | 
|---|
|  |  |  | <el-form-item label="巡检线路" prop="lineId"> | 
|---|
|  |  |  | <el-select v-model="form.lineId" filterable clearable> | 
|---|
|  |  |  | <el-option v-for="item in lineList" :value="item.id" :label="item.name"></el-option> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="更新人编码" prop="editor"> | 
|---|
|  |  |  | <el-input v-model="form.editor" placeholder="请输入更新人编码" v-trim/> | 
|---|
|  |  |  | <el-form-item label="巡检负责人" prop="userIds"> | 
|---|
|  |  |  | <el-select v-model="form.userIds" filterable clearable> | 
|---|
|  |  |  | <el-option v-for="item in staffList" :value="item.id" :label="item.realname"></el-option> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="更新时间" prop="editDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.editDate" value-format="yyyy-MM-dd" placeholder="请输入更新时间"></el-date-picker> | 
|---|
|  |  |  | <el-form-item label="计划开始日期-结束日期" prop="selDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.selDate" @change="changeDate" is-range range-separator="-" | 
|---|
|  |  |  | value-format="yyyy-MM-dd" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期" /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="是否删除0否 1是" prop="isdeleted"> | 
|---|
|  |  |  | <el-input v-model="form.isdeleted" placeholder="请输入是否删除0否 1是" v-trim/> | 
|---|
|  |  |  | <el-form-item label="计划执行时间"> | 
|---|
|  |  |  | <el-time-picker v-model="form.selTime" @change="changeTime" is-range range-separator="-" format="HH:mm" | 
|---|
|  |  |  | value-format="HH:mm:ss" start-placeholder="开始时间" end-placeholder="结束时间" placeholder="选择时间范围" /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="标题" prop="title"> | 
|---|
|  |  |  | <el-input v-model="form.title" placeholder="请输入标题" v-trim/> | 
|---|
|  |  |  | <el-form-item label="重复频率"> | 
|---|
|  |  |  | <el-select v-model="form.circleType" @change="changeType" filterable> | 
|---|
|  |  |  | <el-option :value="0" label="每天"></el-option> | 
|---|
|  |  |  | <el-option :value="1" label="每周"></el-option> | 
|---|
|  |  |  | <el-option :value="2" label="每月"></el-option> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="备注" prop="remark"> | 
|---|
|  |  |  | <el-input v-model="form.remark" placeholder="请输入备注" v-trim/> | 
|---|
|  |  |  | <el-form-item v-if="form.circleType == 1" prop="circleDays" label="重复规则"> | 
|---|
|  |  |  | <div class="weeks"> | 
|---|
|  |  |  | <div class="week" @click="weekClick(i)" :class="{ active: item.sel }" v-for="item, i in weeks">{{ item.la }} | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="状态 0启用 1禁用" prop="status"> | 
|---|
|  |  |  | <el-input v-model="form.status" placeholder="请输入状态 0启用 1禁用" v-trim/> | 
|---|
|  |  |  | <el-form-item v-if="form.circleType == 2" prop="circleDays" label="重复规则"> | 
|---|
|  |  |  | <div class="weeks"> | 
|---|
|  |  |  | <div class="week" @click="monthClick(i)" :class="{ active: item.sel }" v-for="item, i in monthsList">{{ | 
|---|
|  |  |  | item.la | 
|---|
|  |  |  | }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="排序码" prop="sortnum"> | 
|---|
|  |  |  | <el-input v-model="form.sortnum" placeholder="请输入排序码" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="巡检点编码(关联yw_patrol_line)" prop="lineId"> | 
|---|
|  |  |  | <el-input v-model="form.lineId" placeholder="请输入巡检点编码(关联yw_patrol_line)" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="巡检负责人编码集合,多个使用英文逗号隔开" prop="userIds"> | 
|---|
|  |  |  | <el-input v-model="form.userIds" placeholder="请输入巡检负责人编码集合,多个使用英文逗号隔开" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="处理人编码(关联system_user)" prop="dealUserId"> | 
|---|
|  |  |  | <el-input v-model="form.dealUserId" placeholder="请输入处理人编码(关联system_user)" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="处理时间" prop="dealDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.dealDate" value-format="yyyy-MM-dd" placeholder="请输入处理时间"></el-date-picker> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="处理备注" prop="dealInfo"> | 
|---|
|  |  |  | <el-input v-model="form.dealInfo" placeholder="请输入处理备注" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="循环周期  0每天 1每周 2每天" prop="circleType"> | 
|---|
|  |  |  | <el-input v-model="form.circleType" placeholder="请输入循环周期  0每天 1每周 2每天" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="循环重复规则 1-31,多个英文逗号隔开" prop="circleDays"> | 
|---|
|  |  |  | <el-input v-model="form.circleDays" placeholder="请输入循环重复规则 1-31,多个英文逗号隔开" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="开始日期" prop="startDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.startDate" value-format="yyyy-MM-dd" placeholder="请输入开始日期"></el-date-picker> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="结束日期" prop="endDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.endDate" value-format="yyyy-MM-dd" placeholder="请输入结束日期"></el-date-picker> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="开始时间点" prop="startTime"> | 
|---|
|  |  |  | <el-input v-model="form.startTime" placeholder="请输入开始时间点" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="结束时间点" prop="endTime"> | 
|---|
|  |  |  | <el-input v-model="form.endTime" placeholder="请输入结束时间点" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="执行进度 0待开始 1进行中 2超期 3已完成" prop="processStatus"> | 
|---|
|  |  |  | <el-input v-model="form.processStatus" placeholder="请输入执行进度 0待开始 1进行中 2超期 3已完成" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </el-form> | 
|---|
|  |  |  | </GlobalWindow> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import BaseOpera from '@/components/base/BaseOpera' | 
|---|
|  |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
|---|
|  |  |  | import { fetchList as getLineList } from '@/api/Inspection/ywPatrolLine' | 
|---|
|  |  |  | import { detailById } from '@/api/Inspection/ywPatrolScheme' | 
|---|
|  |  |  | import { getUserList } from '@/api/system/user' | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: 'OperaYwPatrolSchemeWindow', | 
|---|
|  |  |  | extends: BaseOpera, | 
|---|
|  |  |  | components: { GlobalWindow }, | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | data() { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | // 表单数据 | 
|---|
|  |  |  | form: { | 
|---|
|  |  |  | 
|---|
|  |  |  | dealUserId: '', | 
|---|
|  |  |  | dealDate: '', | 
|---|
|  |  |  | dealInfo: '', | 
|---|
|  |  |  | circleType: '', | 
|---|
|  |  |  | circleType: 0, | 
|---|
|  |  |  | circleDays: '', | 
|---|
|  |  |  | startDate: '', | 
|---|
|  |  |  | endDate: '', | 
|---|
|  |  |  | startTime: '', | 
|---|
|  |  |  | endTime: '', | 
|---|
|  |  |  | processStatus: '' | 
|---|
|  |  |  | processStatus: '', | 
|---|
|  |  |  | selDate: [], | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 验证规则 | 
|---|
|  |  |  | lineList: [], | 
|---|
|  |  |  | staffList: [], | 
|---|
|  |  |  | weeks: [ | 
|---|
|  |  |  | { la: '周一', va: 1, sel: false }, | 
|---|
|  |  |  | { la: '周二', va: 2, sel: false }, | 
|---|
|  |  |  | { la: '周三', va: 3, sel: false }, | 
|---|
|  |  |  | { la: '周四', va: 4, sel: false }, | 
|---|
|  |  |  | { la: '周五', va: 5, sel: false }, | 
|---|
|  |  |  | { la: '周六', va: 6, sel: false }, | 
|---|
|  |  |  | { la: '周日', va: 7, sel: false }, | 
|---|
|  |  |  | ], | 
|---|
|  |  |  | monthsList: [], | 
|---|
|  |  |  | selCircleDays: [], | 
|---|
|  |  |  | rules: { | 
|---|
|  |  |  | title: [{ required: true, message: '请输入' }], | 
|---|
|  |  |  | lineId: [{ required: true, message: '请选择' }], | 
|---|
|  |  |  | userIds: [{ required: true, message: '请选择' }], | 
|---|
|  |  |  | selDate: [{ type: 'array', required: true, message: '请选择' }], | 
|---|
|  |  |  | circleDays: [{ required: true, message: '请选择' }], | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | created () { | 
|---|
|  |  |  | created() { | 
|---|
|  |  |  | this.config({ | 
|---|
|  |  |  | api: '/Inspection/ywPatrolScheme', | 
|---|
|  |  |  | 'field.id': 'id' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | weekClick(i) { | 
|---|
|  |  |  | this.weeks.forEach((item, index) => { | 
|---|
|  |  |  | if (i == index) { item.sel = !item.sel } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | this.$set(this.form, 'circleDays', this.weeks.filter(j => j.sel).map(a => a.va).join(',')) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | monthClick(i) { | 
|---|
|  |  |  | this.monthsList.forEach((item, index) => { | 
|---|
|  |  |  | if (i == index) { item.sel = !item.sel } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | this.$set(this.form, 'circleDays', this.monthsList.filter(j => j.sel).map(a => a.va).join(',')) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | changeTime(e) { | 
|---|
|  |  |  | if (e && e.length > 0) { | 
|---|
|  |  |  | this.$set(this.form, 'startTime', e[0]) | 
|---|
|  |  |  | this.$set(this.form, 'endTime', e[1]) | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | this.$set(this.form, 'startTime', '') | 
|---|
|  |  |  | this.$set(this.form, 'endTime', '') | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | changeDate(e) { | 
|---|
|  |  |  | if (e && e.length > 0) { | 
|---|
|  |  |  | this.$set(this.form, 'startDate', e[0]) | 
|---|
|  |  |  | this.$set(this.form, 'endDate', e[1]) | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | this.$set(this.form, 'startDate', '') | 
|---|
|  |  |  | this.$set(this.form, 'endDate', '') | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | changeType() { | 
|---|
|  |  |  | this.$set(this.form, 'circleDays', '') | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | getDetail(id) { | 
|---|
|  |  |  | detailById(id).then(res => { | 
|---|
|  |  |  | this.form = res | 
|---|
|  |  |  | if (res.userIds) { | 
|---|
|  |  |  | this.$set(this.form, 'userIds', Number(res.userIds)) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (res.startTime) { | 
|---|
|  |  |  | this.$set(this.form, 'selTime', [res.startTime, res.endTime]) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (res.circleDays) { | 
|---|
|  |  |  | const circleDays = res.circleDays.split(',') | 
|---|
|  |  |  | if (res.circleType == 1) { | 
|---|
|  |  |  | circleDays.forEach(i => { | 
|---|
|  |  |  | this.weeks.forEach(j => { | 
|---|
|  |  |  | if (i == j.va) { | 
|---|
|  |  |  | j.sel = true | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | setTimeout(() => { | 
|---|
|  |  |  | circleDays.forEach(i => { | 
|---|
|  |  |  | this.monthsList.forEach(j => { | 
|---|
|  |  |  | if (i == j.va) { | 
|---|
|  |  |  | j.sel = true | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, 500) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | this.$set(this.form, 'selDate', [res.startDate, res.endDate]) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initData() { | 
|---|
|  |  |  | getLineList({ | 
|---|
|  |  |  | model: {}, | 
|---|
|  |  |  | capacity: 9999, | 
|---|
|  |  |  | page: 1, | 
|---|
|  |  |  | }).then(res => { | 
|---|
|  |  |  | this.lineList = res.records | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | getUserList({}).then(res => { | 
|---|
|  |  |  | this.staffList = res | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | this.monthsList = [] | 
|---|
|  |  |  | for (let i = 1; i < 32; i++) { | 
|---|
|  |  |  | this.monthsList.push({ la: i, va: i, sel: false }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | close() { | 
|---|
|  |  |  | this.$refs.form.resetFields() | 
|---|
|  |  |  | this.visible = false | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | <style lang="scss" scoped> | 
|---|
|  |  |  | @import '@/assets/style/variables.scss'; | 
|---|
|  |  |  | .warnning{ | 
|---|
|  |  |  | padding: 6px 10px; | 
|---|
|  |  |  | background-color: #fcf3e6; | 
|---|
|  |  |  | font-size: 12px; | 
|---|
|  |  |  | color: #333333; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .weeks { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | flex-wrap: wrap; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .week { | 
|---|
|  |  |  | border: 1px solid #999999; | 
|---|
|  |  |  | width: 40px; | 
|---|
|  |  |  | height: 18px; | 
|---|
|  |  |  | text-align: center; | 
|---|
|  |  |  | line-height: 18px; | 
|---|
|  |  |  | font-size: 12px; | 
|---|
|  |  |  | margin-right: 8px; | 
|---|
|  |  |  | cursor: pointer; | 
|---|
|  |  |  | margin-bottom: 6px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .active { | 
|---|
|  |  |  | color: $primary-color; | 
|---|
|  |  |  | border: 1px solid $primary-color; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|