ap-dev 1.2.23 → 1.2.25

package/dev/DbDesignPanel/DevDbTable.vue

@@ -62,12 +62,12 @@
 
         <!--选择字段-->
         <el-dialog title="选择字段" :visible.sync="fieldDialogVisible" width="60%">
-            <dev-db-table-dialog @dataChange="dataChangeEvent"/>
+            <dev-db-table-dialog @dataChange="dataChangeEvent" style="height: 400px"/>
 
             <span slot="footer" class="dialog-footer">
-        <el-button @click="fieldDialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="selectField">确 定</el-button>
-      </span>
+                <el-button @click="fieldDialogVisible = false">取 消</el-button>
+                <el-button type="primary" @click="selectField">确 定</el-button>
+           </span>
         </el-dialog>
     </ap-container>
 </template>
@@ -241,7 +241,7 @@ export default {
                     this.fieldDialogVisible = true
                 }
             },
-            'edit', 'del', 'cancel', 'refresh', 'save', 'separator',
+            'edit', 'del', 'refresh', 'save', 'separator',
             {
                 btnType: 'primary',
                 text: '上移',
@@ -359,9 +359,22 @@ export default {
         },
     },
     created() {
+        this.getSchema();
         this.loadTreeData();
     },
     methods: {
+        getSchema() {
+            this.$request({
+                url: '/apd/db/DevDbTable/getSchema',
+                method: 'post',
+                data: {
+                    sourceId: this.userConfig.fdSourceId
+                }
+            }).then(response => {
+                this.tableSchema = response.data;
+                this.headerName = "[" + response.data + "] - 表";
+            })
+        },
         // 左侧树：加载数据
         loadTreeData() {
             this.loadingTreeFlag = true
@@ -377,10 +390,6 @@ export default {
                     parentKey: "fdParentId",
                     childrenKey: "children",
                 });
-                if (this.typeTreeList.length > 0) {
-                    this.tableSchema = this.typeTreeList[0].tableSchema;
-                    this.headerName = "[" + this.typeTreeList[0].tableSchema + "] - 表";
-                }
             }).finally(() => {
                 this.loadingTreeFlag = false
             })
@@ -714,7 +723,7 @@ export default {
                 2、多字段：选择多个字段组成联合索引。("idx_multi"开头)<br>
                 <b>三、唯一索引：</b><br>
                 1、单字段：索引的值必须唯一，NULL可以出现多次。("idx_pk_single"开头)<br>
-                2、多字段：选择多个字段组成联合唯一索引。("idx_pk_single"开头)<br>
+                2、多字段：选择多个字段组成联合唯一索引。("idx_pk_multi"开头)<br>
                 `
             this.$alert(msg, '索引说明', {dangerouslyUseHTMLString: true})
         }

package/dev/DbDesignPanel/DevDbTableDialog.vue

@@ -1,233 +1,301 @@
 <template>
-  <ap-container style="height: 500px;">
-    <ap-aside margin="0000">
-      <div class="layout-aside-header">
-        <div class="layout-aside-header-title">
-          字段类型
-        </div>
-      </div>
-      <div v-loading="loadingTreeFlag" class="layout-aside-content">
-        <el-input v-model="filterText" placeholder="关键字过滤" />
-
-        <el-tree
-          ref="typeTree"
-          class="filter-tree"
-          node-key="fdId"
-          :data="typeTreeList"
-          :props="defaultProps"
-          default-expand-all
-          show-checkbox
-          :check-on-click-node="true"
-          :highlight-current="true"
-          :expand-on-click-node="false"
-          :check-strictly="false"
-          :filter-node-method="filterNode"
-          @check="nodeClickEvent"
-        />
-      </div>
-    </ap-aside>
     <ap-container>
-      <ap-header>
-        <el-form
-          ref="searchFormRef"
-          :model="searchForm"
-          :inline="true"
-          class="layout-header-form"
-        >
-          <el-form-item label="搜索:" class="layout-header-form-item" prop="likeStr">
-            <el-input v-model="searchForm.likeStr" placeholder="字段名/注释" />
-          </el-form-item>
-        </el-form>
-        <el-button type="primary" @click="searchEvent">查询</el-button>
-      </ap-header>
-      <ap-main>
-        <ap-table ref="devDbFieldGrid" :options.sync="tableOpt" />
-      </ap-main>
+        <ap-aside margin="0000">
+            <ap-aside-tree ref="typeTree" :options.sync="treeOptions">
+                <el-form slot="form" ref="tDevDbFieldType" :inline="true" label-width="80px"
+                         :model="tDevDbFieldTypeForm" :rules="tDevDbFieldTypeRules">
+                    <el-form-item label="父类别">
+                        <el-select v-model="tDevDbFieldTypeForm.fdParentId" filterable placeholder="请选择父节点">
+                            <el-option label="无" value=""/>
+                            <el-option v-for="item in typeList" :key="item.fdId" :label="item.fdName" :value="item.fdId"/>
+                        </el-select>
+                    </el-form-item>
+
+                    <el-form-item label="类别名称" prop="fdName">
+                        <el-input v-model="tDevDbFieldTypeForm.fdName"/>
+                    </el-form-item>
+
+                    <el-form-item label="排序" prop="fdSort">
+                        <el-input-number v-model="tDevDbFieldTypeForm.fdSort" controls-position="right"/>
+                    </el-form-item>
+                </el-form>
+
+                <span slot="tree" slot-scope="scope">
+                    {{ scope.data.fdName }}
+                </span>
+            </ap-aside-tree>
+        </ap-aside>
+        <ap-container>
+            <ap-header margin="0000" style="padding: 0">
+                <el-form ref="searchFormRef" :model="searchForm" :inline="true" class="layout-header-form">
+                    <el-form-item label="" class="layout-header-form-item" prop="likeStr">
+                        <el-input v-model="searchForm.likeStr" placeholder="字段名/注释，模糊匹配"/>
+                    </el-form-item>
+                </el-form>
+                <el-button type="primary" @click="searchEvent">查询</el-button>
+            </ap-header>
+            <ap-main margin="0000" style="padding: 0">
+                <ap-table ref="devDbFieldGrid" :options.sync="tableOpt"/>
+            </ap-main>
+        </ap-container>
+
     </ap-container>
-  </ap-container>
 </template>
 
 <script>
+
 export default {
-  name: 'DevDbTableDialog',
-  data() {
-    const columns = [
-      {
-        prop: 'fdFieldTypeId',
-        label: '字段类型',
-        type: 'select',
-        selectOptionsRemote: 'typeList',
-        selectOptionsKey: { label: 'fdName', value: 'fdId' }
-      },
-      {
-        prop: 'fdName',
-        label: '字段名称',
-        type: 'input'
-      },
-      {
-        prop: 'fdComment',
-        label: '默认注释',
-        type: 'input'
-      }, {
-        prop: 'fdDataType',
-        label: '数据类型',
-        type: 'select',
-        selectOptions: [
-          {
-            label: '常用',
-            options: [
-              { label: 'char(255)', value: 'char' },
-              { label: 'varchar(6.5万)', value: 'varchar' },
-              { label: 'tinyint(255)', value: 'tinyint' },
-              { label: 'datetime(年月日时分秒)', value: 'datetime' }
-            ]
-          },
-          {
-            label: '字符串',
-            options: [
-              { label: 'char(255)', value: 'char' },
-              { label: 'varchar(6.5万)', value: 'varchar' },
-              { label: 'text(长文本)', value: 'text' }
-            ]
-          },
-          {
-            label: '整型数值',
-            options: [
-              { label: 'tinyint(255)', value: 'tinyint' },
-              { label: 'smallint(6.5万)', value: 'smallint' },
-              { label: 'mediumint(1.6千万)', value: 'mediumint' },
-              { label: 'int(4.2亿)', value: 'int' },
-              { label: 'bigint(极大)', value: 'bigint' }
-            ]
-          },
-          {
-            label: '浮点数值',
-            options: [
-              { label: 'float(单精度)', value: 'float' },
-              { label: 'double(双精度)', value: 'double' },
-              { label: 'decimal(小数值)', value: 'decimal' }
-            ]
-          },
-          {
-            label: '日期时间',
-            options: [
-              { label: 'date(年月日)', value: 'date' },
-              { label: 'time(时分秒)', value: 'time' },
-              { label: 'year(年)', value: 'year' },
-              { label: 'datetime(年月日时分秒)', value: 'datetime' },
-              { label: 'timestamp(时间戳)', value: 'timestamp' }
-            ]
-          }
-        ],
-        selectFilterable: true,
-        selectIsGroup: true,
-        selectPlaceholder: '选择数据类型'
-      }, {
-        prop: 'fdSort',
-        label: '排序',
-        type: 'inputNumber'
-      }]
-    const tableOpt = {
-      title: '字段列表',
-      columns: columns,
-      dataUrl: '/apd/db/DevDbField/getTDevDbFieldGridList',
-      initData: true,
-      params: () => {
-        return {
-          fdFieldTypeIds: this.selectedFieldTypeIds,
-          likeStr: this.searchForm.likeStr
+    name: 'DevDbTableDialog',
+    data() {
+        const columns = [
+            {
+                prop: 'fdFieldTypeId',
+                label: '字段所属分组',
+                type: 'select',
+                addDefaultValue: this.addDefaultValueFn,
+                selectOptionsRemote: 'typeList',
+                selectOptionsKey: {label: 'fdName', value: 'fdId'},
+                rules: [
+                    {required: true, message: '请选择分组'}
+                ]
+            },
+            {
+                prop: 'fdName',
+                label: '字段名称',
+                type: 'input',
+                rules: [
+                    {required: true, message: '字段名称必填'},
+                    {min: 1, max: 30, message: '长度在 1 到 30 个字符'}
+                ]
+            },
+            {
+                prop: 'fdComment',
+                label: '默认注释',
+                type: 'input',
+                rules: [
+                    {required: true, message: '字段注释必填'},
+                    {min: 1, max: 30, message: '长度在 1 到 30 个字符'}
+                ]
+            }, {
+                prop: 'fdDataType',
+                label: '数据类型',
+                type: 'select',
+                selectOptions: [
+                    {
+                        label: '常用',
+                        options: [
+                            {label: 'char(255)', value: 'char'},
+                            {label: 'varchar(6.5万)', value: 'varchar'},
+                            {label: 'tinyint(255)', value: 'tinyint'},
+                            {label: 'datetime(年月日时分秒)', value: 'datetime'}
+                        ]
+                    },
+                    {
+                        label: '字符串',
+                        options: [
+                            {label: 'char(255)', value: 'char'},
+                            {label: 'varchar(6.5万)', value: 'varchar'},
+                            {label: 'text(长文本)', value: 'text'}
+                        ]
+                    },
+                    {
+                        label: '整型数值',
+                        options: [
+                            {label: 'tinyint(255)', value: 'tinyint'},
+                            {label: 'smallint(6.5万)', value: 'smallint'},
+                            {label: 'mediumint(1.6千万)', value: 'mediumint'},
+                            {label: 'int(4.2亿)', value: 'int'},
+                            {label: 'bigint(极大)', value: 'bigint'}
+                        ]
+                    },
+                    {
+                        label: '浮点数值',
+                        options: [
+                            {label: 'float(单精度)', value: 'float'},
+                            {label: 'double(双精度)', value: 'double'},
+                            {label: 'decimal(小数值)', value: 'decimal'}
+                        ]
+                    },
+                    {
+                        label: '日期时间',
+                        options: [
+                            {label: 'date(年月日)', value: 'date'},
+                            {label: 'time(时分秒)', value: 'time'},
+                            {label: 'year(年)', value: 'year'},
+                            {label: 'datetime(年月日时分秒)', value: 'datetime'},
+                            {label: 'timestamp(时间戳)', value: 'timestamp'}
+                        ]
+                    }
+                ],
+                selectFilterable: true,
+                selectIsGroup: true,
+                selectPlaceholder: '选择数据类型',
+                rules: [
+                    {required: true, message: '数据类型必选'}
+                ]
+            }, {
+                prop: 'fdSort',
+                label: '排序',
+                type: 'inputNumber',
+                inputNumberMin: 0,
+                // inputNumberMax: 10,
+                hide: true,
+                sortable: true,
+                rules: [
+                    {required: true, message: '请输入排序'}
+                ],
+                addDefaultValue: 0
+            }, {
+                prop: 'fdDeleted',
+                label: '删除',
+                type: 'input',
+                hide: true,
+                addDefaultValue: 0
+            }]
+        let tools = ['add', 'edit', 'del', 'cancel', 'refresh', 'save', 'separator',
+            {
+                btnType: 'primary',
+                text: '上移',
+                icon: 'el-icon-top',
+                onClick: () => {
+                    this.sortBefore()
+                }
+            },
+            {
+                btnType: 'primary',
+                text: '下移',
+                icon: 'el-icon-bottom',
+                onClick: () => {
+                    this.sortAfter()
+                }
+            },
+            {
+                btnType: 'primary',
+                text: '一键排序',
+                icon: 'el-icon-s-operation',
+                onClick: () => {
+                    this.doSortByIndex()
+                }
+            }]
+        const tableOpt = {
+            title: '字段列表',
+            columns: columns,
+            pagination: {
+                pageSizes: [30, 60, 90],
+                pageSize: 30
+            },
+            dataUrl: '/apd/db/DevDbField/getTDevDbFieldGridList',
+            saveUrl: '/apd/db/DevDbField/saveTDevDbFieldGridData',
+            editPk: 'fdId',
+            deletePk: 'fdId',
+            deleteUrl: '/apd/db/DevDbField/deleteTDevDbFieldByFdId',
+            toolbarBtn: ['add', 'edit', 'del', 'refresh', 'save'],
+            initData: false,
+            beforeAdd: this.beforeAddFn,
+            params: () => {
+                return {
+                    fdFieldTypeIds: this.selectedFieldTypeIds,
+                    likeStr: this.searchForm.likeStr
+                }
+            },
+            selectionChangeEvent: selection => {
+                // 返回给父节点
+                this.$emit('dataChange', selection)
+            }
         }
-      },
-      selectionChangeEvent: selection => {
-        // 返回给父节点
-        this.$emit('dataChange', selection)
-      }
-    }
 
-    return {
-      // ----- 左侧树 -----
-      selectedFieldTypeIds: '',
-      loadingTreeFlag: false,
-      filterText: '',
-      typeTreeList: [],
-      defaultProps: {
-        children: 'children',
-        label: 'fdName'
-      },
-      // ----- 表格 -----
-      searchForm: {
-        listStr: ''
-      },
-      tableOpt: tableOpt
-    }
-  },
-  watch: {
-    filterText(val) {
-      this.$refs.typeTree.filter(val)
-    }
-  },
-  created() {
-    this.loadTreeData()
-  },
-  methods: {
-    // 左侧树：加载数据
-    loadTreeData() {
-      this.loadingTreeFlag = true
-      this.$request({
-        url: '/apd/db/DevDbField/getDbFieldTypeList',
-        method: 'post'
-      }).then(response => {
-        this.typeList = JSON.parse(JSON.stringify(response.data))
-        this.typeTreeList = this.handelTreeData(response.data)
-      }).finally(() => {
-        this.loadingTreeFlag = false
-      })
-    },
-    // 左侧树：初始化数据
-    initTreeData() {
-      // 重置当前选择节点
-      this.$refs.typeTree.setCurrentKey()
-      this.loadTreeData()
-    },
-    // 左侧树：过滤节点
-    filterNode(value, data) {
-      if (!value) return true
-      return data.fdName.indexOf(value) !== -1
+        return {
+            // ----- 左侧树 -----
+            typeTreeList: [],
+            selectedFieldTypeIds: '',
+            treeOptions: this.getTreeOption(),
+            tDevDbFieldTypeForm: {
+                fdName: '',
+                fdParentId: '',
+                fdId: '',
+                fdSort: undefined
+            },
+            tDevDbFieldTypeRules: {},
+
+            // ----- dialog -----
+            typeList: [],
+            dialogVisible: false,
+            dialogTitle: '', // dialog标题
+            isAddDialog: true, // 添加类型dialog
+            dialogForm: {
+                fdName: '',
+                fdParentId: '',
+                fdId: '',
+                fdSort: undefined
+            },
+            dialogFormRules: {
+                fdSort: [
+                    {type: 'number', message: '请输入数字', trigger: 'change'}
+                ],
+                fdName: [
+                    {required: true, message: '请输入类型名称', trigger: 'blur'},
+                    {min: 1, max: 10, message: '长度在 1 到 10 个字符', trigger: 'blur'}
+                ]
+            },
+            // ----- 表格 -----
+            searchForm: {
+                listStr: ''
+            },
+            tableOpt: tableOpt
+        }
     },
-    // 选择勾选事件
-    nodeClickEvent(data, node, comp) {
-      const parentKeys = this.$refs.typeTree.getHalfCheckedKeys()
-      const selectKeys = this.$refs.typeTree.getCheckedKeys(false)
-      this.selectedFieldTypeIds = parentKeys.concat(selectKeys).join(',')
-      this.$refs.devDbFieldGrid.refresh()
+    created() {
     },
-    // 左侧树：转换成tree要求的数据格式
-    handelTreeData(data) {
-      const newList = []
-      for (let i = 0; i < data.length; i++) {
-        const fdParentId = data[i].fdParentId
-        // 根节点
-        if (!fdParentId) {
-          newList.push(data[i])
-        } else {
-          // 子节点
-          for (let j = 0; j < data.length; j++) {
-            // 查找父节点
-            if (data[j].fdId == fdParentId) {
-              if (!data[j].children) {
-                data[j].children = []
-              }
-              data[j].children.push(data[i])
+    methods: {
+        // 左侧树：配置
+        getTreeOption() {
+            let treeOptions = {
+                title: "字段分组",
+                toolbarBtn: [],
+                dialogTitle: "数据库字段分组",
+                showCheckbox: true,
+                defaultExpandAll: true,
+                onCheck: (data, node, comp, halfCheckedKeys, checkedKeys) => {
+                    let treeRef = this.$refs.typeTree.getTreeRef();
+                    const parentKeys = treeRef.getHalfCheckedKeys()
+                    const selectKeys = treeRef.getCheckedKeys(false)
+                    this.selectedFieldTypeIds = parentKeys.concat(selectKeys).join(',')
+                    this.$refs.devDbFieldGrid.refresh()
+                },
+                loadOptions: {
+                    url: "/apd/db/DevDbField/getDbFieldTypeList",
+                    treeKey: {
+                        idKey: "fdId",
+                        parentKey: "fdParentId",
+                        childrenKey: "children",
+                        label: "fdName"
+                    },
+                    success: (response) => {
+                        this.typeList = JSON.parse(JSON.stringify(response.data))
+                    },
+                },
+            };
+
+            return treeOptions;
+        },
+
+        // 添加行：数据类型默认值
+        beforeAddFn() {
+            const fdFieldTypeIds = this.selectedFieldTypeIds
+            if (fdFieldTypeIds == null || fdFieldTypeIds == '') {
+                this.$message.error(`请先选择字段类型！`)
+                return false
             }
-          }
+            return true
+        },
+        addDefaultValueFn() {
+            let currentNode = this.$refs.typeTree.getTreeRef().getCurrentNode() || {}
+            return currentNode.fdId
+        },
+        searchEvent() {
+            this.$refs.devDbFieldGrid.refresh()
         }
-      }
-      return newList
-    },
-    searchEvent() {
-      this.$refs.devDbFieldGrid.refresh()
     }
-  }
 }
 </script>