修改新增

祖安之光

9 天以前 d85d9ae08781a5b0d9b7f854460d3f07d043595a

 src/views/build/conpanyFunctionConsult/orgStructure/dutyDistributeChart/index.vue

@@ -27,7 +27,7 @@
      </el-form>
    </div>
    <div style="display: flex;justify-content: space-between;margin-bottom: 10px">
      <div>质量管理体系过程与部门职能矩阵</div>
      <div>质量管理体系过程与部门职能矩阵（▲ 主管部门<span style="font-size: 24px;display: inline-block;margin-left: 20px">●</span> 归口部门<span style="font-size: 24px;display: inline-block;margin-left: 20px">○</span> 配合部门）</div>
      <div>
        <el-button type="primary" @click="initDistribute">重新生成</el-button>
        <el-button type="primary" v-if="!isEdit" @click="isEdit = true">编辑</el-button>
@@ -35,6 +35,7 @@
      </div>
    </div>
    <!-- 表格数据 -->
    <el-form ref="noticeRef" :model="remarkForm" :rules="rules">
    <el-table v-loading="loading" :data="caluseList" class="caluseTable" :border="true" :span-method="arraySpanMethod">
      <el-table-column label="条款号" prop="clauseNum" align="center"/>
      <el-table-column label="条款内容/要素" prop="content" align="left"/>
@@ -50,10 +51,47 @@
<!--      </el-table-column>-->
      <el-table-column v-for="column in deptList" :key="column.deptId" :prop="column.deptId" :label="column.deptName" align="center">
        <template #default="scope">
          <el-checkbox v-model="scope.row[column.deptId]" :disabled="!isEdit" size="large" @change="changeStatus(scope.row)"/>
          <el-checkbox v-if="isEdit" v-model="scope.row[column.deptId]" size="large" @change="changeStatus(scope.row,scope.$index)"/>
          <div v-else>
            <el-checkbox v-if="column.deptType == '0'" v-model="scope.row[column.deptId]" disabled size="large"/>
            <div class="markBox" v-else>
              <div class="triangle" v-show="scope.row[column.deptId]"></div>
              <el-checkbox v-show="!scope.row[column.deptId]" v-model="scope.row[column.deptId]" disabled size="large"/>
            </div>
          </div>
        </template>
      </el-table-column>

      <el-table-column label="备注" prop="remark" align="center" width="170px" fixed="right">
        <template #default="scope">
          <div v-if="!mergeValues.includes(scope.row.clauseNum)">
            <el-form-item v-if="isEdit && getRowValueNum(scope.row) >= 2" :prop="`tableData.${scope.$index}.remark`" :rules="getRowValueNum(scope.row) >= 2 ? rules.remark : []">
              <el-input
                  v-model.trim="remarkForm.tableData[scope.$index].remark"
                  size="large"
                  type="textarea"
                  style="width: 100%;"
              >
              </el-input>
            </el-form-item>

            <span v-else>{{ remarkForm.tableData[scope.$index].remark }}</span>
          </div>
        </template>
      </el-table-column>

    </el-table>
    </el-form>
<!--    <el-dialog-->
<!--        v-model="dialogVisible"-->
<!--        title="备注"-->
<!--        width="700px"-->
<!--        :before-close="handleClose"-->
<!--    >-->
<!--      <el-form :model="remarkList" size="default" ref="superRef" :rules="formRules" label-width="150px">-->
<!--        <el-form-item label="企业：" prop="companyId"></el-form-item>-->
<!--      </el-form>-->
<!--    </el-dialog>-->
  </div>
</template>

@@ -65,7 +103,7 @@
import {
  getCompany,
  getDepart,
  getDistribution,
  getDistribution, getFunctionalRemarkList,
  getSysClause,
  initDistribution,
  saveDistribution
@@ -83,15 +121,27 @@
  isEdit: false,
  dataList: [],
  deptList: [],
  subDepts: [],
  caluseList: [],
  remarkForm: {},
  form: {
    companyId: null,
    list: []
  }
    list: [],
    remarks: []
  },
  originRemark: [],
  remarkList: [],
  dialogVisible: false,
  rules: {
    remark: [
      {required: true, message: "有两个归口部门请填写备注", trigger: "blur"},
    ],
  },
  mergeValues: ['4','5','6','7','7.1','8','8.2','8.3','8.4','8.5','9','9.1','10']
});

const { queryParams,isEdit, dataList,deptList, isAdmin, companyList, caluseList, form } = toRefs(data);

const { queryParams,isEdit, dataList,deptList, isAdmin, companyList, caluseList, form,originRemark, remarkList,dialogVisible,mergeValues,remarkForm,rules } = toRefs(data);
const noticeRef = ref();
onMounted(async ()=>{
  await getSysClauseList()
  if(userStore.roles.includes('admin')){
@@ -109,6 +159,23 @@

})


// 获取非管理层选中数量
const getRowValueNum = (row)=>{
  let count = 0;
  for (const key in row) {
    // 检查键是否是数字（忽略非数字键）
    if (!isNaN(key)) {
      const numericKey = parseInt(key, 10);
      // 检查数字键是否在subDepts中且值为true
      if (data.subDepts.includes(numericKey) && row[key] === true) {
        count++;
      }
    }
  }
  return count;
}

const getSysClauseList = async ()=> {
  const res = await getSysClause()
  if(res.code == 200){
@@ -123,9 +190,26 @@
  }
}

const changeStatus = (val)=>{
const getRemarksList = async ()=> {
  const res = await getFunctionalRemarkList({companyId: data.queryParams.companyId})
  if(res.code == 200){
    data.originRemark = res.data
    for(let item of data.originRemark){
      const foundObj = data.caluseList.find(i=>i.clauseNum == item.clauseNum)
      if(foundObj){
        foundObj.remark = item.remark
      }
    }
  }else{
    ElMessage.warning(res.message)
  }
}

const changeStatus = (val,index)=>{
  if(getRowValueNum(val)<2){
    data.remarkForm.tableData[index].remark = ''
  }
  const excludeFields = ['clauseNum', 'content', 'manage', 'represent']
  // 转换当前对象为临时数组
  const currentList = Object.keys(val).filter(key => !excludeFields.includes(key)).map(key => ({
        clauseNum: val.clauseNum,
        deptId: Number(key),
@@ -147,12 +231,21 @@
}

const confirmEdit = async ()=>{
  if(data.form.list.length == 0){
  const valid = await noticeRef.value.validate()
  if(valid){
    loading.value = true
    data.form.remarks = data.remarkForm.tableData.filter(i=>i.remark && i.remark !== '').map(i=>{
      return {
        companyId: data.queryParams.companyId,
        clauseNum: i.clauseNum,
        remark: i.remark
      }
    })
    if(data.form.list.length == 0  && data.form.remarks.length == 0){
    data.isEdit = !data.isEdit
    await getList()
    return
  }
  loading.value = true
  data.form.companyId = data.queryParams.companyId
  const res = await saveDistribution(data.form)
  if(res.code == 200){
@@ -163,6 +256,9 @@
  loading.value = false
  await getList()
  data.isEdit = !data.isEdit
  }else{
    ElMessage.warning('条款有两个归口部门，要填写备注')
  }
}

const arraySpanMethod = ({
@@ -171,12 +267,15 @@
     rowIndex,
     columnIndex,
   }) => {
  const mergeValues = ['4','5','6','7','7.1','8','8.2','8.3','8.4','8.5','9','9.1','10']
  if (mergeValues.includes(row.clauseNum)) {
  if (data.mergeValues.includes(row.clauseNum)) {
    const totalColumns = data.deptList.length + 3
    if (columnIndex === 0) {
      return [1, 1]
    } else if(columnIndex === 1){
      return [1,900]
      return [1, Math.max(1, totalColumns - 2)];
    }
    if (columnIndex < totalColumns - 1) {
      return [0, 0];
    }
  }
}
@@ -194,16 +293,22 @@
      const sameNum = data.dataList.filter(i=>i.clauseNum == item.clauseNum).map(j=> {
          return {
            deptId: j.deptId,
            chooseLab: j.chooseLab
            chooseLab: j.chooseLab,
            remark: j.remark
          }
        }
      )
      for(let i of sameNum){
        item[i.deptId] = i.chooseLab == 0?false:true
        item.remark = i.remark
      }
    }
    await getRemarksList()
  }else{
    ElMessage.warning(res.message)
  }
  data.remarkForm = {
    tableData: JSON.parse(JSON.stringify(data.caluseList))
  }
  loading.value = false
}
@@ -213,6 +318,7 @@
  const res = await getDepart({responsType: 1, companyId: data.queryParams.companyId})
  if(res.code == 200){
    data.deptList = res.data
    data.subDepts = data.deptList.filter(i=>i.deptType == '0').map(i=>i.deptId)
  }else{
    ElMessage.warning(res.message)
  }
@@ -232,6 +338,10 @@
  } else {
    ElMessage.warning(res.message)
  }
}

const handleClose = ()=>{

}

const initDistribute = async ()=>{
@@ -319,6 +429,19 @@
  }
  .cell{
    padding: 0 4px !important;

    .markBox{
      width: 100%;
      display: flex;
      justify-content: center;
      .triangle{
        width: 18px;
        height: 16px; /* 高度 = 100 * (√3/2) */
        background-color: #333;
        clip-path: polygon(0% 100%, 50% 0%, 100% 100%);
      }
    }

  }
}
</style>