From e5748ecbc12ea91d702e61af9a19667d19d19510 Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期一, 29 五月 2023 17:55:16 +0800
Subject: [PATCH] 动态表格组件更新
---
Source/UBCS-WEB/src/views/modeling/originalAdd.vue | 456 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 456 insertions(+), 0 deletions(-)
diff --git a/Source/UBCS-WEB/src/views/modeling/originalAdd.vue b/Source/UBCS-WEB/src/views/modeling/originalAdd.vue
new file mode 100644
index 0000000..fc2bae1
--- /dev/null
+++ b/Source/UBCS-WEB/src/views/modeling/originalAdd.vue
@@ -0,0 +1,456 @@
+<template>
+ <el-container>
+ <el-dialog title="鍏冩暟鎹�" :visible.sync="showSubmitDialog" append-to-body @close="closeSubmitDialog" width="700px"
+ style="height: 115vh;">
+ <!-- 鍏冩暟鎹殑澧炴敼寮圭獥 -->
+ <el-form ref="form" :model="attribute" show-message="true" inline size="medium" label-suffix=":"
+ class="attributeForm" :rules="rules" @resetFields="resetAttributeForm" status-icon="true">
+ <el-form-item label="灞炴�х紪鍙�" label-width="100px" prop="id">
+ <el-input v-model="attribute.id" maxlength="15" show-word-limit type="text"></el-input>
+ </el-form-item>
+ <el-form-item label="灞炴�у悕绉�" label-width="100px" prop="name">
+ <el-input v-model="attribute.name"></el-input>
+ </el-form-item>
+ <el-form-item label="灞炴�х被鍨�" label-width="100px" prop="typeValue">
+ <el-select v-model="attribute.typeValue" placeholder="璇烽�夋嫨灞炴�х被鍨�" @change="typeSelectChange">
+ <el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value">
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鏍囩" label-width="100px">
+ <el-input v-model="attribute.hashtag"></el-input>
+ </el-form-item>
+ <el-form-item label="榛樿鍊�" label-width="100px">
+ <el-input v-model="attribute.defaultValue"></el-input>
+ </el-form-item>
+ <el-form-item label="鍏佽涓虹┖" label-width="100px">
+ <el-switch v-model="attribute.nullable" active-text="鍏佽" inactive-text="涓嶅厑璁�"></el-switch>
+ </el-form-item>
+ <el-form-item label="闀垮害" label-width="100px" prop="maxLength">
+ <el-input-number v-model="attribute.maxLength" :min="1" :max="4000" :step="1" controls-position="right"></el-input-number>
+ </el-form-item>
+ <el-form-item label="绮惧害" label-width="100px" v-if="attribute.typeValue == 'VTDouble'">
+ <el-input-number v-model="attribute.precision" :min="1" :max="20" :step="1" controls-position="right" @change="changeNumber"></el-input-number>
+ </el-form-item>
+ <el-form-item label="鎻忚堪" label-width="100px">
+ <el-input v-model="attribute.description" type="text"></el-input>
+ </el-form-item>
+
+ <el-tabs v-model="activeName" @tab-click="handleClick" stretch="true">
+ <el-tab-pane label="鍙傜収" name="referTab">
+ <el-form-item label="鍙傜収绫诲瀷" label-width="100px">
+ <el-select v-model="attribute.referTypeKey" @change="referTypeSelectChange">
+ <el-option v-for="item in btmRefer.referTypeList" :key="item.value" :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鍙傜収鍚嶇О" label-width="100px">
+ <el-input v-model="attribute.referToName" @focus="openReferConfig" clearable="true"
+ :disabled="referToFlag" @clear="clearReferTo">
+ <i slot="suffix" class="el-input__icon el-icon-search"></i>
+ </el-input>
+ </el-form-item>
+ </el-tab-pane>
+ <el-tab-pane label="鏋氫妇" name="enumTab">
+ <el-form-item label="鏋氫妇" label-width="100px">
+ <el-input v-model="attribute.dictValue" @focus="openEnumConfig" clearable="true">
+ <i slot="suffix" class="el-input__icon el-icon-search"></i>
+ </el-input>
+ </el-form-item>
+ <el-form-item label="鏋氫妇椤�" label-width="100px">
+
+ </el-form-item>
+ </el-tab-pane>
+ </el-tabs>
+ </el-form>
+ <div slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="submitAttribute">纭畾</el-button>
+ <el-button @click="cancleSubmit">鍙栨秷</el-button>
+ </div>
+ <!-- 閫夋嫨鍙傜収鏃剁殑寮圭獥 -->
+ <el-dialog title="鍙傜収鍒楄〃" :visible.sync="btmRefer.show" append-to-body @close="closeReferDialog" width="80%"
+ style="height: 115vh;">
+ <el-container>
+ <el-aside>
+ <basic-container>
+ <span class="el-dialog__title"> {{ domain.treeOption.title }} </span>
+ <div style="height:20px;"></div>
+ <avue-tree id="domain" :data="domain.data" :option="domain.treeOption" @node-click="nodeClick"
+ class="businessTree" style="height: 418px">
+ <span class="el-tree-node__label" slot-scope="{ node, data }">
+ <span>
+ <i class="el-icon-star-on"></i>
+ {{ (node || {}).label }}
+ </span>
+ </span>
+ </avue-tree>
+ </basic-container>
+ </el-aside>
+ <el-main>
+ <basic-container>
+ <avue-crud ref="btmTable" :option="btmRefer.option" :data="btmRefer.data" class="btmTable" @row-click="btmReferClick">
+ <template slot="radio" slot-scope="{row}">
+ <el-radio v-model="btmRefer.selectRow" :label="row.$index">
+ </el-radio>
+ </template>
+ </avue-crud>
+ </basic-container>
+ </el-main>
+
+ </el-container>
+ <div slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="confirmBtm" size="small">纭畾</el-button>
+ <el-button @click="cancleBtm" size="small">鍙栨秷</el-button>
+ </div>
+ </el-dialog>
+ <!-- 閫夋嫨鏋氫妇鏃剁殑寮圭獥 -->
+ <el-dialog title="鏋氫妇鍒楄〃" :visible.sync="enumRefer.show" append-to-body @close="closeEnumDialog" width="70%"
+ style="height: 115vh;">
+ <avue-crud ref="eunmTable" :option="enumRefer.option" :data="enumRefer.data" class="enumTable" @row-click="enumReferClick" :page.sync="enumRefer.enumPage">
+ <template slot="radio" slot-scope="{row}">
+ <el-radio v-model="enumRefer.selectRow" :label="row.$index">
+ </el-radio>
+ </template>
+ </avue-crud>
+ <div slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="confirmEnum" size="small">纭畾</el-button>
+ <el-button @click="cancleEnum" size="small">鍙栨秷</el-button>
+ </div>
+ </el-dialog>
+ </el-dialog>
+
+ </el-container>
+</template>
+
+<script>
+import { getDictionary,getParentList } from '@/api/omd/enum'
+import { initTree,btmPage } from '@/api/omd/btmType'
+import { add} from '@/api/omd/OmdAttribute'
+export default {
+ name: 'originalAdd',
+ props: {
+ attribute: {
+ type: Object
+ },
+ },
+ data() {
+ return {
+ showSubmitDialog: false,
+ // 榛樿鐨勯〉绛�
+ activeName: 'referTab',
+ // 灞炴�х被鍨嬩笅鎷夋鏁版嵁
+ typeList: [],
+ // 鍙傜収涓嬫媺妗嗘槸鍚﹀彲鐢�
+ referToFlag: true,
+ // 琛ㄥ崟鏍￠獙瑙勫垯
+ rules: {
+ id: [
+ { required: true, message: '璇疯緭鍏ュ睘鎬х紪鍙�', trigger: 'blur' },
+ { pattern: /^[A-Za-z]+$/, message: '灞炴�х紪鍙峰彧鑳戒负鑻辨枃', trigger: 'blur' },
+ { min: 2, max: 15, message: '闀垮害鍦�2鍒�15涓瓧绗�', trigger: 'blur' }
+ ],
+ name: [
+ { required: true, message: '璇疯緭鍏ュ睘鎬у悕绉�', trigger: 'blur' }
+ ],
+ typeValue: [
+ { required: true, message: '璇烽�夋嫨灞炴�х被鍨�', trigger: 'change' }
+ ],
+ maxLength: [
+ { required: true, message: '闇�瑕佹寚瀹氶暱搴�', trigger: 'blur' }
+ ]
+ },
+ // 鍙傜収椤甸潰琛ㄦ牸閰嶇疆
+ btmRefer: {
+ show: false,
+ btmPage: {
+ pageSize: 10,
+ currentPage: 1,
+ total: 100
+ },
+ option: {
+ height: 405,
+ addBtn: false,
+ refreshBtn: false,
+ columnBtn: false,
+ menu: false,
+ border: true,
+ reserveSelection: true,
+ searchMenuSpan: 32,
+ searchShowBtn: false,
+ highlightCurrentRow: true,
+ column: [
+ {
+ label: '',
+ prop: 'radio',
+ width: 60,
+ hide: false
+ },
+ {
+ label: '鑻辨枃鍚嶇О',
+ prop: 'id',
+ align: 'center',
+ searchSpan:8,
+ search: true,
+ }, {
+ label: '涓枃鍚嶇О',
+ prop: 'name',
+ align: 'center',
+ searchSpan:8,
+ search: true,
+ }]
+ },
+ // 鍙傜収椤甸潰琛ㄦ牸鏁版嵁
+ data: [],
+ selectRow: '',
+ selectItem: {},
+ referTypeList: []
+ },
+ // 鏋氫妇鍙傜収琛ㄦ牸閰嶇疆
+ enumRefer: {
+ show: false,
+ enumPage: {
+ pageSize: 10,
+ currentPage: 1,
+ total: 100
+ },
+ option: {
+ height: 360,
+ addBtn: false,
+ refreshBtn: false,
+ columnBtn: false,
+ selection: true,
+ menu: false,
+ border: true,
+ reserveSelection: true,
+ searchMenuSpan: 32,
+ searchShowBtn: false,
+ highlightCurrentRow: true,
+ column: [{
+ label: '',
+ prop: 'radio',
+ width: 60,
+ hide: false
+ },{
+ label: '鏋氫妇浠ｅ彿',
+ prop: 'name',
+ align: 'center',
+ searchSpan:8,
+ search: true,
+ }, {
+ label: '鏋氫妇鍚嶇О',
+ prop: 'label',
+ align: 'center',
+ searchSpan:8,
+ search: true,
+ }]
+ },
+ // 鏋氫妇鍙傜収琛ㄦ牸鏁版嵁
+ data: [],
+ enumDictionary: [],
+ // 閫夊畾琛�
+ selectRow: '',
+ selectItem: {}
+ },
+ domain: {
+ data: [],
+ treeOption: {
+ defaultExpandAll: true,
+ title: '棰嗗煙鏈嶅姟鏍�',
+ props: {
+ labelText: '',
+ label: 'name',
+ value: 'oid',
+ }
+ }
+ }
+ }
+ },
+ created() {
+ this.initAttributeTypeList();
+ this.initAttributeReferTypeList();
+ },
+ methods: {
+ closeSubmitDialog() {
+ this.resetAttributeForm();
+ this.showSubmitDialog = false;
+ },
+ resetAttributeForm() {
+ this.attribute = {
+ nullable: true,
+ referTypeKey: '',
+ };
+ this.referToFlag = true;
+ this.$refs.form.resetFields();
+ },
+ submitAttribute() {
+ add(this.attribute).then(res => {
+ this.$message.success("淇濆瓨鎴愬姛");
+ this.showSubmitDialog = false;
+ this.attribute = {};
+ this.$emit('refreshTable');
+ });
+
+ },
+ cancleSubmit() {
+ this.closeSubmitDialog();
+ },
+ closeEnumDialog() {
+ this.cancleEnum();
+ },
+ closeReferDialog() {
+ this.cancleBtm();
+ },
+ confirmBtm() {
+ this.attribute.referToId = this.btmRefer.selectItem.oid;
+ this.attribute.referToName = this.btmRefer.selectItem.name;
+ this.btmRefer.show = false;
+ },
+ cancleBtm() {
+ this.btmRefer.selectItem = {};
+ this.btmRefer.show = false;
+ this.btmRefer.selectRow = '';
+ },
+ confirmEnum() {
+ this.attribute.usingDict = true;
+ this.attribute.dictCode = this.enumRefer.selectItem.name;
+ this.attribute.dictValue = this.enumRefer.selectItem.label;
+ this.enumRefer.show = false;
+ },
+ cancleEnum() {
+ this.enumRefer.selectItem = {};
+ this.enumRefer.show = false;
+ this.enumRefer.selectRow = '';
+ },
+ // 鍙傜収鍚嶇О杈撳叆妗嗚幏鍙栫劍鐐规椂鐨勪簨浠�
+ openReferConfig() {
+ if (!this.attribute.referTypeKey) {
+ this.$message.warning('璇峰厛閫夋嫨鍙傜収鐨勭被鍨�');
+ this.referToFlag = true;
+ return;
+ }
+ this.domain.data = [];
+ this.btmRefer.data = [];
+ initTree().then(res => {
+ this.domain.data = res.data.data;
+ })
+ this.btmRefer.show = true;
+
+ },
+ // 鍙傜収绫诲瀷鏍戠殑鐐瑰嚮浜嬩欢
+ nodeClick(data) {
+ // 鍖哄垎涓氬姟绫诲瀷鐨勬煡璇㈠拰閾炬帴绫诲瀷鐨勬煡璇�
+ if(this.attribute.referTypeKey == 'btmType'){
+ btmPage(this.btmRefer.btmPage.currentPage,this.btmRefer.btmPage.pageSize,{domain:data.id}).then(res => {
+ this.btmRefer.data = res.data.data.records;
+ this.btmRefer.btmPage.total = res.data.data.total;
+ })
+ }
+ if(this.attribute.referTypeKey == 'linkType'){
+
+ }
+ },
+ // 鏋氫妇绫诲瀷杈撳叆妗嗚幏寰楃劍鐐规椂鐨勪簨浠�
+ openEnumConfig() {
+ getParentList(this.enumRefer.enumPage.currentPage,this.enumRefer.enumPage.pageSize).then(res => {
+ this.enumRefer.enumPage.total = res.data.data.total;
+ this.enumRefer.data = res.data.data.records;
+ })
+ this.enumRefer.show = true;
+ },
+ // 灞炴�х被鍨嬩笅鎷夋閫夋嫨浜嬩欢
+ typeSelectChange(value) {
+ if (value == 'VTString') {
+ this.$set(this.attribute,"maxLength",150)
+ } else if (value == 'VTInteger') {
+ this.$set(this.attribute,"maxLength",50)
+ } else if (value == 'VTBoolean') {
+ this.$set(this.attribute,"maxLength",5)
+ } else if (value == 'VTDouble') {
+ this.$set(this.attribute,"maxLength",26)
+ this.$set(this.attribute,"precision",8)
+ } else if (value == 'VTLong') {
+ this.$set(this.attribute,"maxLength",150)
+ } else if (value == 'VTDate' || value == 'VTTime' || value == 'VTDateTime') {
+ this.$set(this.attribute,"maxLength",6)
+ } else {
+ this.$set(this.attribute,"maxLength",50)
+ }
+ this.attribute.typeCode = 'attributeType';
+ this.attribute.typeKey = value;
+ },
+ referTypeSelectChange(value) {
+ this.attribute.referTypeCode = 'attributeReferType';
+ this.attribute.referTypeKey = value;
+ this.referToFlag = false;
+ },
+ initAttributeTypeList() {
+ getDictionary({ code: 'attributeType' }).then(res => {
+ res.data.data.forEach(element => {
+ this.typeList.push(
+ { value: element.itemValue, label: element.itemName }
+ )
+ });
+ }).catch(() => {
+ this.$message.error('灞炴�х被鍨嬫病鎵惧埌鎴栬�呮湭瀹氫箟')
+ })
+ },
+ initAttributeReferTypeList(){
+ getDictionary({ code: 'attributeReferType' }).then(res => {
+ res.data.data.forEach(element => {
+ this.btmRefer.referTypeList.push(
+ { value: element.itemValue, label: element.itemName }
+ )
+ });
+ }).catch(() => {
+ this.$message.error('鍙傜収绫诲瀷娌℃壘鍒版垨鑰呮湭瀹氫箟')
+ })
+ },
+ btmReferClick(row){
+ this.btmRefer.selectItem = row;
+ this.btmRefer.selectRow = row.$index;
+ },
+ enumReferClick(row){
+ this.enumRefer.selectItem = row;
+ this.enumRefer.selectRow = row.$index;
+ },
+ // 鍙傜収鍚嶇О鐐瑰嚮娓呴櫎鏁版嵁
+ clearReferTo(){
+ this.$delete(this.attribute,'referToId');
+ this.$delete(this.attribute,'referToName');
+ this.btmRefer.selectItem = {};
+ this.btmRefer.selectRow = '';
+ },
+ handleClick(tab){
+ // 鍥犱负鍙兘鍙傜収鍜屾灇涓句簩閫変竴銆傛墍浠ュ湪鍒囨崲鐨勬椂鍊欐妸灞炴�х粰娓呯┖銆�
+ this.$delete(this.attribute,'referTypeCode');
+ this.$delete(this.attribute,'referTypeKey');
+ this.$delete(this.attribute,'referTypeValue');
+ this.$delete(this.attribute,'referToId');
+ this.$delete(this.attribute,'referToName');
+ this.$delete(this.attribute,'dictCode');
+ this.$delete(this.attribute,'dictKey');
+ this.$delete(this.attribute,'dictValue');
+ this.$delete(this.attribute,'usingDict');
+ }
+ }
+}
+</script>
+
+<style>
+.btmTable>.el-card:nth-of-type(2)>.el-card__body>.avue-crud__menu {
+ display: none !important;
+}
+
+.enumTable>.el-card:nth-of-type(2)>.el-card__body>.avue-crud__menu {
+ display: none !important;
+}
+
+.attributeForm>.el-form-item>.el-form-item__content>.el-input>.el-input__inner {
+ width: 200px;
+}
+
+.attributeForm>.el-form-item>.el-form-item__content> .el-select>.el-input>.el-input__inner {
+ width: 200px;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3