tianheng-ui 0.0.28 → 0.0.31

package/package.json

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

package/packages/table/action.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="thTable-action" @click.stop>
+  <div class="th-table-action" @click.stop>
     <template v-for="(item, index) in actions">
       <el-button
         v-if="item.act === 'edit'"
@@ -173,7 +173,7 @@ export default {
 </script>
 
 <style lang="less">
-.thTable-action {
+.th-table-action {
   width: 100%;
   display: flex;
   align-items: center;

package/packages/table/index.vue

@@ -211,7 +211,7 @@ export default {
     handleSizeChange(val) {
       this.pageInfo.pageSize = val;
       this.$emit(
-        "pageNumberChange",
+        "page-number-change",
         this.pageInfo.currentPage,
         this.pageInfo.pageSize
       );
@@ -220,7 +220,7 @@ export default {
     handleCurrentChange(val) {
       this.pageInfo.currentPage = val;
       this.$emit(
-        "pageNumberChange",
+        "page-number-change",
         this.pageInfo.currentPage,
         this.pageInfo.pageSize
       );
@@ -230,7 +230,7 @@ export default {
       if (this.pageInfo.currentPage === 1) return;
       this.pageInfo.currentPage -= 1;
       this.$emit(
-        "pageNumberChange",
+        "page-number-change",
         this.pageInfo.currentPage,
         this.pageInfo.pageSize
       );
@@ -240,7 +240,7 @@ export default {
       if (this.pageInfo.currentPage === this.pageInfo.pageCount) return;
       this.pageInfo.currentPage += 1;
       this.$emit(
-        "pageNumberChange",
+        "page-number-change",
         this.pageInfo.currentPage,
         this.pageInfo.pageSize
       );

package/packages/table/search.js

@@ -0,0 +1,8 @@
+import TableSearch from "./search.vue";
+
+/* istanbul ignore next */
+TableSearch.install = function(Vue) {
+  Vue.component(TableSearch.name, TableSearch);
+};
+
+export default TableSearch;

package/packages/table/search.vue

@@ -1,45 +1,47 @@
 <template>
-  <div class="table-search">
+  <div class="th-table-search">
     <template v-for="(item, index) in options">
-      <el-input
+      <div
+        class="th-table-search-item"
         v-if="item.type === 'input'"
-        class="table-search-item"
-        v-model="params[item.value]"
         :key="index"
-        :style="{ width: item.width + 'px' }"
-        :placeholder="item.placeholder || '请输入'"
-        :size="item.size || 'mini'"
-        clearable
-      ></el-input>
-      <el-date-picker
+      >
+        <span class="th-table-search-item-title">{{ item.props.label }}：</span>
+        <el-input
+          v-model="params[item.props.prop]"
+          :style="{ width: item.width + 'px' }"
+          :placeholder="item.placeholder || '请输入'"
+          :size="item.size"
+          clearable
+        ></el-input>
+      </div>
+      <div
+        class="th-table-search-item"
         v-if="item.type === 'date'"
-        class="table-search-item"
-        v-model="params[item.value]"
         :key="index"
-        :style="{ width: item.width + 'px' }"
-        :type="item.dateType || 'date'"
-        :format="item.format"
-        :value-format="item.valueFormat"
-        :size="item.size || 'mini'"
-        range-separator="至"
-        start-placeholder="开始日期"
-        end-placeholder="结束日期"
       >
-      </el-date-picker>
+        <span class="th-table-search-item-title">{{ item.props.label }}：</span>
+        <el-date-picker
+          v-model="params[item.props.prop]"
+          :style="{ width: item.width + 'px' }"
+          :type="item.dateType || 'date'"
+          :format="item.format"
+          :value-format="item.valueFormat"
+          :size="item.size"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        >
+        </el-date-picker>
+      </div>
     </template>
 
-    <el-button
-      type="primary"
-      icon="el-icon-search"
-      size="mini"
-      plain
-      @click="doSearch"
+    <el-button type="primary" icon="el-icon-search" plain @click="doSearch"
       >查询</el-button
     >
     <el-button
       type="primary"
       icon="el-icon-refresh-right"
-      size="mini"
       plain
       @click="doReset"
       >重置</el-button
@@ -84,7 +86,6 @@ export default {
       this.$emit("on-search", this.params);
     },
     doReset() {
-      this.params = {};
       this.$emit("on-reset", this.params);
     }
   }
@@ -92,15 +93,16 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.table-search {
+.th-table-search {
   display: flex;
   align-items: center;
-  margin-bottom: 10px;
+  margin-bottom: 20px;
   &-item {
-    margin-right: 10px;
+    display: inline-block;
+    margin-right: 15px;
+  }
+  .th-table-search-item:last-child {
+    margin-right: 20px !important;
   }
-}
-.table-search-item:last-child {
-  margin-right: 20px !important;
 }
 </style>

package/packages/table/tools.js

@@ -1,8 +1,8 @@
-import Tools from "./tools.vue";
+import TableTools from "./tools.vue";
 
 /* istanbul ignore next */
-Tools.install = function(Vue) {
-  Vue.component(Tools.name, Tools);
+TableTools.install = function(Vue) {
+  Vue.component(TableTools.name, TableTools);
 };
 
-export default Tools;
+export default TableTools;

package/packages/table/tools.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="th-Tools">
+  <div class="th-tools">
     <el-button
       v-for="(item, index) in options"
       :key="index"
@@ -16,20 +16,20 @@
 
 <script>
 export default {
-  name:'ThTools',
+  name: "ThTableTools",
   props: {
     options: {
       type: Array,
       default: () => {
         return [];
-      },
+      }
     },
     disabled: {
       type: Object,
       default: () => {
         return {};
-      },
-    },
+      }
+    }
   },
   data() {
     return {};
@@ -37,7 +37,13 @@ export default {
   methods: {
     handleClick(item) {
       this.$emit("on-click", item);
-    },
-  },
+    }
+  }
 };
 </script>
+
+<style lang="less" scoped>
+.th-tools {
+  margin-bottom: 10px;
+}
+</style>