kd-aiot-frontend/src/views/rulesManagement/components/programRulesDialog.vue

<template>
  <ele-modal width="80%" :visible="visible" v-if="visible" :append-to-body="true" custom-class="ele-dialog-form"
    :title="dialogTitle" @update:visible="updateVisible" :maxable="true">
    <header-title title="基本信息"></header-title>
    <el-form ref="addFormRef" :model="addForm" :rules="addFormRules" label-width="120px">
      <el-row>
        <el-col :span="8">
          <el-form-item label="计划配置单号" prop="code">
            <el-input v-model="addForm.code" size="small" placeholder="自动带出" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="计划配置名称" prop="name">
            <el-input v-model="addForm.name" size="small" placeholder="请输入" :disabled="isBindPlan"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="自动派单" prop="autoOrder">
            <el-select v-model="addForm.autoOrder" size="small" style="width: 100%" :disabled="isBindPlan">
              <el-option :value="1" label="是"></el-option>
              <el-option :value="0" label="否"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="计划完成时长" prop="duration">
            <div style="display: flex">
              <el-input type="number" v-model="addForm.duration" size="small" placeholder="请输入" :disabled="isBindPlan"
                @input="formDataDurationTime">
                <template #suffix>分钟</template>
              </el-input>
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="!dialogTitle.includes('量具送检')">
          <el-form-item label="类型" prop="type">
            <el-select v-model="addForm.type" :disabled="isBindPlan" size="small" @change="typeChange" style="width: 100%">
              <el-option :value="1" label="班组"></el-option>
              <el-option :value="0" label="个人"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="8" v-if="dispatchType && addForm.type == 1 && !dialogTitle.includes('量具送检')">
          <el-form-item label="班组" prop="teamId">
            <el-select
              v-model="addForm.teamId"
              :disabled="isBindPlan"
              size="small"
              @change="teamChange"
              style="width: 100%"
            >
              <el-option
                :value="i.id"
                :label="i.name"
                v-for="i in teamAllList"
                :key="i.id"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="8" v-if="dispatchType && addForm.type == 0 && !dialogTitle.includes('量具送检')">
          <el-form-item label="部门" prop="groupId">
            <deptSelect v-model="addForm.groupId" @changeGroup="searchDeptNodeClick" :disabled="isBindPlan" />
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="dispatchType && addForm.type == 0 && !dialogTitle.includes('量具送检')
        ">
          <!-- <el-form-item label="负责人" prop="executeIdList">
            <el-select v-model="addForm.executeIdList" size="small" style="width: 100%" :disabled="isBindPlan" multiple
              filterable>
              <el-option v-for="item in executorList" :key="item.id" :value="item.id" :label="item.name"></el-option>
            </el-select>
          </el-form-item> -->
          <el-form-item label="负责人" prop="executeIdList">
            <el-select
              v-model="addForm.executeIdList"
              :disabled="isBindPlan"
              size="small"
              style="width: 100%"
              multiple
              filterable
              @change="executeIdListChange"
            >
              <el-option
                v-for="item in executorList"
                :key="item.id"
                :value="item.id"
                :label="item.name"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="!dialogTitle.includes('量具送检')">
          <el-form-item label="审核人" prop="approvalUserId">
            <el-select v-model="addForm.approvalUserId" size="small" clearable style="width: 100%"
              :disabled="isBindPlan" filterable>
              <el-option v-for="item in uerList" :key="item.id" :value="item.id" :label="item.name"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="紧急程度" prop="urgent">
            <DictSelection dictName="紧急程度" clearable v-model="addForm.urgent" :disabled="isBindPlan">
            </DictSelection>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="状态" prop="status">
            <el-switch v-model="addForm.status" active-text="开" inactive-text="关" :active-value="1"
              :inactive-value="0" />
          </el-form-item>
        </el-col>
        <el-col :span="16">
          <el-form-item label="备注" prop="remark">
            <el-input type="textarea" resize="none" v-model="addForm.remark" :rows="2" placeholder="请详细说明" size="small"
              :disabled="isBindPlan"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-button type="primary" size="small" style="margin-bottom: 10px" @click="handleAddTab">添加规则</el-button>

      <el-tabs v-model="tabsValue" type="card" closable @tab-click="handleTab" @tab-remove="removeTab">
        <el-tab-pane v-for="(item, ruleIdListIndex) in ruleIdList" :key="item.ruleId" :label="item.name"
          :name="item.ruleId">
          <div class="el-tab_box">
            <div class="equipmentList_box">
              <header-title title="设备列表">
                <div>
                  <el-button size="small" icon="el-icon-plus" class="ele-btn-icon" type="primary" :disables="hasCategoryId"
                    @click="handleAdd(ruleIdList, ruleIdListIndex)">新增</el-button>
                </div>
              </header-title>
              <el-table :data="item.equipmentList" border>
                <el-table-column label="序号" type="index" width="50">
                </el-table-column>
                <el-table-column label="设备名称" align="center" prop="name">
                  <template slot-scope="{ row }">
                    <template>
                      {{ row.name }}
                    </template>
                  </template>
                </el-table-column>
                <el-table-column label="编号" align="center" prop="codeNumber">
                  <template slot-scope="{ row }">
                    <template>
                      {{ row.codeNumber }}
                    </template>
                  </template>
                </el-table-column>
                <el-table-column label="固资编码" align="center" prop="fixCode">
                  <template slot-scope="{ row }">
                    <template>
                      {{ row.fixCode }}
                    </template>
                  </template>
                </el-table-column>
                <el-table-column label="操作" width="100">
                  <template slot-scope="scope">
                    <el-button type="text" @click="deleteEquipment(scope.$index)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div class="ruleMatters_box">
              <header-title title="规则事项">
                <div>
                  <el-button size="small" icon="el-icon-plus" class="ele-btn-icon" type="primary"
                    @click="addPostscript">新增</el-button>
                </div>
              </header-title>
              <el-table :data="item.ruleItems" border>
                <el-table-column label="序号" width="50">
                  <template slot-scope="scope">
                    <span>{{ scope.$index + 1 }}</span>
                  </template>
                </el-table-column>
                <el-table-column label="零部件编码" prop="categoryCode" width="100">
                  <template slot-scope="scope">
                    <div v-if="scope.row.isNew">
                      <el-input v-model="scope.row.categoryCode" placeholder="请输入零部件编码"></el-input>
                    </div>
                    <div v-else>
                      <span>{{ scope.row.categoryCode }}</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="零部件名称" prop="categoryName" width="100">
                  <template slot-scope="scope">
                    <div v-if="scope.row.isNew">
                      <el-input v-model="scope.row.categoryName" placeholder="请输入零部件名称"></el-input>
                    </div>
                    <div v-else>
                      <span>{{ scope.row.categoryName }}</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="事项" prop="name" width="100">
                  <template slot-scope="scope">
                    <div v-if="scope.row.isNew">
                      <el-input v-model="scope.row.name" placeholder="请输入内容"></el-input>
                    </div>
                    <div v-else>
                      <span>{{ scope.row.name }}</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="内容" prop="content" width="200">
                  <template slot-scope="scope">
                    <div v-if="scope.row.isNew">
                      <el-input v-model="scope.row.content" placeholder="请输入内容"></el-input>
                    </div>
                    <div v-else>
                      <span>{{ scope.row.content }}</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="操作指导" prop="operationGuide">
                  <template slot-scope="scope">
                    <div class="operationGuide_box" @click="
                      openOperationGuideDialogDialog(
                        scope.row.operationGuide,
                        scope.$index,
                        scope.row.isNew
                      )
                      ">
                      <div class="left_content">
                        <template v-if="scope.row.operationGuide">
                          <div v-for="(item, index) in scope.row.operationGuide
                            .toolList" :key="item.id">{{ index + 1 }}.{{ item.name }}</div>
                        </template>
                      </div>
                      <div class="right_content">
                        <template v-if="scope.row.operationGuide">
                          <div v-for="(item, index) in scope.row.operationGuide
                            .procedureList" :key="item.id">{{ index + 1 }}.{{ item.content }}</div>
                        </template>
                      </div>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="标准" prop="norm" width="100">
                  <template slot-scope="scope">
                    <div v-if="scope.row.isNew">
                      <el-input v-model="scope.row.norm" placeholder="请输入内容"></el-input>
                    </div>
                    <div v-else>
                      <span>{{ scope.row.norm }}</span>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="操作" width="100">
                  <template slot-scope="scope">
                    <el-button v-if="scope.row.isNew" type="text" @click="deleteItem(scope.$index)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </el-form>
    <template v-slot:footer>
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="save"> 保存 </el-button>
    </template>
    <!-- 新增设备 -->
    <MaterialAdd ref="productRefs" @chooseEquipment="chooseEquipment">
    </MaterialAdd>
    <!--  -->
    <operation-guideDialog ref="operationGuideDialog" @save="saveEdit" />
    <!-- 添加规则 -->
    <ele-modal width="800px" :visible="addDialog" :append-to-body="true" title="规则配置" :close-on-click-modal="false"
      @update:visible="closeAdd" :maxable="true">
      <el-select v-model="ruleObj.ruleId" size="small" style="width: 100%" @change="handleRuleNameChange"
        :disabled="isBindPlan" filterable>
        <el-option v-for="item in ruleNameList" :key="item.id" :value="item.id" :label="item.code + '-' + item.name"
          @click.native="ruleChange(item)"></el-option>
      </el-select>
      <template v-slot:footer>
        <el-button @click="addDialog = false">取消</el-button>
        <el-button type="primary" @click="addRule"> 添加 </el-button>
      </template>
    </ele-modal>
  </ele-modal>
</template>

<script>
import { getDetail, getCode } from '@/api/ruleManagement/matter';
import {
  getRule,
  getCategory,
  getAssetList,
  saveOrUpdate,
  getInfoById
} from '@/api/ruleManagement/plan';
import { getUserPage } from '@/api/system/organization';
import { getTreeByType } from '@/api/classifyManage';
import MaterialAdd from './MaterialAdd.vue';
import OperationGuideDialog from '@/views/rulesManagement/matterRules/components/operationGuideDialog.vue';
import deptSelect from '@/components/CommomSelect/dept-select.vue';
import { pageList } from '@/api/technology/version/version.js';
import {
  bomDelete,
  saveBatch,
  bomTaskList,
  bomTaskDelete,
  getByTaskId
} from '@/api/material/BOM';
import { getteampage } from '@/api/workforceManagement/team';

import { getFile } from '@/api/system/file';
import { deepClone } from 'ele-admin/lib/utils/core';

export default {
  components: {
    MaterialAdd,
    deptSelect,
    OperationGuideDialog
  },
  props: {
    dialogTitle: {
      type: String,
      default: () => {
        return '新增巡检点计划配置';
      }
    },
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    const defaultForm = {
      id: null,
      code: '',
      name: '',
      modelType: '',
      brandNum: '',
      specification: '',
      measuringUnit: '',
      bomList: []
    };
    return {
      ruleIndex: 0, // 规则index
      ruleId: '',
      formLabel: '',
      isBindPlan: false,
      ruleObj: {
        ruleId: '',
        name: '',
        code: '',
        equipmentList: []
      },
      ruleIdList: [],
      addForm: {
        code: '', // 计划配置单号
        name: '', // 计划配置名称
        type: 0, // 默认个人
        autoOrder: 1, // 自动派单
        ruleId: '', // 规则id
        ruleName: '', // 规则名称
        duration: null, // 计划完成时长
        categoryId: '', // 设备类别id
        approvalUserId: '', // 审核人id
        groupId: '', // 巡点检部门code
        executeIdList: [], // 巡点检人员id
        executorPhone: '',
        status: 1, // 状态
        remark: '', // 备注
        urgent: '1',
        teamId: '', // 班组id
        executeUsers: [], // 执行人
      },
      ruleNameList: [], // 规则列表
      uerList: [], // 审核人列表
      executorList: [], // 业务人员列表
      defaultForm,
      // 表单数据
      form: {
        ...defaultForm
      },

      versionList: [],

      // 表单验证规则
      addFormRules: {
        name: [
          { required: true, message: '请输入计划配置名称', trigger: 'blur' }
        ],
        autoOrder: [
          { required: true, message: '请选择是否自动派单', trigger: 'change' }
        ],
        ruleId: [
          { required: true, message: '请选择规则名称', trigger: 'change' }
        ],
        duration: [
          { required: true, message: '请输入计划完成时长', trigger: 'blur' }
        ],
        categoryLevelId: [
          { required: true, message: '请选择设备分类', trigger: 'change' }
        ],
        categoryId: [
          { required: true, message: '请选择设备类别', trigger: 'change' }
        ],
        groupId: [
          { required: true, message: '请选择部门', trigger: 'change' }
        ],
        executeIdList: [
          { required: true, message: '请选择人员', trigger: 'change' }
        ],
        teamId: [
          { required: true, message: '请选择班组', trigger: 'change' }
        ],
        urgent: [
          { required: true, message: '请选择紧急程度', trigger: 'change' }
        ],
        type: [
          { required: true, message: '请选择', trigger: 'change' }
        ],
      },

      columns: [
        {
          type: 'index',
          width: 55,
          align: 'center'
        },
        {
          label: '子项编号',
          prop: 'subCode',
          action: 'subCode'
        },
        {
          label: '物料名称',
          prop: 'categoryName',
          action: 'categoryName'
        },

        {
          label: '是否回收料',
          prop: 'isReworkBom',
          action: 'isReworkBom',
          slot: 'isReworkBom',
          width: 95
        },

        {
          label: '物料编码',
          prop: 'categoryCode'
        },
        {
          label: '牌号',
          prop: 'brandNum'
        },
        {
          label: '型号',
          prop: 'modelType'
        },
        {
          label: '数量',
          prop: 'count'
        },
        {
          label: '计量单位',
          prop: 'unit'
        },

        {
          label: '附件',
          slot: 'bomArtFiles',
          action: 'bomArtFiles',
          minWidth: 100
        },

        {
          label: '单位',
          prop: 'weightUnit'
        },

        {
          label: '备注',
          prop: 'remark'
        }
      ],

      statusList: [
        { label: '草稿', value: -1 },
        { label: '失效', value: 0 },
        { label: '生效', value: 1 }
      ],

      // 提交状态
      loading: false,

      categoryId: null,

      current: null,

      materialShow: false,

      tabsList: [],
      tableData: [],

      taskId: null,

      addDialog: false,
      tabsValue: null,

      hasCategoryId:false,
      getByIdData:{},
      modelType: '',
      teamAllList: [],
    };
  },
  computed: {
    // 是否开启响应式布局
    styleResponsive() {
      return this.$store.state.theme.styleResponsive;
    },
    dispatchType() {
      return ((this.addForm.autoOrder && (this.modelType == 'add' || this.modelType == 'edit')) || (!this.addForm.autoOrder && this.modelType == 'dispatch'))
    }
  },
  watch: {
    visible(val) {
      if (val) {
        this.formLabel = this.dialogTitle.includes('巡点检')
          ? '巡点检'
          : this.dialogTitle.includes('运行记录')
            ? '运行记录'
            : this.dialogTitle.includes('保养')
              ? '保养'
              :  this.dialogTitle.includes('检修')
              ? '检修':'盘点';
        // 获取审核人列表数据
        this.getUserList();
        // 获取规则名称
        this._getRuleNameList();
      }
    }
  },
  mounted() {
    this.getAllTeamList();
    this.getUserList({groupId: "1"});
  },
  methods: {
    // 初始化
    async init(type, row, tips) {
      console.log(row);
      console.log(tips);
      this.modelType = type;
      if (row) {
        this.getInfo(row.id);
      } else {
        //  获取计划配置单号
        this.getOrderCode(tips);
        this.addForm = {
          code: '', // 计划配置单号
          name: '', // 计划配置名称
          autoOrder: 1, // 自动派单
          type: 0, // 默认个人
          ruleId: '', // 规则id
          ruleName: '', // 规则名称
          duration: null, // 计划完成时长
          categoryId: '', // 设备类别id
          approvalUserId: '', // 审核人id
          groupId: '', // 巡点检部门code
          executeIdList: [], // 巡点检人员id
          executorPhone: '',
          status: 1, // 状态
          remark: '', // 备注
          urgent: '1',
          teamId: '', // 班组id
          executeUsers: [], // 执行人
        };
        this.ruleIdList = [];
        this.isBindPlan = false;
        this.planRuleEquiList = [];
        //   this.matterRulesList = [];
      }
    },
    async getAllTeamList() {
      const { list } = await getteampage({
        pageNum: 1,
        size: -1
      });
      console.log('teamAllList 班组', list);
      this.teamAllList = list;
    },
    teamChange() {
      console.log('this.addForm.teamId', this.addForm.teamId);
      // 当前班组
      const currentTeam = this.teamAllList.find(
        (item) => item.id === this.addForm.teamId
      );
      if (currentTeam) {
        // 同步执行人
        this.addForm.executeUsers = [
          {
            teamId: currentTeam.id,
            teamName: currentTeam.name
          }
        ];
      }
    },
    typeChange(v) {
      console.log('typeChange', v, this.addForm.executeIdList);
      // this.addForm.groupId = '';
      // this.addForm.executeIdList = [];
      // this.addForm.teamId = '';
      // this.addForm.executeUsers = [];
      this.$set(this.addForm, 'executeUsers', []);
      if(v == 0) {
        this.$set(this.addForm, 'groupId', '');
        this.$set(this.addForm, 'executeIdList', []);
      } else {
        this.$set(this.addForm, 'teamId', '');
      }
      this.$forceUpdate();
    },
    ruleChange(item) {
      this.ruleObj.name = item.name;
      this.ruleObj.code = item.code;
    },
    save() {
      console.log(this.addForm);
      console.log(this.ruleIdList);
      if (this.ruleIdList && this.ruleIdList.length > 0) {
        this.$refs.addFormRef.validate(async (valid) => {
          console.log(valid);
          if (valid) {
            //   this.addForm.deviceInfo = selectList.map((item) => {
            //     return {
            //       substanceId: item.id,
            //       sparePart: item.sparePart ? item.sparePart : [],
            //       totalCost: item.totalCost
            //     };
            //   });
            this.addForm.executeId = this.addForm.executeIdList.join(',');
            this.addForm.ruleType = this.dialogTitle.includes('巡点检')
              ? 1
              : this.dialogTitle.includes('保养')
                ? 2
                : this.dialogTitle.includes('运行记录')
                  ? 5
                  :this.dialogTitle.includes('检修')
                  ?7:4;
            console.log(this.ruleIdList);
            this.addForm.isBindPlan = this.isBindPlan;
            let planConfigAddOrUpdatePOList = this.ruleIdList.map((item) => {
              return {
                id: item.id,
                ruleId: item.ruleId,
                ruleName: item.name,
                ruleCode: item.code,
                categoryId: item.categoryId,
                deviceInfo: item.equipmentList.map((item) => {
                  return {
                    // substanceId: this.dialogTitle.includes('新增')
                    //   ? item.position[0]?.substanceId
                    //   : item.id,
                    substanceId: item.id,
                    // 前端回显字段
                    id: item.id,
                    codeNumber: item.codeNumber,
                    name: item.name,
                    fixCode: item.fixCode,
                    categoryId: item.category.categoryLevelId,
                    categoryName: item.category.categoryLevelName
                  };
                }),
                ruleMatters: item.ruleItems
              };
            });
            const planConfigAddOrUpdatePOListIds = planConfigAddOrUpdatePOList.map(i=> i.id)
            console.log(planConfigAddOrUpdatePOList);
            let boolen = planConfigAddOrUpdatePOList.every(
              (item) => item.deviceInfo.length > 0
            );
            if (!boolen) {
              this.$message.error('请添加设备！');
              return false;
            }
            this.addForm.ruleName = this.ruleIdList
              .map((item) => item.name)
              .join(',');
            this.addForm.ruleCode = this.ruleIdList
              .map((item) => item.code)
              .join(',');
            this.addForm.planConfigAddOrUpdatePOList =
              planConfigAddOrUpdatePOList;
            this.addForm.ruleId = '0'; // 无效后台验证
            let sendMsg = deepClone(this.addForm);
            const type = this.dialogTitle.includes('新增') ? '新增' : '编辑';
            try {
              let res = await saveOrUpdate(sendMsg);
              if (res) {
                this.$message.success(type + '成功！');
                this.$emit('done');
              }
            } catch (error) {
              console.log(error);
              this.$message.error(type + '失败！');
            }
          }
        });
      } else {
        this.$message.error('请添加规则！');
      }
    },
    // 保存操作指导数据
    saveEdit(data, index) {
      console.log(this.matterRulesList);
      console.log(data);
      console.log(index);
      this.$set(
        this.ruleIdList[this.ruleIndex].ruleItems[index],
        'operationGuide',
        data
      );
    },
    /* 打开操作手册编辑款 */
    openOperationGuideDialogDialog(row, index, isNew) {
      console.log(isNew,'isNew');

      if (isNew) {
        this.$refs.operationGuideDialog.open(row, index);
      }
    },
    deleteEquipment(index) {
      this.ruleIdList[this.ruleIndex].equipmentList.splice(index, 1);
    },
    deleteItem(index) {
      this.ruleIdList[this.ruleIndex].ruleItems.splice(index, 1);
    },
    addPostscript() {
      // console.log(
      //   'this.matterRulesList---------------',
      //   this.matterRulesList
      // );
      this.ruleIdList[this.ruleIndex].ruleItems.push({
        sort: null,
        name: '',
        content: '',
        norm: '',
        isNew: true,
        operationGuide: {
          procedureList: [],
          toolList: []
        }
      });
      console.log(this.ruleIdList,'225')
    },
    async getInfo(id) {
      console.log(id);
      try {
        const res = await getInfoById(id);
        console.log('res----------', res);
        // this.addForm = res;
        
        this.isBindPlan = res.isBindPlan;
        this.categoryEquipment(res.categoryLevelId);
        this.ruleIdList = res.planConfigVOList.map((item) => {
          return {
            id: item.id,
            ruleId: item.ruleId,
            name: item.ruleName,
            code: item.ruleCode,
            categoryId: item.categoryId,
            equipmentList: item.deviceInfo.map((item) => {
              return {
                name: item.name,
                id: item.id,
                fixCode: item.fixCode,
                codeNumber: item.codeNumber,
                category: {
                  categoryLevelId: item.categoryId,
                  categoryLevelName: item.categoryName
                }
              };
            }),
            ruleItems: item.ruleMatters
          };
        });

        // 处理回显数据
        if (res.type === 0) {
          // 个人
          res.executeIdList = res.executeUsers.map(
            (item) => item.userId
          );

          let groupIds = res.executeUsers
            .map((i) => i.groupId)
            .filter((i) => i);
          groupIds = Array.from(new Set(groupIds));

          if (groupIds.includes('1')) {
            // 包含全部部门，置空
            res.groupId = '1';
          } else {
            res.groupId = res.executeUsers?.[0]?.groupId || '1';
          }

          // this.addForm.teamId = ''
          // this.$set(this.addForm, 'teamId', '');

          groupIds.map((item) => {
            this.searchDeptNodeClick(item);
          });
        } else {
          // 班组
          res.teamId = res.executeUsers?.[0]?.teamId || '';
          // this.$set(this.addForm, 'groupId', '');
          // this.$set(this.addForm, 'executeIdList', []);
          // this.addForm.groupId = ''
          // this.addForm.executeIdList = []
        }
        this.tabsValue = this.ruleIdList[0].ruleId;
        if (res.groupId) {
          const params = { groupId: res.groupId };
          this.getUserList(params);
        }
        this.$set(this, 'addForm', res)
        // this._getMatterRulesDetails(res.ruleId);
        this.$set(this.addForm, 'code', res.code);
        this.$set(this.addForm, 'urgent', JSON.stringify(res.urgent));
        // this.$set(this.addForm, 'executeIdList', res.executeId.split(','));
        this.$set(this.addForm, 'imageUrl', {});
        // console.log(this.rootData);
        const rep = await getTreeByType(0);
        console.log('sasas', res);
        const ids = this.findTopLevelAncestorId(
          rep.data,
          res.categoryLevelId
        );
        this.rootId = ids;
        //   await this._getEquipmentList(res.categoryLevelId, this.isBindPlan);
        let keys = [];
        res.deviceInfo.map((item) => {
          keys.push(item.substanceId);
        });
        this.$nextTick(() => {
          this.$refs.equiListTree.setCheckedKeys(keys);
        });
        this.clickedTreeNode = true;
      } catch (error) { }
    },
    // 获取设备分类数据
    async categoryEquipment(id) {
      const params = { categoryLevelId: id, pageNum: 1, size: -1 };
      console.log('params==', params);
      const data = await getCategory(params);
      console.log(data);
      this.equipmentList = data.list;
    },
    // 选择设备
    chooseEquipment(data, index, categoryId) {
      this.$set(
        this.ruleIdList[index],
        'equipmentList',
        this.ruleIdList[index].equipmentList.concat(data)
      );
      this.$set(this.ruleIdList[index], 'categoryId', categoryId);
      console.log(this.ruleIdList);
    },
    // 获取计划配置单号
    async getOrderCode(tips) {
      if (tips.includes('巡点检')) {
        const data = await getCode('patrolconfig_code');
        this.$set(this.addForm, 'code', data);
      }
      if (tips.includes('保养')) {
        const code = await getCode('maintainconfig_code');
        this.$set(this.addForm, 'code', code);
      }
      if (tips.includes('量具送检')) {
        const code = await getCode('quantity_code');
        this.$set(this.addForm, 'code', code);
      }
      if (tips.includes('运行记录')) {
        const code = await getCode('runRecord_code');
        this.$set(this.addForm, 'code', code);
      }
      if (tips.includes('检修')) {
        const code = await getCode('service_code');
        this.$set(this.addForm, 'code', code);
      }
    },
    //选择部门(搜索)
    async searchDeptNodeClick(info, data) {
      console.log('searchDeptNodeClick', info, data);
      if (info) {
        // 根据部门获取人员
        // this.addForm.groupName = data.name;
        const params = { groupId: info };
        await this.getUserList(params);
        // if (this.addForm.type == 1) {
        //   this.addForm.executeIdList = this.executorList.map(
        //     (item) => item.id
        //   );
        // }
      } else {
        this.addForm.groupId = null;
      }
    },
    // 负责人变更 同步执行人列表
    executeIdListChange(v) {
      console.log('executeIdListChange', v);
      this.addForm.executeUsers = this.addForm.executeIdList.map((userId) => {
        const user = this.executorList.find((u) => u.id === userId);
        return {
          userId: user.id,
          userName: user.name,

          groupId: user.groupId,
          groupName: user.groupName
        };
      });
      console.log('this.addForm.executeUsers', this.addForm.executeUsers);
    },
    // 过滤计划完成时长
    formDataDurationTime(value) {
      if (value > 0) {
        this.addForm.duration = value.replace(/^[0]+/, '');
      } else {
        this.addForm.duration = 0;
      }
    },
    // 获取审核人列表、巡点检人员
    async getUserList(params) {
      try {
        let data = { pageNum: 1, size: -1 };
        // 如果传了参数就是获取巡点检人员数据
        if (params) {
          data = Object.assign(data, params);
        }
        const res = await getUserPage(data);
        console.log('res------------', res);
        if (params) {
          this.executorList = res.list;
        } else {
          this.uerList = res.list;
        }
      } catch (error) { }
    },
    // 获取规则名列表
    async _getRuleNameList() {
      const typeMap = {
        '新增巡点检计划配置': 1,
        '编辑巡点检计划配置': 1,
        '新增保养计划配置': 2,
        '编辑保养计划配置': 2,
        '新增量具送检计划配置': 5,
        '编辑量具送检计划配置': 5,
        '新增运行记录配置': 6,
        '编辑运行记录配置': 6,
        '新增检修配置': 7,
        '编辑检修配置': 7
      };

      const ruleType = typeMap[this.dialogTitle];
      if (ruleType) {
        const res = await getRule({
          status: 1,
          type: ruleType,
          pageNum: 1,
          size: -1
        });
        console.log(res, 'resresresresres')
        this.ruleNameList = res?.list || [];
      }
    },
    downloadFile(file) {
      getFile({ objectName: file.storePath }, file.name);
    },

    openEdit(index) {
      this.current = this.form.bomList[index];
      console.log(this.current);
      this.materialShow = true;
    },

    /* 表格数据源 */
    datasource({ page, limit, where }) {
      return [];
    },

    async getVersionList() {
      const res = await pageList({
        pageNum: 1,
        size: 100
      });

      this.versionList = res.list;
    },

    handleAdd(ruleIdList, ruleIdListIndex) {
      this.$refs.productRefs.open(ruleIdList, ruleIdListIndex);
    },

    /* 更新visible */
    updateVisible(value) {
      this.$emit('update:visible', value);
    },

    async getCategoryBomFn(taskId) {
      const res = await getByTaskId(this.categoryId, taskId);
      this.form.bomList = res;
    },

    remove(row) {
      bomDelete([row.id])
        .then((message) => {
          this.$message.success(message);
          this.getCategoryBomFn();
        })
        .catch((e) => {
          this.$message.error(e.message);
        });
    },

    done(taskId) {
      this.materialShow = false;
      this.getCategoryBomFn(taskId);
    },

    handleAddTab() {
      this.tableData = this.tabsList;
      this.addDialog = true;
    },

    handleTab(e) {
      this.ruleIndex = e.index;
      // this.ruleIdList[e.index].ruleItems = this._getMatterRulesDetails(this.ruleId)
    },

    removeTab(targetRuleId) {
      this.$confirm('是否删除当前规则?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          console.log('targetName', targetRuleId);
          console.log('this.ruleIdList', this.ruleIdList)

          this.ruleIdList = this.ruleIdList.filter(
            (item) => item.ruleId != targetRuleId
          );

          console.log('this.ruleIdList', this.ruleIdList)

          this.$nextTick(() => {
            if (this.ruleIdList.length == 1) {
              this.tabsValue = this.ruleIdList[0].ruleId;
            }
          });

        })
        .catch(() => { });
    },

    /*关闭选择参数*/
    closeAdd() {
      this.addDialog = false;
    },
    // 规则名称下拉触发
    handleRuleNameChange(val) {
      this.ruleId = val;
      console.log('val----', val);
      this.getRulesDetails(val);
    },
    async getRulesDetails(val) {
      const res = await getDetail(val);
      console.log('res------', res);
      this.getByIdData=res;
      this.hasCategoryId = res?.categoryId;
    },
    // 封装 - 获取规则下面的详情数据及事项
    async _getMatterRulesDetails(val) {
      const res = await getDetail(val);
      return res.ruleItems;
      // console.log('res------', res);
      // this.matterRulesList = res.ruleItems;
    },

    async addRule() {
      console.log(this.ruleIdList);
      console.log(this.ruleId);
      let boolen = this.ruleIdList.every((item) => {
        return this.ruleId != item.ruleId;
      });
      if (boolen) {
        console.log(this.ruleNameList);
        this.ruleObj.ruleItems = await this._getMatterRulesDetails(
          this.ruleId
        );

        for (let i = 0; i < this.ruleObj.ruleItems.length; i++) {
          const id = this.getByIdData?.categoryId;
          const name = this.getByIdData?.categoryName;

          this.ruleObj.ruleItems[i].categoryId = id;
          this.ruleObj.ruleItems[i].categoryName = name;

          this.ruleObj.ruleItems[i].isNew=true;
        }

        this.ruleIdList.push(deepClone(this.ruleObj));
        console.log('this.ruleIdList--------', this.ruleIdList);
        this.addDialog = false;
        this.$nextTick(() => {
          if (this.ruleIdList.length == 1) {
            this.tabsValue = this.ruleIdList[0].ruleId;
          }
        });
      } else {
        this.$message.error('请误重复添加规则');
      }
    },

    // 保存
    saveBatchFn() {
      let arr = [];
      arr = this.tabsList.map((m) => {
        return {
          taskId: m.id,
          sort: m.sort,
          categoryId: this.categoryId
        };
      });

      saveBatch(arr).then((res) => {
        this.taskListHead();
      });
    },

    taskListHead(isFirst) {
      console.log(isFirst);
      bomTaskList(this.categoryId).then((res) => {
        let arr = [];
        arr = res.map((m) => {
          return {
            oldId: m.id,
            sourceTaskId: m.id,
            id: m.taskId,
            name: m.taskName
          };
        });
        this.tabsList = arr;

        if (isFirst && this.tabsList.length > 0) {
          this.tabsValue = this.tabsList[0].id;
          this.getCategoryBomFn(this.tabsList[0].id);
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
::v-deep .el-row {
  display: flex;
  flex-wrap: wrap;
}

::v-deep .el-tab_box {
  display: flex;
  margin-top: 10px;
  height: 300px;
  width: 100%;

  .equipmentList_box {
    flex: 1;
    height: 100%;
    margin-right: 10px;
    display: flex;
    flex-direction: column;

    .divider {
      flex: 0 0 50px;

      .title {
        height: 35px;
      }
    }

    .el-table {
      overflow: auto;
    }
  }

  .ruleMatters_box {
    flex: 3;
    height: 100%;
    display: flex;
    flex-direction: column;

    .divider {
      flex: 0 0 50px;

      .title {
        height: 35px;
      }
    }

    .el-table {
      overflow: auto;

      .operationGuide_box {
        width: 100%;
        height: 50px;
        display: flex;
        overflow: hidden;
        cursor: pointer;

        .left_content {
          flex: 0 0 200px;
          padding: 10px;
          box-sizing: border-box;
          border: 1px solid #c0c4cc;
          border-radius: 10px;
          margin-right: 10px;
          overflow-y: auto;
        }

        .right_content {
          flex: 1;
          padding: 10px;
          box-sizing: border-box;
          border: 1px solid #c0c4cc;
          border-radius: 10px;
          overflow-y: auto;
        }
      }
    }

    .el-table::before {
      display: none;
    }
  }
}
</style>