<template>
|
<div class="row">
|
<el-row type="flex" justify="left">
|
<el-col :span="24" style="position: relative">
|
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
|
<el-menu-item index="0" @click="changeUnit(null, '全部')">
|
全部单位
|
</el-menu-item>
|
<el-menu-item index="1">
|
自流井运维单位(70/70)
|
</el-menu-item>
|
<el-menu-item index="2">
|
大安运维(50/50)
|
</el-menu-item>
|
<el-menu-item index="3">富顺运维单位(20/70)</el-menu-item>
|
<el-menu-item index="4">高新运维单位(15/40)</el-menu-item>
|
<el-menu-item index="5">荣县运维单位(90/90)</el-menu-item>
|
<el-menu-item index="6">贡井运维单位(45/45)</el-menu-item>
|
<el-menu-item index="7">沿滩运维单位(70/70)</el-menu-item>
|
</el-menu>
|
<el-tooltip class="item" effect="dark" content="自动下发设置" placement="left">
|
<el-button class="setting" style="" type="success" icon="el-icon-s-tools" circle></el-button>
|
</el-tooltip>
|
</el-col>
|
</el-row>
|
|
<el-row class="op-warp" type="flex" justify="left" >
|
<el-col :span="24">
|
<el-button size="small" type="info" @click="selectedDistribute" class="op">下发选中工单</el-button>
|
<el-button size="small" type="danger" @click="allDistribute" class="op">全部下发</el-button>
|
<el-popover
|
class="op"
|
placement="right"
|
width="300px"
|
trigger="click">
|
<span style="font-weight: bold;font-size: 16px">快速下发</span>
|
<el-form ref="fastDistributeForm" :model="fastDistributeForm" :rules="fastDistributeRules" label-width="80px">
|
<el-form-item label="快捷方式" prop="fastWay">
|
<el-radio v-model="fastDistributeForm.fastWay" label="0">最近30分钟</el-radio>
|
<el-radio v-model="fastDistributeForm.fastWay" label="01">最近1小时</el-radio>
|
<el-radio v-model="fastDistributeForm.fastWay" label="10">最近2小时</el-radio>
|
<el-radio v-model="fastDistributeForm.fastWay" label="11">最近1天</el-radio>
|
<el-radio v-model="fastDistributeForm.fastWay" label="101">自定义</el-radio>
|
</el-form-item>
|
<el-form-item v-if="fastDistributeForm.fastWay === '101'" label="时间范围">
|
<el-date-picker
|
style="width: 100%"
|
v-model="fastTimeRange"
|
type="datetimerange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期">
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="数量限制" prop="fastNumLimit">
|
<el-input v-model="fastDistributeForm.fastNumLimit" size="small" type="number" placeholder="此次工单下发最大数量"></el-input>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" size="small" @click="fastDistribute">立即下发</el-button>
|
</el-form-item>
|
</el-form>
|
<el-button slot="reference" type="primary" size="small">快捷下发</el-button>
|
</el-popover>
|
</el-col>
|
</el-row>
|
|
<el-row class="content-warp" type="flex" justify="left">
|
<el-col :span="24">
|
<el-table v-loading="loading" :data="workOrderList" @selection-change="handleSelectionChange">
|
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column label="工单号" align="center" prop="workOrderNo"/>
|
<el-table-column label="运维单位" align="center" prop="unitName"/>
|
<el-table-column label="工单来源" align="center" prop="source"/>
|
<el-table-column label="故障类型" align="center" prop="errorType"/>
|
<el-table-column label="产生时间" align="center" prop="createTime"/>
|
</el-table>
|
|
<pagination
|
v-show="total>0"
|
:total="total"
|
:page.sync="queryParams.pageNum"
|
:limit.sync="queryParams.pageSize"
|
@pagination="getList"
|
/>
|
</el-col>
|
|
</el-row>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: 'index',
|
data() {
|
return {
|
// 当前运维单位
|
unitId: null,
|
unitName: "",
|
// 多选
|
multipleSelection: [],
|
// 下发时间范围
|
fastTimeRange: [],
|
// 下发
|
fastDistributeForm: {
|
fastWay: '',
|
fastNumLimit: null,
|
start: null,
|
end: null,
|
unitId: null
|
},
|
// 下发表单验证
|
fastDistributeRules: {
|
fastWay: [
|
{ required: true, message: "请选择快速分发方式", trigger: "change" }
|
],
|
fastNumLimit: [
|
{ required: true, message: "请输入快速分发数量限制", trigger: "change" }
|
],
|
},
|
queryParams: {
|
pageNum: 1,
|
pageSize: 10,
|
},
|
// 总条数
|
total: 0,
|
// 非多个禁用
|
multiple: true,
|
activeIndex: '0',
|
loading: false,
|
workOrderList: [],
|
}
|
},
|
methods: {
|
changeUnit(unitId, unitName) {
|
this.unitId = unitId;
|
this.unitName = unitName;
|
// todo 触发数据查询
|
},
|
clearFastDistributeForm() {
|
this.fastDistributeForm.fastWay = ''
|
this.fastDistributeForm.start = null
|
this.fastDistributeForm.end = null
|
this.fastDistributeForm.fastNumLimit = null
|
this.fastTimeRange = []
|
},
|
allDis() {},
|
// 全部下发
|
allDistribute() {
|
this.$modal.confirm("确定要下发" + (this.unitId ? this.unitName + "下的" : "所有工单") + "吗？").then(function() {
|
return this.allDis();
|
}).then(() => {
|
// this.getList();
|
// this.$modal.msgSuccess("删除成功");
|
}).catch(() => {});
|
},
|
// 快速下发
|
fastDistribute() {
|
this.$refs['fastDistributeForm'].validate((valid) => {
|
if (valid) {
|
// 如果是自定义方式，那么时间段必填
|
if (this.fastDistributeForm.fastWay === '101' && !this.fastTimeRange.length > 0) {
|
this.$message.warning("请选择时间范围")
|
return false
|
}
|
if (this.fastTimeRange.length > 0) {
|
this.fastDistributeForm.start = this.fastTimeRange[0]
|
this.fastDistributeForm.end = this.fastTimeRange[1]
|
}
|
this.fastDistributeForm.unitId = this.unitId
|
// todo 提交快速发布请求
|
} else {
|
return false
|
}
|
})
|
},
|
// 选中工单下发
|
selectedDistribute() {
|
if (this.multipleSelection.length < 1) {
|
this.$message.warning("请先选择要下发的工单")
|
return
|
}
|
// todo 下发工单
|
},
|
handleSelect(key, keyPath) {
|
console.log(key, keyPath);
|
},
|
getList() {
|
|
},
|
// 多选框选中数据
|
handleSelectionChange(selection) {
|
this.multipleSelection = selection.map(item => item.id)
|
},
|
}
|
}
|
</script>
|
|
<style scoped>
|
.row {
|
padding: 0 20px;
|
}
|
.op-warp {
|
margin-top: 10px;
|
}
|
.content-warp {
|
margin-top: 10px;
|
}
|
.op {
|
margin-right: 5px;
|
}
|
.setting {
|
position: absolute;
|
top: 10px;
|
right:5px
|
}
|
</style>
|
