数据中心优化完成

fuliqi

2024-11-01 4529cc97736ab92b30fb6351b37970bf53a22794

 src/views/system/work-order/distribute/index.vue

@@ -2,66 +2,101 @@
  <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 :default-active="activeIndex" class="el-menu" mode="horizontal" @select="handleSelect">
          <el-menu-item index="0" @click="changeUnit(null, '全部')">
            全部单位
            全部单位（{{ totalWorkOrders }}）
          </el-menu-item>
          <el-menu-item index="1">
            自流井运维单位(70/70)
          <el-menu-item :index="index + 1" v-for="(item, index) in unitList" :key="index" @click="changeUnit(item.id, item.value)">
            {{ item.unitName }}（{{ item.workOrderCount }}）
          </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-row class="op-warp">
      <el-row v-show="showSearch">
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
          <el-form-item label="关键词" prop="keyword">
            <el-input
              v-model="queryParams.keyword"
              placeholder="关键词搜索"
              clearable
              @keyup.enter.native="page"
              @clear="page"
            />
          </el-form-item>
          <el-form-item label="故障类型" prop="errorTypeList">
            <el-select v-model="queryParams.errorTypeList" multiple placeholder="故障类型" clearable @change="page" @clear="page">
              <el-option v-for="dict in dict.type.error_type"
                         :value="dict.value"
                         :label="dict.label"/>
            </el-select>
          </el-form-item>
          <el-form-item label="下发状态" prop="status">
            <el-select v-model="queryParams.status" @change="page" placeholder="下发状态" clearable>
              <el-option label="未下发" value="WAIT_DISTRIBUTE"/>
              <el-option label="已下发" value="DISTRIBUTED"/>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="small" @click="page">搜索</el-button>
          </el-form-item>
        </el-form>
      </el-row>

      <el-row>
        <el-button size="mini" plain type="info" @click="selectedDistribute" class="op">下发选中工单</el-button>
        <el-popconfirm
          @confirm="allDistribute"
          title="确定要下发所有工单吗？"
        >
          <el-button size="mini" plain type="danger" class="op" slot="reference">全部下发</el-button>
        </el-popconfirm>

        <el-popover
          class="op"
          placement="right"
          width="300px"
          trigger="click">
          <span style="font-weight: bold;font-size: 16px">快速下发</span>
          <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-radio v-model="fastDistributeForm.fastWay" label="LAST_HOUR">最近1小时</el-radio>
              <el-radio v-model="fastDistributeForm.fastWay" label="LAST_TWO_HOUR">最近2小时</el-radio>
              <el-radio v-model="fastDistributeForm.fastWay" label="LAST_DAY">最近1天</el-radio>
              <el-radio v-model="fastDistributeForm.fastWay" label="CUSTOM">自定义</el-radio>
            </el-form-item>
            <el-form-item v-if="fastDistributeForm.fastWay === '101'" label="时间范围">
            <el-form-item v-if="fastDistributeForm.fastWay === 'CUSTOM'" label="时间范围">
              <el-date-picker
                style="width: 100%"
                v-model="fastTimeRange"
                type="datetimerange"
                range-separator="至"
                start-placeholder="开始日期"
                value-format="yyyy-MM-dd HH:mm:ss"
                end-placeholder="结束日期">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="故障类型" prop="errorType">
              <el-select v-model="fastDistributeForm.errorType" multiple>
                <el-option v-for="dict in dict.type.error_type"
                           :value="dict.value"
                           :key="dict.value"
                           :label="dict.label"/>
              </el-select>
            </el-form-item>
            <el-form-item label="数量限制" prop="fastNumLimit">
              <el-input v-model="fastDistributeForm.fastNumLimit" size="small" type="number" placeholder="此次工单下发最大数量"></el-input>
              <el-input v-model="fastDistributeForm.fastNumLimit" 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-button slot="reference" type="primary" size="mini" plain>快捷下发</el-button>
        </el-popover>
      </el-col>
        <el-button size="mini" plain type="success" @click="handleAdd">手动新增工单</el-button>
        <right-toolbar :showSearch.sync="showSearch" @queryTable="page"></right-toolbar>
      </el-row>
    </el-row>

    <el-row class="content-warp" type="flex" justify="left">
@@ -69,10 +104,23 @@
        <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="serialNumber"/>
          <el-table-column label="故障点位" align="center" prop="source">
            <template slot-scope="scope">
              <el-popover
                placement="right"
                :title="scope.row.important ? '重点点位': '正常点位'"
                width="200"
                trigger="hover">
                <span :class="{important: scope.row.important}" slot="reference">{{ scope.row.source }}</span>
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column label="故障类型" align="center" prop="errorType"/>
          <el-table-column label="运维单位" align="center" prop="unitName"/>
          <el-table-column label="产生时间" align="center" prop="createTime"/>
          <el-table-column v-if="queryParams.status === 'DISTRIBUTED'" label="下发人" align="center" prop="realName"/>
          <el-table-column v-if="queryParams.status === 'DISTRIBUTED'" label="下发时间" align="center" prop="distributeTime"/>
        </el-table>

        <pagination
@@ -85,14 +133,79 @@
      </el-col>

    </el-row>

    <!-- 添加或修改【请填写功能名称】对话框 -->
    <el-dialog title="手动新增工单" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="运维单位" prop="unitId">
          <el-select v-model="form.unitId" placeholder="请选择">
            <el-option
              v-for="item in unitList"
              :key="item.id"
              :label="item.unitName"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="故障点位" prop="source">
          <el-select
            v-model="form.source"
            filterable
            remote
            reserve-keyword
            placeholder="国标码/点位名称搜索"
            :remote-method="remoteGetPoints"
            @change="setPointId"
            :loading="selectLoading">
            <el-option
              v-for="item in pointList"
              :key="item.id"
              :label="item.value"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="故障类型" prop="errorType">
          <el-select v-model="form.errorType" multiple>
            <el-option v-for="dict in dict.type.error_type"
                       :value="dict.value"
                       :key="dict.value"
                       :label="dict.label"/>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button type="primary" @click="submitForm">确 定</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
import {distributeWorkOrder, fastDistribute, addWorkOrder, updateWorkOrder, selectedIdsDistribute} from '@/api/platform/work-order'
import {workList} from "@/api/platform/unit";
import { pointSelectData } from "@/api/platform/point";
export default {
  dicts: ['error_type'],
  name: 'index',
  data() {
    return {
      showSearch: true,
      selectedIdsDistributeForm: {
        ids: [],
        unitId: null
      },
      unitList: [],
      settingForm: {
        // 离线
        outLine: null,
        // 视频可用
        videoQuality: "",
        // 视频标注
        videoLabel: ""
      },
      // 当前运维单位
      unitId: null,
      unitName: "",
@@ -102,22 +215,40 @@
      fastTimeRange: [],
      // 下发
      fastDistributeForm: {
        fastWay: '',
        fastWay: null,
        fastNumLimit: null,
        start: null,
        end: null,
        unitId: null
      },
      // 自动生成工单规则
      settingRules: {
        outLine: [
          { required: true, message: "请填写点位离线时长", trigger: "blur" }
        ],
        videoQuality: [
          { required: true, message: "请填写视频可用程度", trigger: "change" }
        ],
        videoLabel: [
          { required: true, message: "请填写点视频标注准确率", trigger: "blur" }
        ],
      },
      // 下发表单验证
      fastDistributeRules: {
        fastWay: [
          { required: true, message: "请选择快速分发方式", trigger: "change" }
          { required: true, message: "请选择快速分发方式", trigger: "blur" }
        ],
        fastNumLimit: [
          { required: true, message: "请输入快速分发数量限制", trigger: "change" }
          { required: true, message: "请输入快速分发数量限制", trigger: "blur" }
        ],
        errorType: [
          { required: true, message: "请故障类型", trigger: "blur" }
        ],
      },
      queryParams: {
        unitId: null,
        keyword: '',
        status: 'WAIT_DISTRIBUTE',
        pageNum: 1,
        pageSize: 10,
      },
@@ -128,13 +259,73 @@
      activeIndex: '0',
      loading: false,
      workOrderList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 表单参数
      form: {
      },
      // 下拉加载
      selectLoading: false,
      // 点位list
      pointList: [],
      // 表单校验
      rules: {
        source: [
          { required: true, message: "工单来源不能为空", trigger: "blur" }
        ],
        workOrderNo: [
          { required: true, message: "工单号不能为空", trigger: "blur" }
        ],
        unitId: [
          { required: true, message: "运维单位不能为空", trigger: "blur" }
        ],
        errorType: [
          { required: true, message: "请选择故障类型", trigger: "blur" }
        ],
      }
    }
  },
  mounted() {
    this.page();
  },
  computed: {
    totalWorkOrders() {
      return this.unitList.reduce((total, item) => total + item.workOrderCount, 0);
    },
  },
  methods: {
    setPointId(selectedValue) {
      const selectedItem = this.pointList.find(item => item.value === selectedValue);
      this.form.serialNumber = selectedItem.id
    },
    submitSetting() {
      this.$refs['settingForm'].validate((valid) => {
        if (valid) {
          this.$modal.msgSuccess("保存成功")
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    page() {
      this.loading = true;
      distributeWorkOrder(this.queryParams).then(data => {
        workList(this.queryParams).then(res => {
          this.unitList = res.data;
          this.workOrderList = data.data.records;
          this.total = data.total;
          this.loading = false;
        })
      })
    },
    changeUnit(unitId, unitName) {
      this.unitId = unitId;
      this.queryParams.unitId = unitId;
      this.unitName = unitName;
      // todo 触发数据查询
      this.page()
    },
    clearFastDistributeForm() {
      this.fastDistributeForm.fastWay = ''
@@ -142,34 +333,28 @@
      this.fastDistributeForm.end = null
      this.fastDistributeForm.fastNumLimit = null
      this.fastTimeRange = []
      this.fastDistributeForm.errorType = null
    },
    allDis() {},
    // 全部下发
    allDistribute() {
      this.$modal.confirm("确定要下发" + (this.unitId ? this.unitName + "下的" : "所有工单") + "吗？").then(function() {
        return this.allDis();
      }).then(() => {
        // this.getList();
        // this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
      this.selectedIdsDistributeForm.unitId = this.unitId
      selectedIdsDistribute(this.selectedIdsDistributeForm).then(res => {
        this.$message.success("工单下发成功")
        this.page();
      })
    },
    // 快速下发
    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.start = this.fastTimeRange[0]
          this.fastDistributeForm.end = this.fastTimeRange[1]
          this.fastDistributeForm.unitId = this.unitId
          // todo 提交快速发布请求
        } else {
          return false
          fastDistribute(this.fastDistributeForm).then(res => {
            res.code == 200 ? this.$message.success(res.msg) : this.$message.warning(res.msg)
            this.clearFastDistributeForm();
            this.page();
          })
        }
      })
    },
@@ -179,23 +364,93 @@
        this.$message.warning("请先选择要下发的工单")
        return
      }
      // todo 下发工单
      this.selectedIdsDistributeForm.unitId = this.unitId;
      this.selectedIdsDistributeForm.ids = this.multipleSelection;
      selectedIdsDistribute(this.selectedIdsDistributeForm).then(res => {
        this.$message.success("工单下发成功")
        this.selectedIdsDistributeForm.ids = [];
        this.page();
      })
    },
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
    },
    getList() {

      this.page()
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.multipleSelection = selection.map(item => item.id)
      this.multipleSelection = selection.map(item => item.workOrderNo)
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加合同";
    },
    // 表单重置
    reset() {
      this.form = {};
      this.resetForm("form");
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateWorkOrder(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.page();
            });
          } else {
            addWorkOrder(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.pointList = [];
              this.open = false;
              this.page();
            });
          }
        }
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 运维公司下拉数据
    selectUnit() {
      workList(this.queryParams).then(res => {
        this.unitList = res.data;
      })
    },
    // 远程搜索点位
    remoteGetPoints(query) {
      if (query !== '') {
        this.selectLoading = true;
        let data = {
          "keyword": query
        }
        pointSelectData(data).then(res => {
          this.pointList = res.data;
          this.selectLoading = false;
        })
      } else {
        this.pointList = [];
      }
    },
  }
}
</script>

<style scoped>
.important {
  color: red;
}
/deep/ .el-popover__title {
  margin-bottom: 0px;
}
.row {
  padding: 0 20px;
}
@@ -213,4 +468,5 @@
  top: 10px;
  right:5px
}

</style>