irc_web/src/views/dictionary/template/components/CriterionDictionary.vue

<template>
  <div>
    <div class="search-form" style="display:flex;justify-content: space-between;">
      <div>
      </div>
      <div>
        <!-- 配置 -->
        <el-button size="mini" type="primary" :disabled="isCompleteConfig" @click="handleAdd"
          style="margin-right: 10px;">
          {{ $t('dictionary:template:criterionDictionary:button:config') }}
        </el-button>
      </div>
    </div>
    <el-table v-loading="loading" style="width: 100%" :data="list" stripe>
      <!-- 序号 -->
      <el-table-column prop="" label="" width="50">
        <template slot-scope="scope">
          {{ scope.$index + 1 }}
        </template>
      </el-table-column>
      <!-- 字典表名 -->
      <el-table-column prop="Code" :label="$t('dictionary:template:criterionDictionary:table:code')"
        show-overflow-tooltip>
      </el-table-column>
      <!-- 描述 -->
      <el-table-column prop="Description" :label="$t('dictionary:template:criterionDictionary:table:description')"
        show-overflow-tooltip>
      </el-table-column>
      <!-- 子项数量 -->
      <el-table-column prop="Count" :label="$t('dictionary:template:criterionDictionary:table:count')"
        show-overflow-tooltip>
      </el-table-column>
      <!-- 排序 -->
      <el-table-column prop="ShowOrder" :label="$t('dictionary:template:criterionDictionary:table:showOrder')"
        show-overflow-tooltip>
      </el-table-column>
      <!-- 操作 -->
      <el-table-column prop="Description" :label="$t('common:action:action')" show-overflow-tooltip>
        <template slot-scope="scope">
          <!-- 配置 -->
          <el-button type="text" @click="openChildren(scope.row)">
            {{ $t('dictionary:template:criterionDictionary:button:config') }}
          </el-button>
          <!-- 删除 -->
          <el-button type="text" :disabled="isCompleteConfig" @click="handleDelete(scope.row)">
            {{ $t('common:button:delete') }}
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-drawer :title="drawer_cfg.title" :append-to-body="true" :modal-append-to-body="false"
      :visible.sync="drawer_cfg.drawerChild" direction="rtl" size="80%">
      <CriterionDictionaryConfig v-if="drawer_cfg.drawerChild" @getList="getList" :isCompleteConfig="isCompleteConfig"
        :criterionId="criterionId" :parentCode="drawer_cfg.title"></CriterionDictionaryConfig>
    </el-drawer>
    <el-drawer :title="drawer_cfg2.title" :append-to-body="true" :modal-append-to-body="false"
      :visible.sync="drawer_cfg2.drawerChild" direction="rtl" size="80%">
      <div style="text-align: right;">
        <el-button size="mini" type="primary" @click="handleSave" v-loading="loading">
          {{ $t('common:button:save') }}
        </el-button>
      </div>
      <el-table v-loading="loading" v-adaptive="{ bottomOffset: 0 }" height="100" ref="multipleTable" style="width: 100%"
        :data="dicList" stripe @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55">
        </el-table-column>
        <el-table-column width="55">
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <!-- 字典表名 -->
        <el-table-column prop="Code" :label="$t('dictionary:template:criterionDictionary:table:code')"
          show-overflow-tooltip>
        </el-table-column>
        <!-- 描述 -->
        <el-table-column prop="Description" :label="$t('dictionary:template:criterionDictionary:table:description')"
          show-overflow-tooltip>
        </el-table-column>
        <!-- 排序 -->
        <el-table-column prop="ShowOrder" :label="$t('dictionary:template:criterionDictionary:table:showOrder')"
          show-overflow-tooltip>
        </el-table-column>
      </el-table>
    </el-drawer>
  </div>
</template>

<script>
import { getAssessType, setAssessType, getCriterionDictionaryList, getBasicConfigSelect, addSystemCriterionDictionaryCode, deleteSystemCriterionDictionary } from '@/api/dictionary'
import CriterionDictionaryConfig from './CriterionDictionaryConfig'
export default {
  props: {
    criterionId: {
      type: String,
      required: true
    },
    isCompleteConfig: {
      type: Boolean,
      required: true
    }
  },
  components: {
    CriterionDictionaryConfig
  },
  data() {
    return {
      list: [],
      total: 0,
      loading: false,
      rowData: {},
      activeName: '0',
      addOrEdit: { visible: false, title: '' },
      config: { visible: false, title: '全局配置' },
      drawer_cfg: { drawerChild: false, parentId: '', title: '' },
      drawer_cfg2: { drawerChild: false, parentId: '', title: '' },
      selectedList: [],
      dicList: []
    }
  },
  mounted() {
    this.getList()
    this.getBasicConfigSelect()
  },
  methods: {
    getBasicConfigSelect() {
      getBasicConfigSelect('Reading_eCRF_Criterion').then(res => {
        this.dicList = res.Result
      })
    },
    openChildren(row) {
      this.drawer_cfg = { drawerChild: true, title: row.Code, parent: row }
    },
    toggleSelection(rows) {
      console.log(this.$refs.multipleTable)
      this.$refs.multipleTable.clearSelection();
      if (rows) {
        rows.forEach(row => {
          this.$refs.multipleTable.toggleRowSelection(row);
        });
      } else {

      }
    },
    handleSelectionChange(val) {
      this.selectedList = val
    },
    getList() {
      this.loading = true
      getCriterionDictionaryList({
        CriterionId: this.criterionId,
        SystemCriterionId: this.criterionId
      }).then(res => {
        this.loading = false
        this.list = res.Result
      })
    },
    handleAdd() {
      // 选择标准字典
      this.drawer_cfg2 = { drawerChild: true, title: this.$t('template:criterionDictionary:title:selectDictionary') }
      this.config.visible = true
      this.$nextTick(() => {
        var a = this.dicList.filter(v => {
          return !!this.list.find(v1 => {
            return v1.Code === v.Code
          })
        })
        console.log(a)
        this.toggleSelection(a)
      })
    },
    handleSave() {
      this.loading = true
      var params = {
        SystemCriterionId: this.criterionId,
        CodeList: this.selectedList.map(v => v.Code) ? this.selectedList.map(v => v.Code) : null,
      }
      addSystemCriterionDictionaryCode(params).then(res => {
        this.$message.success(this.$t('common:message:savedSuccessfully'))
        this.drawer_cfg2.drawerChild = false
        this.loading = false
        this.getList()
      })
      // setAssessType(params).then(res => {
      //   this.loading = false
      //   this.$message.success(this.$t('common:message:savedSuccessfully'))
      //   this.config.visible = false
      //   this.selectedList = []
      //   this.getList()
      // }).catch(() => {
      // })
    },
    handleDelete(row) {
      this.loading = true
      // 是否确认删除
      this.$confirm(this.$t('template:criterionDictionary:message:msg1')).then(() => {
        deleteSystemCriterionDictionary({ Id: row.Id }).then(res => {
          this.$message.success(this.$t('common:message:deletedSuccessfully'))
          this.loading = false
          this.getList()
        }).catch(() => { this.loading = false })
      })

    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-form-item__content {
  width: calc(100% - 110px);
}
</style>