eta_front/src/views/dataEntry_manage/sharedComponents/batchSetPublicDia.vue

<template>
<div>
  <el-dialog
		:visible.sync="show"
		:close-on-click-modal="false"
		:modal-append-to-body="false"
		@close="handleClose"
		custom-class="set-shared-dialog"
		center
		top="2vh"
    width="1200px"
		v-dialogDrag
    title="批量设置公开"
	>
    <div class="wrap">
      <el-table 
        :data="tableData" 
        border
        height="50vh"
        ref="addTableRef"
      >

        <el-table-column :label="source==='edb'?'指标名称':'图表名称'" align="center">
            <template slot-scope="{row}">{{row.Name}}</template>
        </el-table-column>
        <el-table-column align="center" width="350px">
            <template slot="header" slot-scope="scope">
                <el-radio-group 
                  v-model="classifyType"
                >
                    <el-radio :label="0">{{ $t('EtaBasePage.subdirectory_radio') }}</el-radio>
                    <el-radio :label="1">{{ $t('EtaBasePage.directory_radio') }}</el-radio>
                </el-radio-group>
                <el-cascader
                  v-model="selectClassify"
                  :options="classifyOption"
                  :props="{	
                    label: 'ClassifyName',
                    value: 'ClassifyId',
                    children: 'Children',
                    checkStrictly: true,
                    emitPath:false
                  }"
                  :placeholder="$t('Edb.InputHolderAll.input_menu')"
                  v-if="classifyType === 1"
                  @change="handleClassifyAllChange(row)"
                  class="header-cascader"
                />
            </template>
            <template slot-scope="{row}">
                  <el-cascader
                    v-model="row.PublicClassifyId"
                    :options="classifyOption"
                    :props="{	
                      label: 'ClassifyName',
                      value: 'ClassifyId',
                      children: 'Children',
                      checkStrictly: true,
                      emitPath:false
                    }"
                    :placeholder="$t('Edb.InputHolderAll.input_menu')"
                    :disabled="(classifyType===1)"
                    size="small"
                  />
            </template>
        </el-table-column>
      </el-table>
      <div class="reason-wrapper" v-if="isNeedPublicApprove">
        <label class="el-form-item__label">公开理由</label>
         <el-input
            type="textarea"
            :rows="5"
            placeholder="请输入公开理由"
            v-model="reason"
            style="width:500px"
          />
      </div>
    </div>
    <div class="dia-bot">
      <el-button type="primary" plain @click="handleClose">取消</el-button>
      <el-button type="primary" @click="handleConfirm">确定</el-button>
    </div>
  </el-dialog>

</div>
</template>
<script>
import { edbBaseV2Interface } from '@/api/modules/chartApi';
export default {
  props: {
    show: {
      type: Boolean
    },
    source: { //指标或图库
      type: String,
      default: 'edb'
    },
    checkedParams: {
      type: Object
    }
  },
  watch: {
    show(nval) {
      if(!nval) return

      this.getList()
      this.getApproveAuth()
      this.getClassifyOpts()
    }
  },
  data() {
    return {
      reason:'',
      tableData:[],
      classifyOption: [],
      classifyType:0,//目录方式
      selectClassify: 0,//选择的分类

      isNeedPublicApprove: true,//是否需要公开走审批
    }
  },
  methods:{
    handleClose() {
      this.tableData = [];
      this.reason = '';
      this.isNeedPublicApprove = true;
      this.classifyType = 0;//目录方式
      this.selectClassify = 0;//选择的分类
      this.$emit('update:show',false);
    },

    async handleConfirm() {
      const res = this.source === 'edb'
        ? await edbBaseV2Interface.setEdbPublic({
            EdbInfoList: this.tableData.map(_ => ({
              EdbInfoId: _.EdbInfoId,
              ClassifyId: _.PublicClassifyId
            })),
            Description: this.reason
          })
        : null

      if(res.Ret !== 200) return
      this.$message.success(this.isNeedPublicApprove?'已提交申请,请等待审批':'设置成功')

      this.handleClose()
      this.$emit('confirm')
    },


    handleClassifyAllChange(e){
      this.tableData.forEach(item=>{
        item.PublicClassifyId = this.selectClassify;
      })
    },

    async getList() {
      const res = this.source === 'edb'
        ? await edbBaseV2Interface.getPublicSearchListAll({
            ...this.checkedParams
          })
        : null

      if(res.Ret !== 200) return
      this.tableData = res.Data.List && res.Data.List.map(_ =>({
        ..._,
        PublicClassifyId: 0,
        Name: this.source==='edb' ? _.EdbName : _.ChartName
      }));
    },

    //获取是否需要审批
    async getApproveAuth() {
      const res = await edbBaseV2Interface.getSetPublicApprove({
        DataType: this.source==='edb'?1:2
      })

      if(res.Ret !== 200) return
      this.isNeedPublicApprove = res.Data;
    },

    //公开目录
    async getClassifyOpts() {
      const res = this.source === 'edb'
        ? await edbBaseV2Interface.getPublicClassifyBase()
        : null

      if(res.Ret!==200) return 

      this.classifyOption = res.Data.AllNodes || [];
      this.filterNodes(this.classifyOption)
    },

    filterNodes(arr) {
      arr.length && arr.forEach(item => {
        item.Children && item.Children.length && this.filterNodes(item.Children)
        if(!item.Children.length) {
          delete item.Children
        }
      })
    },

  },
}
</script>
<style scoped lang='scss'>
.reason-wrapper {
  display: flex;
  margin: 20px 0;
}
.header-cascader {
  width: 160px;
}
.cascader-wrapper {
  width: 340px;
}
.dia-bot {
  margin: 30px 0;
  display: flex;
  justify-content: center;
  gap: 20px;
  .el-button {
    width: 120px;
  }
}
</style>