大屏按钮样式修改

黄何裕

2024-07-22 3c0701d153c00d3f5458fce7e14c5a23a795541b

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

@@ -10,45 +10,39 @@
            {{ item.unitName }}（{{ item.workOrderCount }}）
          </el-menu-item>
        </el-menu>
        <el-popover
          placement="right"
          width="400"
          trigger="click">
          <el-form :model="settingForm" :rules="settingRules" ref="settingForm" label-width="120px">
            <el-form-item label="录像质量" prop="videoQuality">
              <el-select style="width: 100%" v-model="settingForm.videoQuality" placeholder="最低录像质量">
                <el-option label="全录像" value="全录像"/>
                <el-option label="部分录像" value="部分录像"/>
                <el-option label="无录像" value="无录像"/>
              </el-select>
            </el-form-item>
            <el-form-item label="点位离线时长" prop="outLine">
              <el-input type="number" v-model="settingForm.outLine" placeholder="不能超过多久">
                <template slot="append">分钟</template>
              </el-input>
            </el-form-item>
            <el-form-item label="视频标注准确率" prop="videoLabel">
              <el-input type="number" v-model="settingForm.videoLabel" placeholder="最低准确率">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="submitSetting">保存</el-button>
            </el-form-item>
          </el-form>
          <el-button title="自动生成工单设置" slot="reference" class="setting" style="" type="success" icon="el-icon-s-tools" circle></el-button>
        </el-popover>
      </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-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.menuName"
              placeholder="关键词搜索"
              clearable
              @keyup.enter.native="page"
            />
          </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="small" type="danger"  class="op" slot="reference">全部下发</el-button>
          <el-button size="mini" plain type="danger" class="op" slot="reference">全部下发</el-button>
        </el-popconfirm>

        <el-popover
@@ -59,19 +53,20 @@
          <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_HALF_HOUR">最近30分钟</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>
@@ -83,17 +78,17 @@
              </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-button size="small" type="primary" @click="page">刷新</el-button>
        <el-button size="small" type="primary" @click="handleAdd">新增</el-button>
      </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">
@@ -139,6 +134,7 @@
            reserve-keyword
            placeholder="请选择来源"
            :remote-method="remoteGetPoints"
            @change="setPointId"
            :loading="selectLoading">
            <el-option
              v-for="item in pointList"
@@ -173,6 +169,11 @@
  name: 'index',
  data() {
    return {
      showSearch: true,
      selectedIdsDistributeForm: {
        ids: [],
        unitId: null
      },
      unitList: [],
      settingForm: {
        // 离线
@@ -212,19 +213,21 @@
      // 下发表单验证
      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: "change" }
          { required: true, message: "请故障类型", trigger: "blur" }
        ],
      },
      queryParams: {
        unitId: null,
        keyword: '',
        status: 'WAIT_DISTRIBUTE',
        pageNum: 1,
        pageSize: 20,
        pageSize: 10,
      },
      // 总条数
      total: 0,
@@ -270,6 +273,10 @@
    },
  },
  methods: {
    setPointId(selectedValue) {
      const selectedItem = this.pointList.find(item => item.value === selectedValue);
      this.form.pointId = selectedItem.id
    },
    submitSetting() {
      this.$refs['settingForm'].validate((valid) => {
        if (valid) {
@@ -284,7 +291,7 @@
      this.loading = true;
      this.selectUnit();
      distributeWorkOrder(this.queryParams).then(res => {
        this.workOrderList = res.data;
        this.workOrderList = res.data.records;
        this.total = res.total;
        this.loading = false;
      })
@@ -301,44 +308,43 @@
      this.fastDistributeForm.end = null
      this.fastDistributeForm.fastNumLimit = null
      this.fastTimeRange = []
      this.fastDistributeForm.errorType = null
    },
    // 全部下发
    allDistribute() {
      selectedIdsDistribute([]).then(res => {
      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.$refs['fastDistributeForm'].validate((valid) => {
        if (valid) {
          this.fastDistributeForm.start = this.fastTimeRange[0]
          this.fastDistributeForm.end = this.fastTimeRange[1]
          this.fastDistributeForm.unitId = this.unitId
          fastDistribute(this.fastDistributeForm).then(res => {
            // this.clearFastDistributeForm();
            res.code == 200 ? this.$message.success(res.msg) : this.$message.warning(res.msg)
            this.clearFastDistributeForm();
            this.page();
          })
        // } else {
        //   return false
        // }
      // })
        }
      })
    },
    // 选中工单下发
    selectedDistribute() {
      if (this.multipleSelection.length < 1) {
        this.$message.warning("请先选择要下发的工单")
        return
      } 
      selectedIdsDistribute(this.multipleSelection).then(res => {
      }
      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) {