three-trees-ui 1.0.17 → 1.0.19

package/packages/CustomDialog/src/main.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="inputs">
+  <div class="inputs ht-custom-dialog">
     <el-tooltip
       :placement="tooltipplacement || defualtTooltipplacement"
       :disabled="
@@ -25,10 +25,15 @@
             <span
               v-for="(item, index) in inputVal"
               :key="item.value"
-              class="el-tag el-tag--info el-tag--small"
-              @click="showEditInput"
+              class="el-tag el-tag--info el-tag--small no-background"
+              @click.stop="jumpUrl(item)"
             >
-              <span class="el-select__tags-text">{{ item.value }}</span>
+              <span
+                class="el-select__tags-text"
+                :class="{ 'src-color': isSrcColor }"
+              >
+                {{ item.value }}
+              </span>
               <i
                 class="el-tag__close el-icon-close"
                 @click.stop="removeSelectOrg(index)"
@@ -92,15 +97,17 @@
         </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
+        @click.stop="jumpUrl(item)"
       >
-        <span class="el-select__tags-text">{{ item.value }}</span>
+        <span class="el-select__tags-text" :class="{ 'src-color': isSrcColor }">
+          {{ item.value }}
+        </span>
       </span>
     </span>
     <custom-mobile-dialog
@@ -112,6 +119,8 @@
       :sun-index="sunIndex"
       :sub-path="subPath"
       :current-sub-data="currentSubData"
+      :dialog-config="dialogConfig"
+      :dialog-type="dialogType"
       @calacInputSuffixHeight="calacInputSuffixHeight"
       @updateInput="updateInput"
     ></custom-mobile-dialog>
@@ -126,6 +135,8 @@
       :sub-path="subPath"
       :current-sub-data="currentSubData"
       :is-read-only="!inputWriteable"
+      :dialog-config="dialogConfig"
+      :dialog-type="dialogType"
       @calacInputSuffixHeight="calacInputSuffixHeight"
       @updateInput="updateInput"
     ></custom-dialog>
@@ -133,6 +144,29 @@
       <slot name="labeldesc">{{ inputName }}</slot>
     </span>
     <ht-field-tail :field-name="inputName" :input-value="value" />
+    <el-dialog
+      title="表单详情"
+      :visible.sync="isDialogFormShow"
+      v-if="isDialogFormShow"
+      width="100%"
+      custom-class="custom-dialog-form"
+      fullscreen
+      append-to-body
+    >
+      <div class="iframe-box">
+        <iframe
+          :src="mobileSrc"
+          width="100%"
+          frameborder="0"
+          style="height: 100%;"
+        ></iframe>
+      </div>
+      <div class="custom-dialog-form_footer">
+        <el-button size="smal" @click="isDialogFormShow = false">
+          关闭
+        </el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
@@ -163,9 +197,17 @@
       sunIndex: Number,
       subPath: String,
       currentSubData: Array,
+      dialogType: {
+        // search表示在查询条件使用 form表示在表单中使用
+        type: String,
+        default: 'form',
+      },
     },
     data() {
       return {
+        mobileSrc: '',
+        isDialogFormShow: false,
+        dialogConfig: null, // 对话框配置信息
         isEditInputShow: false,
         customValue: '',
         defualtTooltipplacement: 'bottom',
@@ -205,7 +247,25 @@
           }
           let result = []
           nameAry.forEach((m) => {
-            let n = { value: m }
+            // 带url跳转参数的 使用上横杆区分参数 值格式为 名称¯跳转key:跳转value
+            // 上横向保存数据库后 有可能被改变此处兼容写了一种上横线
+            let n = {}
+            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]
+                n.jumpParamValue = jumpParam[1]
+              }
+            } else {
+              n = { value: m }
+            }
             result.push(n)
           })
           return result
@@ -214,6 +274,19 @@
       isAllowCustom() {
         return this.custdialog && this.custdialog.allowInput
       },
+      // 是否展示可跳转颜色
+      isSrcColor() {
+        return (
+          this.dialogConfig &&
+          this.dialogType !== 'search' &&
+          ((this.isMobile && this.dialogConfig.mobileUrl) ||
+            (!this.isMobile && this.dialogConfig.pcUrl))
+        )
+      },
+    },
+    created() {
+      // 获取对话框配置，看是否有配置url跳转
+      this.getDialogConfig()
     },
     mounted() {
       setTimeout(() => {
@@ -237,9 +310,86 @@
         }
         //获取对话框按钮名称宽度
         this.calacInputSuffixWidth()
+        if (this.value && this.inputWriteable) {
+          this.calacInputSuffixHeight()
+        }
       }, 50)
     },
     methods: {
+      // 跳转url页面
+      jumpUrl(item) {
+        if (!this.isSrcColor) {
+          if (this.inputWriteable) {
+            this.showEditInput()
+          }
+          return
+        }
+        let url = this.isMobile
+          ? this.dialogConfig.mobileUrl
+          : this.dialogConfig.pcUrl
+        // 获取通用token 和 url翻译
+        Promise.all([
+          this.$requestConfig.getThreeTreeToken(),
+          this.transformUrl(url),
+        ]).then((res) => {
+          if (res[0] && res[0].code == 200) {
+            let token = res[0].value
+            let endUrl = res[1]
+            // 拼接参数 token和参数
+            if (endUrl.indexOf('?') == -1) {
+              endUrl += `?bnsToken=${token}&${item.jumpParamKey}=${item.jumpParamValue}`
+            } else {
+              endUrl += `&bnsToken=${token}&${item.jumpParamKey}=${item.jumpParamValue}`
+            }
+            if (this.isMobile) {
+              this.mobileSrc = endUrl
+              this.isDialogFormShow = true
+            } else {
+              window.open(endUrl)
+            }
+          } else {
+            this.$message.info(res.message || '获取token失败！')
+          }
+        })
+      },
+      // 替换url中域名通配符 需要发送接口
+      transformUrl(url) {
+        return new Promise((resolve) => {
+          var reg = /(\$\{(\w+)\})/
+          var match = reg.exec(url)
+          if (match) {
+            let alias = match[2]
+            if (alias) {
+              this.$requestConfig.getHostByAlias(alias).then((res) => {
+                if (res && res.value && res.value.rootAddress) {
+                  resolve(url.replace(match[1], res.value.rootAddress))
+                } else {
+                  resolve(url)
+                }
+              })
+            } else {
+              resolve(url)
+            }
+          } else {
+            resolve(url)
+          }
+        })
+      },
+      // 获取对话框配置
+      getDialogConfig() {
+        if (
+          this.custdialog &&
+          this.custdialog.custDialog &&
+          this.custdialog.custDialog.alias
+        )
+          this.$requestConfig
+            .getCustomDialogByAlias(this.custdialog.custDialog.alias)
+            .then((response) => {
+              if (response) {
+                this.dialogConfig = response
+              }
+            })
+      },
       editInputBlur() {
         this.$emit('input', this.customValue)
         this.isEditInputShow = false
@@ -364,7 +514,7 @@
       overflow-y: auto;
     }
     @media (max-width: 1280px) {
-      .el-dialog {
+      .el-dialog:not(.custom-dialog-form) {
         width: 96% !important;
         margin-top: 2vh !important;
       }
@@ -377,8 +527,8 @@
       }
     }
 
-    .el-dialog {
-      height: 90%;
+    .el-dialog:not(.custom-dialog-form) {
+      height: 86%;
       min-height: 400px;
     }
     @media (max-height: 960px) {
@@ -489,4 +639,46 @@
     display: block;
     margin: 8px 0;
   }
+  .src-color {
+    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: '';
+      }
+    }
+  }
+  ::v-deep .custom-dialog-form {
+    .el-dialog__header {
+      display: none;
+    }
+    .el-dialog__body {
+      height: 100%;
+      display: flex;
+      flex-direction: column;
+      .iframe-box {
+        width: 100%;
+        flex: 1;
+        overflow: hidden;
+      }
+      .custom-dialog-form_footer {
+        text-align: center;
+        margin-top: 10px;
+        padding-bottom: 10px;
+      }
+    }
+  }
 </style>

package/packages/Date/src/main.vue

@@ -7,6 +7,7 @@
         ? 'ht-form-inputs__block'
         : 'ht-form-inputs__inline',
     ]"
+    class="ht-date"
   >
     <el-date-picker
       v-if="inputWriteable"

package/packages/DatePicker/src/main.vue

@@ -7,6 +7,7 @@
         ? 'ht-form-inputs__block'
         : 'ht-form-inputs__inline',
     ]"
+    class="ht-date-picker"
   >
     <el-date-picker
       v-if="inputWriteable"

package/packages/Demension/src/main.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="inputs">
+  <div class="inputs ht-emension">
     <div
       style="width: 100%; min-width:180px;"
       class="el-select"

package/packages/Dictionary/src/main.vue

@@ -6,6 +6,7 @@
         ? 'ht-form-inputs__block'
         : 'ht-form-inputs__inline',
     ]"
+    class="ht-dictionary"
   >
     <el-select
       v-if="inputWriteable"

package/packages/DimensionSelector/src/main.vue

@@ -7,6 +7,7 @@
         ? 'ht-form-inputs__block'
         : 'ht-form-inputs__inline',
     ]"
+    class="ht-dimension-selector"
   >
     <div
       style="width: 100%; min-width:180px;"
@@ -269,6 +270,8 @@
               demNameAry.join(',')
             )
           }
+        } else {
+          this.$emit('change', newVal)
         }
         // 通过valueChange事件发布值变更消息
         this.$emit('valueChange', ary.join(','), newVal)

package/packages/DimensionSelectorInput/src/main.vue

@@ -7,6 +7,7 @@
         ? 'ht-form-inputs__block'
         : 'ht-form-inputs__inline',
     ]"
+    class="ht-dimension-selector-input"
   >
     <ht-dimension-selector
       v-model="value"

package/packages/Divider/src/main.vue

@@ -2,6 +2,7 @@
   <div
     :class="['el-divider', `el-divider--${direction}`]"
     :style="'background-color:' + color"
+    class="ht-divider"
   >
     <div
       v-if="$slots.default && direction !== 'vertical'"

package/packages/Editor/src/main.vue

@@ -9,6 +9,7 @@
       disabled ? 'is-disabled' : '',
     ]"
     :style="styleEditor"
+    class="ht-editor"
   >
     <input
       v-if="inputWriteable && !hasTextValue"
@@ -150,7 +151,7 @@
       },
     },
     watch: {
-      value: function (newVal) {
+      value: function(newVal) {
         if (this.editor && newVal) {
           let text = this.editor.txt.html()
           if (text !== newVal && encode(text) !== newVal) {
@@ -159,18 +160,18 @@
         }
       },
       textValue: {
-        handler: function (newVal) {
+        handler: function(newVal) {
           this.loadCompiledTextValue(newVal)
         },
         immediate: true,
       },
-      permission_sub: function (newVal, oldVal) {
+      permission_sub: function(newVal, oldVal) {
         if (newVal !== oldVal) {
           // 现在是无权限，需要销毁
           newVal == 'n' && this.destroyEditor()
         }
       },
-      inputWriteable: function (newVal, oldVal) {
+      inputWriteable: function(newVal, oldVal) {
         if (newVal !== oldVal) {
           // 可编辑，渲染
           if (newVal && !this.hasTextValue) {
@@ -182,7 +183,7 @@
           }
         }
       },
-      formInstance: function (newVal, oldVal) {
+      formInstance: function(newVal, oldVal) {
         if (!oldVal && newVal && newVal.$on) {
           newVal.$off('updateData', this.loadCompiledTextValue)
           newVal.$on('updateData', this.loadCompiledTextValue)
@@ -247,8 +248,7 @@
             this.editor.config.uploadImgHeaders &&
             !this.editor.config.uploadImgHeaders.Authorization
           ) {
-            this.editor.config.uploadImgHeaders.Authorization =
-              this.$requestConfig.getToken()
+            this.editor.config.uploadImgHeaders.Authorization = this.$requestConfig.getToken()
           }
           this.editor.create()
           if (this.disabled) {

package/packages/File/src/main.vue

@@ -7,6 +7,7 @@
         : 'ht-form-inputs__inline',
     ]"
     :style="inputsContainerWidth"
+    class="ht-file"
   >
     <input
       v-model="value"

package/packages/Global/src/GlobalQuery.vue

@@ -31,7 +31,6 @@
       if (this.formInst.isView === true) {
         return
       }
-
       if (this.queryJson.length > 0) {
         let _this = this
         this.queryJson.forEach((item) => {