From ae5ee96f6a7d6722526cb00f8b7a8fb7778596ea Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期五, 05 五月 2023 18:24:20 +0800
Subject: [PATCH] 分类树功能处理

---
 Source/UBCS-WEB/src/components/Tree/TemplatePro.vue |  496 +++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 321 insertions(+), 175 deletions(-)

diff --git a/Source/UBCS-WEB/src/components/Tree/TemplatePro.vue b/Source/UBCS-WEB/src/components/Tree/TemplatePro.vue
index b82a392..ce0b09d 100644
--- a/Source/UBCS-WEB/src/components/Tree/TemplatePro.vue
+++ b/Source/UBCS-WEB/src/components/Tree/TemplatePro.vue
@@ -2,7 +2,7 @@
   <basic-container>
     <avue-tabs :option="Taboption" @change="handleChange"></avue-tabs>
     <span v-if="type.prop==='tab1'">
-    <avue-crud :data="data" :option="option"></avue-crud>
+      <attrCrud></attrCrud>
     </span>
     <span v-else-if="type.prop==='tab2'">妯℃澘娴佺▼</span>
     <span v-else-if="type.prop==='tab3'">妯℃澘闃舵</span>
@@ -36,193 +36,339 @@
           prop: 'tab4',
         }]
       },
-      data:[
-        {
-          EnglishNum:"娴嬭瘯涓�",
-          ChinaName:"娴嬭瘯涓�",
-          PropGruop:"娴嬭瘯涓�",
-          Type:"娴嬭瘯涓�"
-        },
-        {
-          EnglishNum:"娴嬭瘯浜�",
-          ChinaName:"娴嬭瘯浜�",
-          PropGruop:"娴嬭瘯浜�",
-          Type:"娴嬭瘯浜�"
-        },
-        {
-          EnglishNum:"娴嬭瘯涓�",
-          ChinaName:"娴嬭瘯涓�",
-          PropGruop:"娴嬭瘯涓�",
-          Type:"娴嬭瘯涓�"
-        }
-      ],
-      option: {
-        index: true,
-        border: true,
-        editBtn:false,
-        labelWidth:110,
-        column: [
-          {
-            label: "灞炴�ц嫳鏂囩紪鍙�",
-            prop: "EnglishNum",
-            fixed:true,
-            labelWidth:110,
-            width:95
-          },
-          {
-            label: "灞炴�т腑鏂囧悕绉�",
-            prop: "ChinaName",
-            fixed:true,
-            width:95
-          },
-          {
-            label: "灞炴�у垎缁�",
-            prop: "PropGruop"
-          },
-          {
-            label: "绫诲瀷",
-            prop: "Type"
-          },
-          {
-            label: "鍒楄〃瀹藉害",
-            prop: "ListWidth"
-          },
-          {
-            label: "鍏抽敭灞炴��",
-            prop: "KeyAttr"
-          },
-          {
-            label: "鏌ヨ灞炴��",
-            prop: "QueryPro"
-          },
-          {
-            label: "楂樼骇鏌ヨ灞炴��",
-            prop: "SeniorQueryPro",
-            width:95
-          },
-          {
-            label: "鐩镐技鏌ヨ灞炴��",
-            prop: "SimilarPro",
-            width:95
-          },
-          {
-            label: "蹇呰緭",
-            prop: "MustLose"
-          },
-          {
-            label: "琛ㄥ崟鏄剧ず",
-            prop: "FormDIs"
-          },
-          {
-            label: "鍒楄〃鏄剧ず",
-            prop: "TableDis"
-          },
-          {
-            label: "鍙",
-            prop: "readOnly"
-          },
-          {
-            label: "鍒楄〃鎺掑簭",
-            prop: "ListSort"
-          },
 
-          {
-            label: "澶氳鏂囨湰",
-            prop:"LineText",
-          },
-          {
-            label: "榛樿鍊�",
-            prop:"DefaultValue",
-          },
-          {
-            label: "鍓嶇紑",
-            prop:"prefix",
-          },
-          {
-            label: "鍚庣紑",
-            prop:"suffix"
-          },
-          {
-            label: "缁勫悎瑙勫垯",
-            prop:"ComRules"
-          },
-          {
-            label: "楠岃瘉瑙勫垯",
-            prop:"rules"
-          },
-          {
-            label: "鏃堕棿鏍煎紡",
-            prop:"TimeForm"
-          },
-          {
-            label: "鍒嗙被娉ㄥ叆",
-            prop:"claInjection"
-          },
-          {
-            label: "鍒嗙被娉ㄥ叆",
-            prop:"EnuInjection"
-          },
-          {
-            label: "绾ц仈灞炴��",
-            prop:"CasProp"
-          },
-          {
-            label: "鍙傜収閰嶇疆",
-            prop:"RefConfig"
-          },
-          {
-            label: "绾ц仈鏌ヨ灞炴��",
-            prop:"CasQueryProp"
-          },
-          {
-            label: "閫夋嫨搴撴爣璇�",
-            prop:"SelectLib"
-          },
-          {
-            label: "濉啓鎻愮ず",
-            prop:"FillPrompt"
-          },
-          {
-            label: "琛ㄥ崟鏄剧ず鏍峰紡",
-            prop:"FormShow"
-          },
-          {
-            label: "琛ㄥ崟瓒呴摼鎺�",
-            prop:"FormHer"
-          },
-          {
-            label: "琛ㄦ牸鏄剧ずjs",
-            prop:"CrudJs"
-          },
-          {
-            label: "闀垮害",
-            prop:"length"
-          },
-          {
-            label: "灏忔暟绮惧害",
-            prop:"DecimalPrecis"
-          },
-          {
-            label: "鍙栧�艰寖鍥�",
-            prop:"ValueRange"
-          },
-        ]
-      }
     }
   },
   created() {
+    // 杩涘叆椤甸潰榛樿鏄ā鏉垮睘鎬�
     this.type = this.Taboption.column[0];
-    this.type.prop="tab1"
+    this.type.prop = "tab1"
   },
   methods: {
+    // Tab鏍忓垏鎹�
     handleChange(column) {
       this.type = column
       this.$message.success(JSON.stringify(column))
-    }
+    },
   }
 }
 </script>
 
-<style scoped>
+
+<!--<template>-->
+<!--  &lt;!&ndash; 浣跨敤 Element UI 鐨勮〃鏍肩粍浠跺睍绀烘暟鎹� &ndash;&gt;-->
+<!--  &lt;!&ndash; 瀵规瘡琛屾暟鎹覆鏌撲竴涓〃鏍艰缁勪欢 &ndash;&gt;-->
+<!--  <el-table :data="data">-->
+<!--    <el-table-column v-for="column in columns" :key="column.prop" :label="column.label">-->
+<!--      <template slot-scope="scope">-->
+<!--        <template v-if="isEditing(scope.$index, column.prop)">-->
+<!--          &lt;!&ndash; 浣跨敤鑷畾涔夎緭鍏ユ锛岀粦瀹氭暟鎹苟鐩戝惉 blur 浜嬩欢 &ndash;&gt;-->
+<!--          <el-input v-model="editorModel[scope.$index][column.prop]" ref="editor"-->
+<!--                    @blur="onEditorBlur(scope.$index, column.prop)">-->
+<!--          </el-input>-->
+<!--        </template>-->
+<!--        <template v-else>-->
+<!--          &lt;!&ndash; 灏嗘暟鎹覆鏌撲负琛ㄦ牸鍗曞厓鏍硷紝缁戝畾 click 浜嬩欢 &ndash;&gt;-->
+<!--          <div @click="onCellClick(scope.$index, column.prop)"-->
+<!--               :style="{cursor: 'pointer', backgroundColor: isEditing(scope.$index, column.prop) ? '#F0F0F0' : 'transparent'}">-->
+<!--            {{ scope.row[column.prop] === "" ? '' : scope.row[column.prop] }}-->
+<!--          </div>-->
+<!--        </template>-->
+<!--      </template>-->
+<!--    </el-table-column>-->
+<!--  </el-table>-->
+<!--</template>-->
+
+<!--<script>-->
+<!--export default {-->
+<!--  data() {-->
+<!--    // 缁勪欢鐨勬暟鎹紝鍖呮嫭琛ㄦ牸鐨勬暟鎹�佸垪瀹氫箟鍜屽綋鍓嶆鍦ㄧ紪杈戠殑琛屽拰鍒�-->
+<!--    return {-->
+<!--      data: [-->
+<!--        { id: 1, name: '寮犱笁', age: 18, attributegroup: '鐢�', attributeDataTypeText: '骞夸笢鐪佹繁鍦冲競' },-->
+<!--        { id: 2, name: '鏉庡洓', age: 20, attributegroup: '濂�', attributeDataTypeText: '鍖椾含甯傛捣娣�鍖�' },-->
+<!--        { id: 3, name: '鐜嬩簲', age: 22, attributegroup: '鐢�', attributeDataTypeText: '涓婃捣甯傛郸涓滄柊鍖�' },-->
+<!--        { id: 4, name: '璧靛叚', age: 24, attributegroup: '濂�', attributeDataTypeText: '骞夸笢鐪佸箍宸炲競' }-->
+<!--      ],-->
+<!--      columns: [  // 瀹氫箟琛ㄦ牸鐨勫垪-->
+<!--        {-->
+<!--          label: "灞炴�ц嫳鏂囩紪鍙�",-->
+<!--          prop: "id",-->
+<!--          fixed: true,-->
+<!--          cell: false,-->
+<!--          labelWidth: 110,-->
+<!--          width: 125,-->
+<!--          sortable: true,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "灞炴�т腑鏂囧悕绉�",-->
+<!--          prop: "name",-->
+<!--          fixed: true,-->
+<!--          cell: false,-->
+<!--          width: 125,-->
+<!--          sortable: true-->
+<!--        },-->
+<!--        {-->
+<!--          label: "灞炴�у垎缁�",-->
+<!--          prop: "attributegroup",-->
+<!--          cell: false,-->
+<!--          sortable: true,-->
+<!--          width: 125,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "绫诲瀷",-->
+<!--          prop: "attributeDataTypeText",-->
+<!--          cell: false,-->
+<!--          sortable: true,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍒楄〃瀹藉害",-->
+<!--          prop: "attrTableWidth",-->
+<!--          cell: false,-->
+<!--          sortable: true,-->
+<!--          width: 105,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍏抽敭灞炴��",-->
+<!--          prop: "keyattrflag",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鏌ヨ灞炴��",-->
+<!--          prop: "queryattrflag",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "楂樼骇鏌ヨ灞炴��",-->
+<!--          prop: "seniorqueryattrflag",-->
+<!--          width: 95,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鐩镐技鏌ヨ灞炴��",-->
+<!--          prop: "samerepeatattrflag",-->
+<!--          width: 95,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "蹇呰緭",-->
+<!--          prop: "requireflag",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "琛ㄥ崟鏄剧ず",-->
+<!--          prop: "formdisplayflag",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍒楄〃鏄剧ず",-->
+<!--          prop: "tabledisplayflag",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍙",-->
+<!--          prop: "readonlyflag",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍒楄〃鎺掑簭",-->
+<!--          prop: "sortattrflag",-->
+<!--          cell: false,-->
+<!--        },-->
+
+<!--        {-->
+<!--          label: "澶氳鏂囨湰",-->
+<!--          prop: "textareaflag",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "榛樿鍊�",-->
+<!--          prop: "defaultvalue",-->
+<!--          sortable: true,-->
+<!--          cell: false,-->
+<!--          width: 95,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍓嶇紑",-->
+<!--          prop: "prefixvalue",-->
+<!--          sortable: true,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍚庣紑",-->
+<!--          prop: "suffixvalue",-->
+<!--          sortable: true,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "缁勫悎瑙勫垯",-->
+<!--          prop: "componentrule",-->
+<!--          sortable: true,-->
+<!--          cell: false,-->
+<!--          width: 105,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "楠岃瘉瑙勫垯",-->
+<!--          prop: "verifyrule",-->
+<!--          sortable: true,-->
+<!--          cell: false,-->
+<!--          width: 105,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鏃堕棿鏍煎紡",-->
+<!--          prop: "codedateformat",-->
+<!--          sortable: true,-->
+<!--          width: 105,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍒嗙被娉ㄥ叆",-->
+<!--          prop: "classifyinvokelevel",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鏋氫妇娉ㄥ叆",-->
+<!--          prop: "enumString",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "绾ц仈灞炴��",-->
+<!--          prop: "parentCode",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍙傜収閰嶇疆",-->
+<!--          prop: "referConfig",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "绾ц仈鏌ヨ灞炴��",-->
+<!--          prop: "parentQueryAttr",-->
+<!--          width: 105,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "閫夋嫨搴撴爣璇�",-->
+<!--          prop: "libraryIdentification",-->
+<!--          width: 105,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "濉啓鎻愮ず",-->
+<!--          prop: "explain",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "琛ㄥ崟鏄剧ず鏍峰紡",-->
+<!--          prop: "formdisplaystyle",-->
+<!--          width: 105,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "琛ㄦ牸鏄剧ず鏍峰紡",-->
+<!--          prop: "tabledisplaystyle",-->
+<!--          width: 105,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "琛ㄥ崟瓒呴摼鎺�",-->
+<!--          prop: "formhref",-->
+<!--          width: 95,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "琛ㄦ牸瓒呴摼鎺�",-->
+<!--          prop: "tablehref",-->
+<!--          width: 95,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "琛ㄦ牸鏄剧ずjs",-->
+<!--          prop: "tabledisplayjs",-->
+<!--          width: 95,-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "闀垮害",-->
+<!--          prop: "controllength",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "灏忔暟绮惧害",-->
+<!--          prop: "precisionlength",-->
+<!--          cell: false,-->
+<!--        },-->
+<!--        {-->
+<!--          label: "鍙栧�艰寖鍥�",-->
+<!--          prop: "valuearea",-->
+<!--          sortable: true,-->
+<!--          cell: false,-->
+<!--          width: 105,-->
+<!--        },-->
+
+<!--      ],-->
+<!--      editingIndex: -1,  // 褰撳墠姝ｅ湪缂栬緫鐨勮鐨勭储寮�-->
+<!--      editingColumn: '',  // 褰撳墠姝ｅ湪缂栬緫鐨勫垪鐨勫睘鎬у悕-->
+<!--      editorModel: []  // 缂栬緫妗嗙殑鏁版嵁锛屼娇鐢ㄦ暟缁勪繚瀛樻瘡涓崟鍏冩牸鐨勬暟鎹�-->
+<!--    };-->
+<!--  },-->
+<!--  created() {-->
+<!--    // 鍦ㄧ粍浠跺垱寤烘椂锛屽垵濮嬪寲缂栬緫妗嗙殑鏁版嵁-->
+<!--    this.editorModel = this.data.map(row => {-->
+<!--      const editorRow = {};-->
+<!--      this.columns.forEach(column => {-->
+<!--        editorRow[column.prop] = row[column.prop];-->
+<!--      });-->
+<!--      return editorRow;-->
+<!--    });-->
+<!--  },-->
+<!--  methods: {-->
+<!--    // 鍗曞厓鏍肩偣鍑讳簨浠跺鐞嗗嚱鏁�-->
+<!--    onCellClick(rowIndex, columnProp) {-->
+<!--      if (this.editingIndex >= 0 && this.editingColumn) {-->
+<!--        this.onEditorBlur(this.editingIndex, this.editingColumn);-->
+<!--        return;-->
+<!--      }-->
+
+<!--      const cellValue = this.data[rowIndex][columnProp];-->
+<!--      if (cellValue === undefined || cellValue === null) {-->
+<!--        this.data[rowIndex][columnProp] = '';-->
+<!--      }-->
+
+<!--      this.editingIndex = rowIndex;-->
+<!--      this.editingColumn = columnProp;-->
+
+<!--      this.$nextTick(() => {-->
+<!--        this.$refs.editor.focus();-->
+<!--      });-->
+<!--    },-->
+
+<!--    // 缂栬緫妗嗗け鐒︿簨浠跺鐞嗗嚱鏁�-->
+<!--    onEditorBlur(rowIndex, columnProp) {-->
+<!--      // 灏嗗綋鍓嶇紪杈戞鐨勬暟鎹繚瀛樺埌琛ㄦ牸鏁版嵁涓�-->
+<!--      const editorValue = this.editorModel[rowIndex][columnProp];-->
+<!--      if (editorValue === '') {-->
+<!--        this.data[rowIndex][columnProp] = undefined;-->
+<!--      } else {-->
+<!--        this.data[rowIndex][columnProp] = editorValue;-->
+<!--      }-->
+
+<!--      this.editingIndex = -1;-->
+<!--      this.editingColumn = '';-->
+<!--    },-->
+<!--    // 鍒ゆ柇鎸囧畾鍗曞厓鏍兼槸鍚﹀湪缂栬緫鐘舵��-->
+<!--    isEditing(rowIndex, columnProp) {-->
+<!--      return rowIndex === this.editingIndex && columnProp === this.editingColumn;-->
+<!--    }-->
+<!--  }-->
+<!--};-->
+<!--</script>-->
+
+
+<style lang="scss">
+//淇敼鍒嗙被娉ㄥ叆瀵硅瘽妗嗗叕鍏辨牱寮�
+.mydialog .el-dialog__body {
+  padding: 10px 20px 30px;
+}
 
 </style>

--
Gitblit v1.9.3