three-trees-ui 1.0.10 → 1.0.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "three-trees-ui",
-  "version": "1.0.10",
+  "version": "1.0.12",
   "publicPath": "/ui",
   "author": "hotent",
   "private": false,

package/packages/CustomDialog/src/customDialog.vue

@@ -7,7 +7,7 @@
       :before-close="dialogCancel"
       append-to-body
       top="6vh"
-      width="60%"
+      width="75%"
       @opened="afterOpen"
     >
       <el-container :style="style" style="overflow: auto">
@@ -46,13 +46,15 @@
               :key="index"
               class="search-item"
             >
-              <p style="font-size: 14px">{{ condition.comment }}:</p>
+              <p :title="condition.comment">{{ condition.comment }}:</p>
               <!-- input输入框 -->
-              <div v-if="condition.controllerType == '1'">
+              <div
+                v-if="condition.controllerType == '1'"
+                class="search-item_main"
+              >
                 <el-input
                   v-model="queryParams[index][condition.field]"
                   size="small"
-                  style="width: 180px; padding: 10px 0; margin: 0 5px 0 5px"
                   clearable
                   :placeholder="placeholders[index]"
                   prefix-icon="el-icon-search"
@@ -62,7 +64,7 @@
               <!-- 单选按钮 -->
               <div
                 v-if="condition.controllerType == '2'"
-                style="margin-right: 10px"
+                class="search-item_main"
               >
                 <el-radio
                   v-for="(itemR, $index1) in condition.config.options"
@@ -75,8 +77,8 @@
               </div>
               <!-- 下拉框 -->
               <div
+                class="search-item_main"
                 v-if="condition.controllerType == '3'"
-                style="margin-right: 10px"
               >
                 <!-- 静态选项 -->
                 <ht-select
@@ -97,7 +99,7 @@
               <!-- 标签 -->
               <div
                 v-if="condition.controllerType == '4'"
-                style="margin-right: 10px"
+                class="search-item_main"
               >
                 <eip-tag
                   v-model="queryParams[index][condition.field]"
@@ -110,10 +112,13 @@
               <!-- 日期 -->
               <div
                 v-if="condition.controllerType == '6'"
-                style="margin-right: 10px"
+                class="search-item_main"
               >
                 <!-- 根据日期的条件类型来判断展示单个日期还是日期范围 -->
-                <div v-if="condition.condition == 'BETWEEN'">
+                <div
+                  v-if="condition.condition == 'BETWEEN'"
+                  class="search-item_date"
+                >
                   <ht-date
                     v-model="queryParams[index].startDate"
                     :format="condition.config.inputFormat"
@@ -136,7 +141,7 @@
               <!-- 选择器 -->
               <div
                 v-if="condition.controllerType == '7'"
-                style="margin-right: 10px"
+                class="search-item_main"
               >
                 <ht-user-selector-input
                   v-model="queryParams[index].selectName"
@@ -202,7 +207,7 @@
               <!-- 对话框 -->
               <div
                 v-if="condition.controllerType == '5'"
-                style="margin-right: 10px"
+                class="search-item_main"
               >
                 <ht-custom-dialog
                   v-model="queryParams[index][condition.field]"
@@ -986,7 +991,9 @@
             if (
               this.jumpParamKey &&
               this.isHaveJumpUrl &&
-              this.modelName == 'data.' + con['target'][0]
+              (this.modelName == 'data.' + con['target'][0] ||
+                (this.modelName.includes('item.') &&
+                  con['target'][0].endsWith(this.modelName.split('.')[1])))
             ) {
               val += `${item[con.from]}¯${this.jumpParamKey}:${
                 this.selectOrgs[index][this.jumpParamKey]
@@ -1647,11 +1654,17 @@
               if (
                 this.jumpParamKey &&
                 this.isHaveJumpUrl &&
-                this.modelName == 'data.' + con['target'][0]
+                (this.modelName == 'data.' + con['target'][0] ||
+                  (this.modelName.includes('item.') &&
+                    con['target'][0].endsWith(this.modelName.split('.')[1])))
               ) {
+                // 需根据key 找到对应 返回数据的返回名称
+                let returnMapKey = returnStr.find((k) => {
+                  return k.field == this.jumpParamKey
+                }).comment
                 val += `${decodeURIComponent(item[from])}¯${
                   this.jumpParamKey
-                }:${item[this.jumpParamKey]},`
+                }:${item[returnMapKey]},`
               } else {
                 val += decodeURIComponent(item[from]) + ','
               }
@@ -2046,19 +2059,56 @@
     margin-top: 10px;
   }
 
-  .middle-header {
+  ::v-deep .middle-header {
     height: unset !important;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
+    padding-top: 15px;
     .search-item {
       display: flex;
       // width: 33.33%;
-      margin-right: 12px;
+      margin-right: 10px;
       align-items: center;
-    }
-    .btn-wrap {
-      line-height: 50px;
+      width: 374px;
+      margin-bottom: 15px;
+      > p {
+        margin: 0;
+        padding: 0;
+        width: 100px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        text-align: right;
+        margin-right: 5px;
+        font-size: 14px;
+      }
+      .search-item_main {
+        flex: 1;
+        overflow: hidden;
+        .inputs.ht-form-inputs__inline {
+          width: 100%;
+          .inputs.ht-form-inputs__inline {
+            width: 100%;
+          }
+        }
+
+        > .el-input {
+          width: 100%;
+        }
+        .search-item_date {
+          display: flex;
+          align-items: center;
+          width: 100%;
+          .inputs.ht-form-inputs__inline {
+            flex: 1;
+          }
+        }
+        .el-date-editor.el-input,
+        .el-date-editor.el-input__inner {
+          width: 100%;
+        }
+      }
     }
   }
 

package/packages/CustomDialog/src/customMobileDialog.vue

@@ -938,7 +938,9 @@
             if (
               this.jumpParamKey &&
               this.isHaveJumpUrl &&
-              this.modelName == 'data.' + con['target'][0]
+              (this.modelName == 'data.' + con['target'][0] ||
+                (this.modelName.includes('item.') &&
+                  con['target'][0].endsWith(this.modelName.split('.')[1])))
             ) {
               val += `${item[con.from]}¯${this.jumpParamKey}:${
                 this.selectOrgs[index][this.jumpParamKey]
@@ -1465,11 +1467,17 @@
               if (
                 this.jumpParamKey &&
                 this.isHaveJumpUrl &&
-                this.modelName == 'data.' + con['target'][0]
+                (this.modelName == 'data.' + con['target'][0] ||
+                  (this.modelName.includes('item.') &&
+                    con['target'][0].endsWith(this.modelName.split('.')[1])))
               ) {
+                // 需根据key 找到对应 返回数据的返回名称
+                let returnMapKey = returnStr.find((k) => {
+                  return k.field == this.jumpParamKey
+                }).comment
                 val += `${decodeURIComponent(item[from])}¯${
                   this.jumpParamKey
-                }:${item[this.jumpParamKey]},`
+                }:${item[returnMapKey]},`
               } else {
                 val += decodeURIComponent(item[from]) + ','
               }

package/packages/CustomDialog/src/main.vue

@@ -2,9 +2,13 @@
   <div class="inputs">
     <el-tooltip
       :placement="tooltipplacement || defualtTooltipplacement"
-      :disabled="inputWriteable && !errors.has('custom-form.' + inputName)"
+      :disabled="
+        inputWriteable && errors && !errors.has('custom-form.' + inputName)
+      "
     >
-      <div slot="content">{{ errors.first('custom-form.' + inputName) }}</div>
+      <div v-if="errors && errors.first" slot="content">
+        {{ errors.first('custom-form.' + inputName) }}
+      </div>
       <div
         v-if="inputWriteable"
         style="width: 100%"
@@ -21,7 +25,7 @@
             <span
               v-for="(item, index) in inputVal"
               :key="item.value"
-              class="el-tag el-tag--info el-tag--small"
+              class="el-tag el-tag--info el-tag--small no-background"
               @click.stop="jumpUrl(item)"
             >
               <span
@@ -93,11 +97,11 @@
         </div>
       </div>
     </el-tooltip>
-    <span v-if="!inputWriteable">
+    <span v-if="!inputWriteable" class="dialog-readonly">
       <span
         v-for="item in inputVal"
         :key="item.value"
-        class="el-tag el-tag--info el-tag--small"
+        class="el-tag el-tag--info el-tag--small no-background"
         style="margin-right: 8px"
         @click.stop="jumpUrl(item)"
       >
@@ -136,7 +140,7 @@
       @calacInputSuffixHeight="calacInputSuffixHeight"
       @updateInput="updateInput"
     ></custom-dialog>
-    <span v-validate style="display: none">
+    <span style="display: none">
       <slot name="labeldesc">{{ inputName }}</slot>
     </span>
     <ht-field-tail :field-name="inputName" :input-value="value" />
@@ -219,10 +223,16 @@
           let result = []
           nameAry.forEach((m) => {
             // 带url跳转参数的 使用上横杆区分参数 值格式为 名称¯跳转key:跳转value
+            // 上横向保存数据库后 有可能被改变此处兼容写了一种上横线
             let n = {}
-            if (m.includes('¯') && m.split('¯')[1]) {
-              n.value = m.split('¯')[0]
-              let jumpParamStr = m.split('¯')[1]
+            if (
+              (m.includes('¯') && m.split('¯')[1]) ||
+              (m.includes('ˉ') && m.split('ˉ')[1])
+            ) {
+              let val1 = m.includes('¯') ? m.split('¯')[0] : m.split('ˉ')[0]
+              let val2 = m.includes('¯') ? m.split('¯')[1] : m.split('ˉ')[1]
+              n.value = val1
+              let jumpParamStr = val2
               if (jumpParamStr) {
                 let jumpParam = jumpParamStr.split(':')
                 n.jumpParamKey = jumpParam[0]
@@ -254,26 +264,28 @@
       this.getDialogConfig()
     },
     mounted() {
-      const { subScopeEl } = utils.getSubScopeElAndIndex(this.$el)
+      setTimeout(() => {
+        const { subScopeEl } = utils.getSubScopeElAndIndex(this.$el)
 
-      if (subScopeEl) {
-        if (
-          subScopeEl.getAttribute('row_readonly') == 'true' ||
-          subScopeEl.getAttribute('row_readonly') === true
-        ) {
-          this.writeable = false
-        } else {
-          const className = Array.prototype.find.call(
-            subScopeEl.classList,
-            (item) => item.startsWith('row_readonly__')
-          )
-          if (className && className == 'row_readonly__true') {
+        if (subScopeEl) {
+          if (
+            subScopeEl.getAttribute('row_readonly') == 'true' ||
+            subScopeEl.getAttribute('row_readonly') === true
+          ) {
             this.writeable = false
+          } else {
+            const className = Array.prototype.find.call(
+              subScopeEl.classList,
+              (item) => item.startsWith('row_readonly__')
+            )
+            if (className && className == 'row_readonly__true') {
+              this.writeable = false
+            }
           }
         }
-      }
-      //获取对话框按钮名称宽度
-      this.calacInputSuffixWidth()
+        //获取对话框按钮名称宽度
+        this.calacInputSuffixWidth()
+      }, 50)
     },
     methods: {
       // 跳转url页面
@@ -598,4 +610,22 @@
     cursor: pointer;
     color: #409eff !important;
   }
+  .el-tag.el-tag--info.no-background {
+    background: none;
+    border: none;
+  }
+  .dialog-readonly {
+    & > .el-tag {
+      &::after {
+        display: inline;
+        content: ',';
+      }
+    }
+    & > .el-tag:last-child {
+      &::after {
+        display: none;
+        content: '';
+      }
+    }
+  }
 </style>

package/packages/FieldTail/src/main.vue

@@ -109,7 +109,7 @@
         return this.errors && this.errors.has(this.fieldScopePath)
       },
       errorMessage: function() {
-        return this.errors.first(this.fieldScopePath)
+        return this.errors && this.errors.first(this.fieldScopePath)
       },
       formatInputValue() {
         let value = []
@@ -137,27 +137,31 @@
       },
     },
     mounted() {
-      this.scopeName = utils.getSomeAttributeFromParentElement(
-        this.$el.parentElement,
-        'data-vv-scope'
-      )
-      const { subScopeEl } = utils.getSubScopeElAndIndex(this.$el.parentElement)
-      if (subScopeEl) {
-        if (
-          subScopeEl.getAttribute('row_readonly') == 'true' ||
-          subScopeEl.getAttribute('row_readonly') === true
-        ) {
-          this.$emit('update:writeable', false)
-        } else {
-          const className = Array.prototype.find.call(
-            subScopeEl.classList,
-            (item) => item.startsWith('row_readonly__')
-          )
-          if (className && className == 'row_readonly__true') {
+      setTimeout(() => {
+        this.scopeName = utils.getSomeAttributeFromParentElement(
+          this.$el.parentElement,
+          'data-vv-scope'
+        )
+        const { subScopeEl } = utils.getSubScopeElAndIndex(
+          this.$el.parentElement
+        )
+        if (subScopeEl) {
+          if (
+            subScopeEl.getAttribute('row_readonly') == 'true' ||
+            subScopeEl.getAttribute('row_readonly') === true
+          ) {
             this.$emit('update:writeable', false)
+          } else {
+            const className = Array.prototype.find.call(
+              subScopeEl.classList,
+              (item) => item.startsWith('row_readonly__')
+            )
+            if (className && className == 'row_readonly__true') {
+              this.$emit('update:writeable', false)
+            }
           }
         }
-      }
+      }, 50)
     },
     created() {
       this.$validator = this.$root.$validator

package/src/mixins/permission.js

@@ -72,23 +72,25 @@ export default {
     }
   },
   mounted() {
-    const { subScopeEl } = utils.getSubScopeElAndIndex(this.$el)
-    // 当前控件在子表行中，且配置了该行为只读
-    if (subScopeEl) {
-      if (
-        subScopeEl.getAttribute('row_readonly') == 'true' ||
-        subScopeEl.getAttribute('row_readonly') === true
-      ) {
-        this.writeable = false
-      } else {
-        const className = Array.prototype.find.call(
-          subScopeEl.classList,
-          (item) => item.startsWith('row_readonly__')
-        )
-        if (className && className == 'row_readonly__true') {
+    setTimeout(() => {
+      const { subScopeEl } = utils.getSubScopeElAndIndex(this.$el)
+      // 当前控件在子表行中，且配置了该行为只读
+      if (subScopeEl) {
+        if (
+          subScopeEl.getAttribute('row_readonly') == 'true' ||
+          subScopeEl.getAttribute('row_readonly') === true
+        ) {
           this.writeable = false
+        } else {
+          const className = Array.prototype.find.call(
+            subScopeEl.classList,
+            (item) => item.startsWith('row_readonly__')
+          )
+          if (className && className == 'row_readonly__true') {
+            this.writeable = false
+          }
         }
       }
-    }
+    }, 50)
   },
 }

package/src/utils.js

@@ -443,6 +443,9 @@ var utils = {
   },
   // 获取子表每一行所在的作用域元素及索引
   getSubScopeElAndIndex: (el) => {
+    if (!el || !(el instanceof HTMLElement)) {
+      return { subScopeEl: null, index: null, subname: null }
+    }
     let subScopeEl = utils.getParentElementByAttribute(el, 'data-subname')
     if (!subScopeEl) {
       subScopeEl = utils.getParentElementByClassNamePrefix(el, 'data-subname__')
@@ -549,7 +552,7 @@ var utils = {
   },
   // 获取指定dom元素的父级中具有指定属性的dom元素
   getParentElementByAttribute: (el, attribute) => {
-    if (el === null || el === undefined) {
+    if (el === null || el === undefined || !(el instanceof HTMLElement)) {
       return null
     }
     if (!el.hasAttribute || typeof el.hasAttribute != 'function') {