tianheng-ui 0.1.38 → 0.1.40

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tianheng-ui",
   "description": "A Vue.js project",
-  "version": "0.1.38",
+  "version": "0.1.40",
   "author": "shu lang <403732931@qq.com>",
   "license": "MIT",
   "private": false,

package/packages/Dialog/index.vue

@@ -2,7 +2,6 @@
   <el-dialog
     class="th-dialog"
     :class="[customClass]"
-    :style="{'z-index':zIndex}"
     :visible.sync="visible"
     :width="width"
     :top="top"
@@ -88,9 +87,7 @@ export default {
     showFullscreen: { type: Boolean, default: true },
     fullscreenIcon: { type: String, default: "el-icon-full-screen" },
 
-    showFooter: { type: Boolean, default: true },
-
-    zIndex: Number
+    showFooter: { type: Boolean, default: true }
   },
   data() {
     return {

package/packages/FormMaking/GenerateForm.vue

@@ -230,7 +230,7 @@ export default {
       }
 
       this.axios({
-        url: `/api/lc/api/${remoteFunc.url}`,
+        url: remoteFunc.url,
         method: remoteFunc.method,
         headers: remoteFunc.headers,
         data: remoteFunc.params

package/packages/FormMaking/WidgetConfig.vue

@@ -6,7 +6,7 @@
         :key="index"
         class="tabs-item"
         :class="{ 'tabs-item__active': activeTab.value === item.value }"
-        @click="handleTabsChange(item)"
+        @click="activeTab = item"
       >
         {{ item.title }}
       </div>
@@ -14,6 +14,7 @@
 
     <div v-if="activeTab.value === 'field'">
       <el-form
+        v-if="data.model"
         :model="data"
         label-position="left"
         label-width="80px"
@@ -132,6 +133,7 @@
           </el-collapse-item>
         </el-collapse>
       </el-form>
+      <th-empty v-else description="请左侧拖拽来添加字段"></th-empty>
     </div>
     <div v-if="activeTab.value === 'form'">
       <el-form
@@ -264,17 +266,19 @@
         </el-collapse>
       </el-form>
     </div>
-    <div v-if="activeTab.value === 'css'"></div>
+    <div v-if="activeTab.value === 'css'">
+      <th-empty description="开发中，敬请期待..."></th-empty>
+    </div>
 
     <th-dialog
-      title="动作设置"
       v-model="eventsDialog.visible"
+      title="动作设置"
       :modal-append-to-body="false"
       @on-fullscreen="$refs.codeEditor && $refs.codeEditor.resize()"
     >
-      <div class="eventsSetting">
-        <div class="list">
-          <div class="list-header">
+      <div class="eventsSetting th-flex_box th-is_border">
+        <div class="list th-flex_aside">
+          <div class="events-header">
             <div>动作库</div>
             <el-button
               type="text"
@@ -285,8 +289,12 @@
             >
           </div>
           <div
-            class="list-item"
             v-for="(item, index) in eventsDialog.eventScript"
+            class="list-item th-is_hover"
+            :class="{
+              'th-is_active':
+                eventsDialog.active && eventsDialog.active.label === item.label
+            }"
             :key="item.key"
             @click="eventsDialog.active = item"
           >
@@ -302,7 +310,7 @@
             </el-popconfirm>
           </div>
         </div>
-        <div class="detail" v-if="eventsDialog.active">
+        <div class="detail th-fiex_content" v-if="eventsDialog.active">
           <div>
             <span>Function Name</span>
             <el-input
@@ -474,13 +482,6 @@ export default {
     }
   },
   methods: {
-    handleTabsChange(item) {
-      if (!this.data.model)
-        return this.$message.warning("请从左侧拖拽来添加组件");
-
-      this.activeTab = item;
-    },
-
     handleEventDialogShow() {
       this.eventsDialog = {
         visible: true,
@@ -577,6 +578,7 @@ export default {
     display: flex;
     align-items: center;
     height: 45px;
+    z-index: 10;
 
     .tabs-item {
       flex: 1;
@@ -599,8 +601,18 @@ export default {
 
   .eventsSetting {
     height: 100%;
-    display: flex;
-    border: 1px solid #eee;
+
+    .events-header {
+      position: sticky;
+      top: 0;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 5px;
+      line-height: 30px;
+      border-bottom: 1px solid #eee;
+      background: #f2f6fc;
+    }
 
     .list {
       width: 270px;
@@ -608,18 +620,6 @@ export default {
       overflow-y: overlay;
       border-right: 1px solid #eee;
 
-      .list-header {
-        position: sticky;
-        top: 0;
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        padding: 5px;
-        line-height: 30px;
-        border-bottom: 1px solid #eee;
-        background: #f2f6fc;
-      }
-
       .list-item {
         display: flex;
         // align-items: center;
@@ -640,14 +640,9 @@ export default {
           cursor: pointer;
         }
       }
-
-      .list-item:hover {
-        background-color: #f2f6fc;
-      }
     }
 
     .detail {
-      flex: 1;
       padding: 10px;
 
       > div:nth-child(1) {

package/packages/FormMaking/WidgetForm.vue

@@ -121,5 +121,20 @@ export default {
   position: relative;
   width: 100%;
   height: calc(100% - 45px);
+  overflow-y: scroll;
+
+  .form-empty {
+    position: absolute;
+    text-align: center;
+    width: 400px;
+    top: 200px;
+    left: 50%;
+    margin-left: -200px;
+    color: #ccc;
+
+    .th-empty-description {
+      font-size: 20px;
+    }
+  }
 }
 </style>

package/packages/FormMaking/WidgetTools.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="widgetTools th-sticky_top">
+  <div class="widgetTools">
     <div class="left">
       <slot> </slot>
     </div>
@@ -215,7 +215,6 @@
       title="获取数据"
       :modal-append-to-body="false"
       :showFooter="false"
-      :z-index="99999"
       @on-close="dialogResultData.show = false"
       @on-fullscreen="$refs.dataCodeEditor.resize()"
     >
@@ -506,7 +505,7 @@ export default {
   width: 100%;
   height: 45px;
   padding: 0 15px;
-  z-index: 999;
+  border-bottom: solid 1px #e4e7ed;
 
   .left {
   }

package/packages/FormMaking/custom/items/upload.vue

@@ -75,7 +75,7 @@ export default {
           this.$message.warning("未知的请求接口，请检查配置信息");
           return "";
         }
-        return `${baseUrl}/api/lc/api/${func.url}`;
+        return `${baseUrl}${func.url}`;
       } else {
         return this.widget.options.action;
       }

package/packages/FormMaking/index.vue

@@ -263,6 +263,7 @@ export default {
     },
     config(val) {
       this.setConfig(val);
+      this.initApiConfig()
     },
     apiOptions(val) {
       this.initApiConfig();
@@ -314,6 +315,7 @@ export default {
           this.apiConfig[item.id] = item;
         });
       }
+      this.formConfig.config.network = this.apiConfig;
     },
 
     handleConfigSelect(value) {

package/packages/FormMaking/styles/index.scss

@@ -1,7 +1,7 @@
 $primary-color: #409eff;
 $primary-background-color: #ecf5ff;
 
-.formMaking {
+.th-formMaking {
   height: 100%;
 
   *,
@@ -22,16 +22,6 @@ $primary-background-color: #ecf5ff;
     padding: 0;
   }
 
-  .fa-icon {
-    width: auto;
-    height: 1em; /* 或任意其它字体大小相对值 */
-
-    /* 要在 Safari 中正常工作，需要再引入如下两行代码 */
-    max-width: 100%;
-    max-height: 100%;
-    vertical-align: middle;
-  }
-
   .isHideFormLabel {
     .el-form-item__label {
       display: none;
@@ -41,160 +31,7 @@ $primary-background-color: #ecf5ff;
     }
   }
 
-  .container-box {
-    background: #fff;
-    height: 100%;
-    border: 1px solid #e0e0e0;
-
-    .el-container {
-      height: 100% !important;
-    }
-
-    & > .el-container {
-      background: #fff;
-    }
-    .fm2-main {
-      position: relative;
-
-      & > .el-container {
-        position: absolute;
-        top: 0;
-        bottom: 0;
-        left: 0;
-        right: 0;
-      }
-    }
-    main {
-      padding: 0;
-    }
-
-    footer {
-      height: 30px;
-      line-height: 30px;
-      border-top: 1px solid #e0e0e0;
-      font-size: 12px;
-      text-align: right;
-      color: $primary-color;
-      background: #fafafa;
-
-      a {
-        color: $primary-color;
-      }
-    }
-
-    .codeDialog {
-      .el-tabs {
-        height: 100%;
-      }
-      .el-tabs__content {
-        height: calc(100% - 40px);
-      }
-      .el-tab-pane {
-        height: 100%;
-      }
-    }
-  }
-
-  // 顶部操作区
-  .center-container {
-    border-left: 1px solid #e0e0e0;
-    border-right: 1px solid #e0e0e0;
-
-    .el-main {
-      padding: 0;
-      position: relative;
-      background: #fafafa;
-    }
-  }
-
-  // 左侧字段区
-  .components-list {
-    padding: 8px 0;
-    width: 100%;
-    height: 100%;
-
-    .widget-cate {
-      padding: 8px 12px;
-      font-size: 13px;
-    }
-
-    ul {
-      position: relative;
-      overflow: hidden;
-      padding: 0 10px 10px;
-      margin: 0;
-    }
-
-    .form-edit-widget-label {
-      font-size: 12px;
-      display: block;
-      width: 48%;
-      line-height: 26px;
-      position: relative;
-      float: left;
-      left: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      margin: 1%;
-      color: #333;
-      border: 1px solid #f4f6fc;
-      transition: 0.25s;
-
-      &:hover {
-        color: $primary-color !important;
-        border: 1px dashed $primary-color;
-
-        a {
-          color: $primary-color !important;
-        }
-      }
-
-      & > a {
-        color: #333;
-        display: block;
-        cursor: move;
-        background: #f4f6fc;
-        border: 1px solid #f4f6fc;
-        transition: 0.25s;
-
-        .icon {
-          margin-right: 6px;
-          margin-left: 8px;
-          font-size: 14px;
-          display: inline-block;
-          vertical-align: middle;
-        }
-
-        span {
-          display: inline-block;
-          vertical-align: middle;
-        }
-      }
-    }
-  }
-
   .widget-form-container {
-    // position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-
-    .form-empty {
-      position: absolute;
-      text-align: center;
-      width: 400px;
-      top: 200px;
-      left: 50%;
-      margin-left: -200px;
-      color: #ccc;
-
-      .th-empty-description {
-        font-size: 20px;
-      }
-    }
-
     .draggable {
       height: 100%;
     }
@@ -589,88 +426,10 @@ $primary-background-color: #ecf5ff;
     }
   }
 
-  .config-container {
-    position: relative;
-
-    .el-header {
-      border-bottom: solid 2px #e4e7ed;
-      padding: 0 2px;
-
-      .config-tab {
-        height: 45px;
-        line-height: 45px;
-        display: inline-block;
-        width: 145px;
-        text-align: center;
-        font-size: 14px;
-        font-weight: 500;
-        position: relative;
-        cursor: pointer;
-
-        &.active {
-          border-bottom: solid 2px $primary-color;
-        }
-      }
-    }
-
-    .config-container-content {
-      // padding: 10px;
-
-      // .el-form-item__label {
-      //   padding: 0;
-      //   font-weight: 500;
-      // }
-
-      // .el-form-item {
-      //   border-bottom: solid 1px #e1e1e1;
-      //   padding-bottom: 10px;
-      // }
-
-      .config-pattern-input {
-        .el-input-group__prepend,
-        .el-input-group__append {
-          padding: 0 8px;
-        }
-      }
-    }
-
-    .ghost {
-      background: #fff;
-      border: 1px dashed $primary-color;
-
-      &::after {
-        background: #fff;
-        display: block;
-        content: "";
-        position: absolute;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-      }
-    }
-
-    ul {
-      margin: 0;
-      padding: 0;
-    }
-
-    li.ghost {
-      list-style: none;
-      font-size: 0;
-      display: block;
-      position: relative;
-    }
-  }
-
   .widget-divider {
     display: flex;
     align-items: center;
   }
-
-  // .filler {
-  //   margin-bottom: 0 !important;
-  // }
 }
 
 .configComponents {

package/packages/TableMaking/WidgetTools.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="widgetTools th-sticky_top">
+  <div class="widgetTools">
     <div class="left">
       <slot> </slot>
     </div>
@@ -123,7 +123,7 @@
     <th-dialog
       v-model="dialog.show"
       :title="dialogTitles[dialog.action]"
-      :modal="dialog.action !== 'previewPc'"
+      :modal="false"
       :modal-append-to-body="false"
       :showFooter="['importJson', 'importTemplate'].includes(dialog.action)"
       @on-fullscreen="handleDialogFullscreen"
@@ -245,7 +245,7 @@ export default {
   width: 100%;
   height: 45px;
   padding: 0 15px;
-  z-index: 999;
+  border-bottom: solid 1px #e4e7ed;
 
   .left {
   }

package/packages/TableMaking/custom/items/search/index-h5.vue

@@ -2,9 +2,9 @@
   <div class="generateTable-search">
     <el-row :gutter="10">
       <el-col
-        v-for="item in options"
+        v-for="item in getList"
         :key="item.prop"
-        :span="24 / options.length"
+        :span="24 / getList.length"
       >
         <el-input
           v-if="item.type === 'input' || item.elType === 'input'"
@@ -81,6 +81,17 @@ export default {
   data() {
     return {};
   },
+  computed: {
+    getList() {
+      if (this.options) {
+        const data = this.options.filter(item => {
+          return !item.hide;
+        });
+        return data;
+      }
+      return [];
+    }
+  },
   methods: {
     doSearch() {
       this.$emit("search", this.data);

package/packages/TableMaking/custom/items/search/index-pc.vue

@@ -2,7 +2,7 @@
   <div class="generateTable-search">
     <el-form :inline="true" :model="data" size="small">
       <el-form-item
-        v-for="item in options"
+        v-for="item in getList"
         :key="item.prop"
         :label="item.label"
       >
@@ -95,6 +95,17 @@ export default {
   data() {
     return {};
   },
+  computed: {
+    getList() {
+      if (this.options) {
+        const data = this.options.filter(item => {
+          return !item.hide;
+        });
+        return data;
+      }
+      return [];
+    }
+  },
   methods: {
     doSearch() {
       this.$emit("search", this.data);

package/packages/TableMaking/custom/items/table/index-pc.vue

@@ -9,7 +9,7 @@
       v-loading="config.loading.show"
       :element-loading-text="config.loading.text"
     >
-      <template v-for="item in config.options">
+      <template v-for="item in getList">
         <el-table-column
           v-if="item.type"
           :key="item.prop"
@@ -54,6 +54,18 @@ export default {
   data() {
     return {};
   },
+
+  computed: {
+    getList() {
+      if (this.config.options) {
+        const data = this.config.options.filter(item => {
+          return !item.hide;
+        });
+        return data;
+      }
+      return [];
+    }
+  },
   created() {},
   mounted() {},
   methods: {}

package/packages/TableMaking/generateTable.vue

@@ -393,7 +393,7 @@ export default {
       }
 
       const request = {
-        url: `api/lc/api/${config.url}`,
+        url: config.url,
         method: config.method,
         headers: { ...config.headers, actionType }
       };