vue2-client 1.8.30 → 1.8.32

package/src/base-client/components/common/CitySelect/index.md

@@ -1,109 +1,109 @@
-# 省市区修改组件
-
-> 下拉框数据从库里查询 divisions_of_china 表
-> 省市区数据存储格式
-
-+---------+-----+------------+--------+--------+----------+
-|code     |name |provinceCode|cityCode|areaCode|parentCode|
-+---------+-----+------------+--------+--------+----------+
-|11       |北京市  |NULL        |NULL    |NULL    |NULL      |
-|1101     |市辖区  |11          |NULL    |NULL    |11        |
-|110101   |东城区  |11          |1101    |NULL    |1101      |
-|110101001|东华门街道|11          |1101    |110101  |1101     |
-|110101002|景山街道 |11          |1101    |110101  |1101      |
-+---------+-----+------------+--------+--------+----------+
-
-
-查询出来之后转成tree 作为数据 (截取了一段数据)
-
-```json
-[
-    {
-        "code": "11",
-        "name": "北京",
-        "label": "北京",
-        "value": "北京",
-        "children":
-        [
-            {
-                "code": "1101",
-                "parentcode": "11",
-                "name": "辖区",
-                "label": "辖区",
-                "value": "辖区",
-                "children":
-                [
-                  {
-                    "code": "110101",
-                    "parentcode": "1101",
-                    "name": "东城区",
-                    "label": "东城区",
-                    "value": "东城区"
-                  }
-                ]}]}]
-```
-
-可传递参数
-```js
-props = {
-    // 页面渲染内容  默认 省市区街道 四个 所以是4
-    contexts: {
-      type: Number,
-      default: 3
-    },
-    placeholder: {
-      type: String,
-      default: '请选择省市区'
-    },
-    // small lage 输入框大小
-    size: {
-      type: String,
-      default: undefined
-    },
-    // 类型 simple / undefined
-    // simple 就是用的 cascader  不穿就是用的 自己封装的
-    type: {
-      type: String,
-      default: undefined
-    },
-    // 框的样式
-    inputStyle: {
-      type: Object,
-      default: () => {
-      }
-    },
-    // 下拉框的样式
-    dropdownStyle: {
-      type: Object,
-      default: () => {
-        return {
-          width: '35rem',
-          padding: '1%'
-        }
-      }
-    },
-    // 标签的样式
-    tagStyle: {
-      type: Object,
-      default: () => {
-        return {
-          fontSize: '0.88rem',
-          width: '23%',
-          textAlign: 'left',
-          margin: '0.5%',
-          cursor: 'pointer'
-        }
-      }
-    },
-    // 用于v-model 绑定
-    value: {
-      type: String,
-      default: undefined
-    },
-    // 用于v-model 绑定 code :最后一级的code  address: 所有级拼接的地址
-    valueType: {
-      type: String,
-      default: 'address'
-    }
-  }
-```
+# 省市区修改组件
+
+> 下拉框数据从库里查询 divisions_of_china 表
+> 省市区数据存储格式
+
++---------+-----+------------+--------+--------+----------+
+|code     |name |provinceCode|cityCode|areaCode|parentCode|
++---------+-----+------------+--------+--------+----------+
+|11       |北京市  |NULL        |NULL    |NULL    |NULL      |
+|1101     |市辖区  |11          |NULL    |NULL    |11        |
+|110101   |东城区  |11          |1101    |NULL    |1101      |
+|110101001|东华门街道|11          |1101    |110101  |1101     |
+|110101002|景山街道 |11          |1101    |110101  |1101      |
++---------+-----+------------+--------+--------+----------+
+
+
+查询出来之后转成tree 作为数据 (截取了一段数据)
+
+```json
+[
+    {
+        "code": "11",
+        "name": "北京",
+        "label": "北京",
+        "value": "北京",
+        "children":
+        [
+            {
+                "code": "1101",
+                "parentcode": "11",
+                "name": "辖区",
+                "label": "辖区",
+                "value": "辖区",
+                "children":
+                [
+                  {
+                    "code": "110101",
+                    "parentcode": "1101",
+                    "name": "东城区",
+                    "label": "东城区",
+                    "value": "东城区"
+                  }
+                ]}]}]
+```
+
+可传递参数
+```js
+props = {
+    // 页面渲染内容  默认 省市区街道 四个 所以是4
+    contexts: {
+      type: Number,
+      default: 3
+    },
+    placeholder: {
+      type: String,
+      default: '请选择省市区'
+    },
+    // small lage 输入框大小
+    size: {
+      type: String,
+      default: undefined
+    },
+    // 类型 simple / undefined
+    // simple 就是用的 cascader  不穿就是用的 自己封装的
+    type: {
+      type: String,
+      default: undefined
+    },
+    // 框的样式
+    inputStyle: {
+      type: Object,
+      default: () => {
+      }
+    },
+    // 下拉框的样式
+    dropdownStyle: {
+      type: Object,
+      default: () => {
+        return {
+          width: '35rem',
+          padding: '1%'
+        }
+      }
+    },
+    // 标签的样式
+    tagStyle: {
+      type: Object,
+      default: () => {
+        return {
+          fontSize: '0.88rem',
+          width: '23%',
+          textAlign: 'left',
+          margin: '0.5%',
+          cursor: 'pointer'
+        }
+      }
+    },
+    // 用于v-model 绑定
+    value: {
+      type: String,
+      default: undefined
+    },
+    // 用于v-model 绑定 code :最后一级的code  address: 所有级拼接的地址
+    valueType: {
+      type: String,
+      default: 'address'
+    }
+  }
+```

package/src/base-client/components/common/CreateQuery/CreateQuery.vue

@@ -15,6 +15,9 @@
           :rules="rules"
           :wrapper-col="wrapperCol"
         >
+          <a-form-model-item label="服务名称" prop="serviceName">
+            <a-input v-model="form.serviceName" placeholder="查询接口所在的服务名称，默认system"/>
+          </a-form-model-item>
           <a-form-model-item label="查询主表名" prop="tableName">
             <a-input v-model="form.tableName" placeholder="查询用的主表+别名，用空格隔开，如：t_userfiles u"/>
           </a-form-model-item>
@@ -68,17 +71,17 @@
               <a-button icon="import" @click="$message.warn('从创意库中选择并引用高质量的通用表单项配置，敬请期待')">从创意库引入</a-button>
             </a-space>
             <a-row :gutter="24">
-              <a-col :span="6">
+              <a-col :span="8">
                 <span style="font-weight: bold">
                   标签名
                 </span>
               </a-col>
-              <a-col :span="6">
+              <a-col :span="7">
                 <span style="font-weight: bold">
                   字段名
                 </span>
               </a-col>
-              <a-col :span="10">
+              <a-col :span="7">
                 <span style="font-weight: bold">
                   数据模式
                 </span>
@@ -102,17 +105,17 @@
                 <span class="dragTips">拖到此处放置</span>
               </a-row>
               <a-row :gutter="24" class="column_item">
-                <a-col :span="6">
+                <a-col :span="7">
                   <span style="font-weight: bold">
                     {{ columnItem.title }}
                   </span>
                 </a-col>
-                <a-col :span="6">
+                <a-col :span="7">
                   <span style="font-weight: bold">
                     {{ columnItem.key }}
                   </span>
                 </a-col>
-                <a-col :span="10">
+                <a-col :span="8">
                   <a-tooltip>
                     <template slot="title">
                       查询表单项
@@ -145,13 +148,7 @@
                   </a-tooltip>
                   <a-tooltip>
                     <template slot="title">
-                      Excel导入项
-                    </template>
-                    <a-tag :color="columnItem.dataModeArray.includes('excelImportItem') ? '#107C41' : 'rgba(0, 0, 0, 0.25)'"><a-icon type="file-excel" /></a-tag>
-                  </a-tooltip>
-                  <a-tooltip>
-                    <template slot="title">
-                      数据组
+                      字段组存储
                     </template>
                     <a-tag :color="columnItem.dataModeArray.includes('group') ? '#82A0D8' : 'rgba(0, 0, 0, 0.25)'"><a-icon type="crown" /></a-tag>
                   </a-tooltip>
@@ -228,14 +225,14 @@
       </template>
       <x-form-table
         :queryParamsJson="result"
-        :view-mode="true"
-        :service-name="serviceName">
+        :view-mode="true">
       </x-form-table>
     </a-modal>
   </a-drawer>
 </template>
 
 <script>
+import XFormItem from '@vue2-client/base-client/components/common/XForm/XFormItem'
 import XFormTable from '@vue2-client/base-client/components/common/XFormTable/XFormTable'
 import JsonViewer from 'vue-json-viewer'
 import FileSaver from 'file-saver'
@@ -247,7 +244,8 @@ export default {
   components: {
     CreateQueryItem,
     JsonViewer,
-    XFormTable
+    XFormTable,
+    XFormItem
   },
   data () {
     return {
@@ -268,6 +266,7 @@ export default {
       labelCol: { span: 3 },
       wrapperCol: { span: 18 },
       form: {
+        serviceName: '',
         tableName: '',
         joinArray: {},
         condition: {},
@@ -344,14 +343,6 @@ export default {
     toEditJson: {
       type: Object,
       default: () => {}
-    },
-    saveExportJson: {
-      type: Boolean,
-      default: false
-    },
-    serviceName: {
-      type: String,
-      default: undefined
     }
   },
   watch: {
@@ -389,8 +380,27 @@ export default {
           }, this.toEditJson
         )
         for (const columnItem of this.form.column) {
+          // 数据模式兼容性处理
           if (!(columnItem.dataMode || columnItem.dataModeArray)) {
             columnItem.dataModeArray = ['queryForm', 'table', 'addOrEditForm', 'sqlQueryItem', 'sqlQueryCondition']
+          } else if (columnItem.dataMode) {
+            if (columnItem.dataMode === 'all') {
+              columnItem.dataModeArray = ['queryForm', 'table', 'addOrEditForm', 'sqlQueryItem', 'sqlQueryCondition']
+            } else if (columnItem.dataMode === 'form') {
+              columnItem.dataModeArray = ['queryForm', 'addOrEditForm', 'sqlQueryCondition']
+            } else if (columnItem.dataMode === 'table') {
+              columnItem.dataModeArray = ['table', 'sqlQueryItem']
+            } else if (columnItem.dataMode === 'table_form') {
+              columnItem.dataModeArray = ['table', 'sqlQueryItem', 'sqlQueryCondition']
+            } else if (columnItem.dataMode === 'only_form') {
+              columnItem.dataModeArray = ['queryForm']
+            } else if (columnItem.dataMode === 'only_table') {
+              columnItem.dataModeArray = ['table']
+            } else if (columnItem.dataMode === 'clear') {
+              columnItem.dataModeArray = ['sqlQueryItem', 'sqlQueryCondition']
+            } else if (columnItem.dataMode === 'only_add_modify') {
+              columnItem.dataModeArray = ['addOrEditForm', 'sqlQueryItem']
+            }
           }
           delete columnItem.dataMode
           // 插槽兼容处理
@@ -474,7 +484,6 @@ export default {
       this.result = {}
     },
     onClose () {
-      this.$emit('close')
       this.$emit('update:visible', false)
     },
     onModelClose () {
@@ -493,7 +502,7 @@ export default {
     },
     itemHandle (item, type) {
       this.itemMap[item.key] = item
-      if (this.type === '新增') {
+      if (type === '新增') {
         this.form.column.push(item)
       } else {
         this.$set(this.form.column, this.selectIndex, item)
@@ -509,7 +518,6 @@ export default {
       this.$refs.queryItem.addColumnItemExecute()
     },
     editColumnItem (key, index) {
-      this.type = '修改'
       if (this.itemMap[key]) {
         this.$refs.queryItem.editColumnItemExecute(this.itemMap[key])
         this.selectIndex = index
@@ -600,11 +608,8 @@ export default {
       this.$refs.businessCreateForm.validate(valid => {
         if (valid) {
           this.viewHandle(() => {
-            if (this.saveExportJson) {
-              this.exportJson()
-            } else {
-              this.$emit('saveQueryParams', this.result)
-            }
+            // saveQueryParams
+            this.exportJson()
           })
         }
       })

package/src/base-client/components/common/CreateQuery/CreateQueryItem.vue

@@ -311,7 +311,7 @@
           <a-card :bodyStyle="bodyStyle" title="数据字段">
             <a-button type="primary" slot="extra" @click="addColumnItem()">增加</a-button>
             <a-row :gutter="24">
-              <a-col :span="7">
+              <a-col :span="8">
                 <span style="font-weight: bold">
                   标签名
                 </span>
@@ -321,7 +321,7 @@
                   字段名
                 </span>
               </a-col>
-              <a-col :span="8">
+              <a-col :span="7">
                 <span style="font-weight: bold">
                   数据模式
                 </span>
@@ -388,13 +388,7 @@
                   </a-tooltip>
                   <a-tooltip>
                     <template slot="title">
-                      Excel导入项
-                    </template>
-                    <a-tag :color="columnItem.dataModeArray && columnItem.dataModeArray.includes('excelImportItem') ? '#107C41' : 'rgba(0, 0, 0, 0.25)'"><a-icon type="file-excel" /></a-tag>
-                  </a-tooltip>
-                  <a-tooltip>
-                    <template slot="title">
-                      数据组
+                      字段JSON存储
                     </template>
                     <a-tag :color="columnItem.dataModeArray && columnItem.dataModeArray.includes('group') ? '#82A0D8' : 'rgba(0, 0, 0, 0.25)'"><a-icon type="crown" /></a-tag>
                   </a-tooltip>
@@ -434,12 +428,6 @@
         show-icon
         style="margin-top: 5px"
         type="info"/>
-      <a-alert
-        v-if="item.title.length > 8"
-        message="提示：标签名称过长可能会影响表格列展示效果，建议不超过8个字符"
-        show-icon
-        style="margin-top: 5px"
-        type="warning"/>
     </a-form-model>
     <create-query-item ref="queryItem" @getColumn="getColumnItem" @itemHandle="itemHandleItem"/>
   </a-modal>
@@ -483,7 +471,7 @@ export default {
     },
     // 字段名称是否禁用
     keyDisabled () {
-      return this.item.formType === 'file' || this.item.formType === 'image' || this.dataMode.mixinTableName
+      return this.item.formType === 'file' || this.item.formType === 'image'
     },
     // 数据模式是否禁用
     dataModeDisabled () {
@@ -495,10 +483,7 @@ export default {
         table: false,
         addOrEditForm: false,
         sqlQueryItem: false,
-        sqlQueryCondition: false,
-        excelImportItem: false,
-        group: false,
-        mixinTableName: false
+        sqlQueryCondition: false
       }
       for (const item of this.dataModeArrayData) {
         result[item] = true
@@ -517,24 +502,10 @@ export default {
           value: 'sqlQueryItem',
           noMatch: ['file', 'personSetting']
         }, {
-          label: '字段组存储',
-          value: 'group',
-          noMatch: []
-        }]
-      }
-      if (this.dataModeArrayData.includes('mixinTableName')) {
-        return [
-          {
-            label: '渲染查询表单项',
-            value: 'queryForm',
-            noMatch: ['file', 'image', 'textarea', 'personSetting']
-          },
-          {
-            label: '动态表名参数',
-            value: 'mixinTableName',
+            label: '字段组存储',
+            value: 'group',
             noMatch: []
-          }
-        ]
+        }]
       }
       if (this.item.formType) {
         return dataModeType.filter(item => {
@@ -610,40 +581,8 @@ export default {
       // 必填控制
       itemRules: {
         formType: [{ required: true, message: '请输入表单类型', trigger: 'change' }],
-        key: [{
-          required: true,
-          validator: (rule, value, callback) => {
-            // 判断必填
-            if (!value) {
-              callback(new Error('请输入字段名称'))
-            } else {
-              // 判断必须全部小写 并且不能包含空格
-              if (value !== value.toLowerCase() || value.indexOf(' ') !== -1 && !value === '_mixinTableName_') {
-                callback(new Error('字段名称必须全部小写，且不能包含空格'))
-              } else {
-                callback()
-              }
-            }
-          },
-          trigger: 'blur'
-        }],
-        title: [{
-          required: true,
-          validator: (rule, value, callback) => {
-            // 判断必填
-            if (!value) {
-              callback(new Error('请输入标签名称'))
-            } else {
-              // // 大于8个字符给提示
-              // if (value.length > 8) {
-              //   callback(new Error('标签名称过长，建议不超过8个字符，可能会影响展示效果'))
-              // } else {
-              callback()
-              // }
-            }
-          },
-          trigger: 'blur'
-        }],
+        key: [{ required: true, message: '请输入字段名称', trigger: 'blur' }],
+        title: [{ required: true, message: '请输入标签名称', trigger: 'blur' }],
         selectType: [{ required: true, message: '请选择数据源类型', trigger: 'change' }],
         selectKey: [{ required: true, message: '请输入数据源内容', trigger: 'blur' }],
         'slot.value': [{ required: true, message: '请输入文本溢出上限长度', trigger: 'blur' }],
@@ -676,7 +615,6 @@ export default {
         rule: {
           required: 'false'
         },
-        column: [],
         selectKey: undefined,
         queryType: '=',
         formType: 'input',
@@ -704,7 +642,7 @@ export default {
     // 编辑数据字段前准备数据
     editColumnItemExecute (_item) {
       this.type = '修改'
-      const defaultValue = { formType: 'input', type: 'string', addOrEdit: 'all', slot: { type: 'default' }, rule: {}, selectKey: {}, column: [] }
+      const defaultValue = { formType: 'input', type: 'string', addOrEdit: 'all', slot: { type: 'default' }, rule: {}, selectKey: {} }
       if (!_item.queryType) {
         defaultValue.queryType = '='
       }
@@ -828,12 +766,6 @@ export default {
     },
     // 数据模式改变
     dataModeArrayDataChange (newVal) {
-      if (newVal.includes('mixinTableName')) {
-        this.item.key = '_mixinTableName_'
-        this.dataModeArrayData = ['queryForm', 'mixinTableName']
-      } else if (this.item.key === '_mixinTableName_') {
-        this.item.key = ''
-      }
       if (newVal.includes('group')) {
         this.dataModeArrayData = ['sqlQueryItem', 'group']
       }
@@ -983,7 +915,7 @@ export default {
     },
     itemHandleItem (item, type) {
       this.itemMap[item.key] = item
-      if (this.type === '新增') {
+      if (type === '新增') {
         this.item.column.push(item)
       } else {
         this.$set(this.item.column, this.selectIndex, item)