Source/UBCS-WEB/src/views/modeling/original.vue

@@ -2,24 +2,42 @@
  <el-container>
    <el-main>
      <basic-container>
        <avue-crud v-model="form" ref="crud" :option="option" :data="data" @on-load="onLoad" :page.sync="page"
          @refresh-change="refreshChange" @row-click="rowClick">
        <avue-crud ref="crud" v-model="form" :data="data" :option="option" :page.sync="page"
                   :permission="permissionList"
                   style="height: calc(100vh - 148px)"
                   @on-load="onLoad" @refresh-change="refreshChange" @row-click="rowClick">
          <template slot="radio" slot-scope="{row}">
            <el-radio v-model="selectRow" :label="row.$index">&nbsp;
            </el-radio>
          </template>
          <template slot="menu" slot-scope="{row,index}">
            <el-button icon="el-icon-edit" size="small" type="text" @click="updateSave(row,index)">编辑</el-button>
            <el-button icon="el-icon-delete" size="small" type="text" @click="deleteSave(row,index)">删除</el-button>
            <el-button v-if="permissionList.editBtn" icon="el-icon-edit" size="small" type="text"
                       @click="updateSave(row,index)">编辑
            </el-button>
            <el-button v-if="permissionList.delBtn" icon="el-icon-delete" size="small" type="text"
                       @click="deleteSave(row,index)">删除
            </el-button>
          </template>
          <template slot="menuLeft">
            <el-button size="small" type="primary" icon="el-icon-plus" @click="addSave">新&nbsp;&nbsp;增
            </el-button>
            <el-button size="small" plain type="primary" icon="el-icon-zoom-in" @click="applyRangeOpen">查看使用范围
            </el-button>
            <el-input placeholder="按属性编号查询" v-model="searchId" clearable prefix-icon="el-icon-search" class="attrSearch"
              size="small" @change="doSearch" type="text"></el-input>
            <el-button size="small" plain type="primary" icon="el-icon-search" @click="doSearch">&nbsp;搜索</el-button>
            <div>
              <el-button v-if="permissionList.addBtn" icon="el-icon-plus" size="small" type="primary" @click="addSave">新&nbsp;&nbsp;增
              </el-button>
              <el-button v-if="permissionList.apply" icon="el-icon-zoom-in" plain size="small" type="primary"
                         @click="applyRangeOpen">查看使用范围
              </el-button>
              <span style="width: 200px;display: inline-block">
                <el-select slot="prepend" v-model="oriValue" placeholder="请选择" size="small">
                <el-option v-for="item in oriData" :key="item.prop" :label="item.label" :value="item.prop"
                ></el-option>
              </el-select>
            </span>
              <span>
                 <el-input v-model="searchId" class="attrSearch" clearable placeholder="请输入内容"
                           prefix-icon="el-icon-search"
                           size="small" type="text" @change="doSearch"></el-input>
              <el-button icon="el-icon-search" plain size="small" type="primary" @click="doSearch">&nbsp;搜索</el-button>
              </span>
            </div>
          </template>
          <template slot="typeValue" slot-scope="{row}">
            <el-tag>{{ row.typeValue }}</el-tag>
@@ -30,106 +48,109 @@
            <avue-crud v-model="applyRange.model" :option="applyRange.option" :data="applyRange.data" class="applyRangeTable"
            ></avue-crud>
        </el-dialog> -->
        <Versionpackage :rangeData="applyRangeData" ref="applyRange"></Versionpackage>
        <Versionpackage ref="applyRange" :rangeData="applyRangeData"></Versionpackage>
      </basic-container>
    </el-main>
    <el-aside>
      <basic-container class="itemForm">
        <el-descriptions class="margin-top" :column="1" size="medium" border title="属性项">
          <el-descriptions-item>
            <template slot="label">
              属性编号
            </template>
            {{ itemForm.itemData.id }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label">
              属性名称
            </template>
            {{ itemForm.itemData.name }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label">
              属性类型
            </template>
            {{ itemForm.itemData.typeValue }}
          </el-descriptions-item>
<!--          <el-descriptions-item>
            <template slot="label">
              标签
            </template>
            {{ itemForm.itemData.hashtag }}
          </el-descriptions-item>-->
          <el-descriptions-item>
            <template slot="label">
              默认值
            </template>
            {{ itemForm.itemData.defaultValue }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label">
              允许为空
            </template>
            {{ 'true' == itemForm.itemData.nullable ? '是' : '否'}}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label">
              长度
            </template>
            {{ itemForm.itemData.maxLength }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label">
              描述
            </template>
            {{ itemForm.itemData.description }}
          </el-descriptions-item>
        </el-descriptions>
        <div style="height:15px"></div>
        <el-descriptions class="margin-top" :column="1" size="medium" border title="属性配置"></el-descriptions>
        <el-tabs v-model="itemForm.activeName" @tab-click="handleClick" stretch="true" style="height:235px">
          <el-tab-pane label="参照" name="referTab">
            <el-descriptions class="margin-top" :column="1" size="medium" border>
              <el-descriptions-item>
                <template slot="label">
                  使用参照
                </template>
                {{ itemForm.itemData.referTypeValue ? '是' : '否' }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label">
                  参照类型
                </template>
                {{ itemForm.itemData.referTypeValue }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label">
                  参照名称
                </template>
                {{ itemForm.itemData.referToName }}
              </el-descriptions-item>
            </el-descriptions>
          </el-tab-pane>
          <el-tab-pane label="枚举" name="enumTab">
            <el-descriptions class="margin-top" :column="1" :size="small" border>
              <el-descriptions-item>
                <template slot="label">
                  使用枚举
                </template>
                {{ itemForm.itemData.usingDict ? '是' : '否' }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label">
                  枚举类型
                </template>
                {{ itemForm.itemData.dictValue }}
              </el-descriptions-item>
            </el-descriptions>
          </el-tab-pane>
        </el-tabs>
        <div style="height: 44vh">
          <el-descriptions :column="1" border class="margin-top" size="medium" title="属性项">
            <el-descriptions-item>
              <template slot="label">
                属性编号
              </template>
              {{ itemForm.itemData.id }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                属性名称
              </template>
              {{ itemForm.itemData.name }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                属性类型
              </template>
              {{ itemForm.itemData.typeValue }}
            </el-descriptions-item>
            <!--          <el-descriptions-item>
                        <template slot="label">
                          标签
                        </template>
                        {{ itemForm.itemData.hashtag }}
                      </el-descriptions-item>-->
            <el-descriptions-item>
              <template slot="label">
                默认值
              </template>
              {{ itemForm.itemData.defaultValue }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                允许为空
              </template>
              {{ 'true' == itemForm.itemData.nullable ? '是' : '否' }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                长度
              </template>
              {{ itemForm.itemData.maxLength }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                描述
              </template>
              {{ itemForm.itemData.description }}
            </el-descriptions-item>
          </el-descriptions>
        </div>
        <div style="  height: 40vh">
          <el-descriptions :column="1" border class="margin-top" size="medium" title="属性配置"></el-descriptions>
          <el-tabs v-model="itemForm.activeName" stretch="true" style="height:235px" @tab-click="handleClick">
            <el-tab-pane label="参照" name="referTab">
              <el-descriptions :column="1" border class="margin-top" size="medium">
                <el-descriptions-item>
                  <template slot="label">
                    使用参照
                  </template>
                  {{ itemForm.itemData.referTypeValue ? '是' : '否' }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">
                    参照类型
                  </template>
                  {{ itemForm.itemData.referTypeValue }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">
                    参照名称
                  </template>
                  {{ itemForm.itemData.referToName }}
                </el-descriptions-item>
              </el-descriptions>
            </el-tab-pane>
            <el-tab-pane label="枚举" name="enumTab">
              <el-descriptions :column="1" :size="small" border class="margin-top">
                <el-descriptions-item>
                  <template slot="label">
                    使用枚举
                  </template>
                  {{ itemForm.itemData.usingDict ? '是' : '否' }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">
                    枚举类型
                  </template>
                  {{ itemForm.itemData.dictValue }}
                </el-descriptions-item>
              </el-descriptions>
            </el-tab-pane>
          </el-tabs>
        </div>
      </basic-container>
    </el-aside>
    <originalAdd ref="originalAdd" @refreshTable="refreshChange" :attribute="editAttribute"></originalAdd>
    <originalAdd ref="originalAdd" :attribute="editAttribute" @refreshTable="refreshChange"></originalAdd>
  </el-container>
</template>

@@ -142,11 +163,28 @@
} from "@/api/omd/OmdAttribute";
import Versionpackage from "./Versionpackage.vue";
import {getDictionary} from "@/api/omd/enum";
import {mapGetters} from "vuex";

export default {
  name: "original",
  data() {
    return {
      oriData: [
        {
          label: "属性编号",
          prop: "id",
          align: "left",
          display: false,
          width: 200,
          required: true
        }, {
          label: "属性名称",
          prop: "name",
          align: "left",
          display: false
        }
      ],
      oriValue: "id",
      page: {
        pageSize: 10,
        currentPage: 1,
@@ -161,8 +199,8 @@
      editAttribute: {},
      applyRangeData: [],
      option: {
        height: "auto",
        calcHeight:20,
        height: 'auto',
        calcHeight: 20,
        headerAlign: "center",
        border: true,
        index: true,
@@ -175,7 +213,7 @@
        addBtn: false,
        editBtn: false,
        delBtn: false,
        columnBtn:false,
        columnBtn: false,
        column: [{
          label: "选择",
          prop: "radio",
@@ -252,12 +290,23 @@
      itemForm: {
        itemData: {},
        activeName: "referTab",
        enumInitFlag:false,
        enumInitFlag: false,
        referInitFlag: false,
        form: {}
      },
      searchId: '',
    };
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.modeling_original.original_add, false),
        apply: this.vaildData(this.permission.modeling_original.original_applyopen, false),
        delBtn: this.vaildData(this.permission.modeling_original.original_delete, false),
        editBtn: this.vaildData(this.permission.modeling_original.original_edit, false),
      }
    },
  },
  created() {
  },
@@ -271,7 +320,7 @@
      newAttr.nullable = true;
      this.$refs.originalAdd.attribute = newAttr;
    },
    updateSave(row,index) {
    updateSave(row, index) {
      this.selectRow = index;
      var json = JSON.stringify(row);
      this.editAttribute = JSON.parse(json);
@@ -284,7 +333,7 @@
      this.$refs.originalAdd.referInitFlag = this.itemForm.referInitFlag;
      // this.refreshChange()
    },
    deleteSave(row,index) {
    deleteSave(row, index) {
      this.$confirm("删除元数据将无法被恢复, 是否继续?", "提示", {
        iconClass: 'el-icon-question',
        confirmButtonText: "确定",
@@ -315,12 +364,12 @@
      this.attribute = row;
      this.checkUsingReferDict(row);
    },
    checkUsingReferDict(row){
      if (row.referToId !== null && row.referToId !== ""){
    checkUsingReferDict(row) {
      if (row.referToId !== null && row.referToId !== "") {
        this.itemForm.activeName = 'referTab';
        this.itemForm.referInitFlag = true;
        this.itemForm.enumInitFlag = false;
      }else if (row.usingDict === 'true'){
      } else if (row.usingDict === 'true') {
        this.itemForm.activeName = 'enumTab';
        this.itemForm.referInitFlag = false;
        this.itemForm.enumInitFlag = true;
@@ -329,7 +378,7 @@
          this.itemForm.itemData.dictValue = this.editAttribute.dictValue;
          this.$refs.originalAdd.dictEnums = res.data.data;
        })
      }else {
      } else {
        this.itemForm.activeName = 'referTab';
        this.itemForm.referInitFlag = true;
        this.itemForm.enumInitFlag = false;
@@ -354,22 +403,25 @@

      });
    },
    doSearch(){
      var params = {"id_like":this.searchId};
      this.onLoad(this.page,params);
    doSearch() {

      var params = {[this.oriValue + "_like"]: this.searchId};
      this.onLoad(this.page, params);
    }
  },
  components: { Versionpackage }
  components: {Versionpackage}
}
</script>

<style lang="scss">
.applyRangeTable>.el-card:nth-of-type(2)>.el-card__body>.avue-crud__menu {
.applyRangeTable > .el-card:nth-of-type(2) > .el-card__body > .avue-crud__menu {
  display: none !important;
}

.attrSearch {
  width:201px;
  width: 201px;
}

.attrSearch > .el-input__inner {
  width: 200px;
}