tianheng-ui 0.0.9 → 0.0.13

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tianheng-ui",
   "description": "A Vue.js project",
-  "version": "0.0.9",
+  "version": "0.0.13",
   "author": "shu lang <403732931@qq.com>",
   "license": "MIT",
   "private": false,
@@ -46,7 +46,7 @@
   "homepage": "http://element.eleme.io",
   "keywords": [
     "tianheng",
-    "prompt"
+    "tianheng-ui"
   ],
   "style": "lib/theme-chalk/index.css"
 }

package/packages/cell/index.vue

@@ -1,19 +1,43 @@
 <template>
   <div
     class="th-cell"
-    :class="[center ? 'is-center' : '']"
+    :class="[
+      customClass,
+      center ? 'is-center' : '',
+      active ? cellActive : '',
+      hover ? cellHover : ''
+    ]"
     :style="customStyle"
     @click="handleClick"
   >
     <i v-if="icon" class="th-cell-icon" :class="icon"></i>
     <slot v-else name="icon" />
     <div class="th-cell-content">
-      <div v-if="title" class="th-cell-title">{{ title }}</div>
+      <div
+        v-if="title"
+        class="th-cell-title"
+        :class="[titleClass, active ? titleActive : '', hover ? titleHover : 'title-color']"
+        :style="titleStyle"
+      >
+        {{ title }}
+      </div>
       <slot v-else name="title" />
-      <div v-if="label" class="th-cell-label">{{ label }}</div>
+      <div
+        v-if="label"
+        class="th-cell-label"
+        :class="[labelClass, active ? labelActive : '', hover ? labelHover : '']"
+      >
+        {{ label }}
+      </div>
       <slot v-else name="label" />
     </div>
-    <div v-if="value" class="th-cell-value">{{ value }}</div>
+    <div
+      v-if="value"
+      class="th-cell-value"
+      :class="[valueClass, active ? valueActive : '', hover ? valueHover : '']"
+    >
+      {{ value }}
+    </div>
     <slot v-else />
   </div>
 </template>
@@ -26,8 +50,62 @@ export default {
     value: Number | String,
     label: String,
     icon: String,
+
     customStyle: String | Object,
-    center: Boolean
+    titleStyle: String | Object,
+
+    customClass: String | Object,
+    titleClass: String | Object,
+    labelClass: String | Object,
+    valueClass: String | Object,
+
+    cellActiveClass: String | Object,
+    titleActiveClass: String | Object,
+    labelActiveClass: String | Object,
+    valueActiveClass: String | Object,
+
+    cellHoverClass: String | Object,
+    titleHoverClass: String | Object,
+    labelHoverClass: String | Object,
+    valueHoverClass: String | Object,
+
+    center: Boolean,
+    hover: Boolean,
+    active: Boolean
+  },
+  computed: {
+    cellActive() {
+      if (this.cellActiveClass) return this.cellActiveClass;
+      else return "is-active";
+    },
+    titleActive() {
+      if (this.titleActiveClass) return this.titleActiveClass;
+      else return "is-active";
+    },
+    labelActive() {
+      if (this.labelActiveClass) return this.labelActiveClass;
+      else return "is-active";
+    },
+    valueActive() {
+      if (this.valueActiveClass) return this.valueActiveClass;
+      else return "is-active";
+    },
+    cellHover() {
+      if (this.cellHoverClass) return this.cellHoverClass;
+      else return "is-hover";
+    },
+    titleHover() {
+      if (this.titleHoverClass) return this.titleHoverClass;
+      else return "is-hover";
+    },
+    labelHover() {
+      if (this.labelHoverClass) return this.labelHoverClass;
+      else return "is-hover";
+    },
+    valueHover() {
+      if (this.valueHoverClass) return this.valueHoverClass;
+      else return "is-hover";
+    }
   },
   methods: {
     handleClick(evt) {

package/packages/table/action.js

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

package/packages/table/action.vue

@@ -69,26 +69,27 @@
 
 <script>
 export default {
+  name: "ThTableAction",
   props: {
     actions: {
       type: Array,
       default: () => {
         return [];
-      },
+      }
     },
     permission: {
       type: Object,
-      required: false,
+      required: false
     },
     msg: {
       type: String,
-      default: "确定删除本条数据吗？",
-    },
+      default: "确定删除本条数据吗？"
+    }
   },
   data() {
     return {
       pop: false,
-      loadingDel: false,
+      loadingDel: false
     };
   },
   methods: {
@@ -109,13 +110,13 @@ export default {
     },
     doDelete(item) {
       this.loadingDel = true;
-      const callback = (bool) => {
+      const callback = bool => {
         this.loadingDel = false;
         this.pop = !bool;
       };
       this.$emit("on-delete", item, callback);
-    },
-  },
+    }
+  }
 };
 </script>
 

package/packages/table/index.vue

@@ -6,6 +6,7 @@
       :data="data"
       :row-key="rowKey"
       :stripe="stripe"
+      :border="border"
       :highlight-current-row="selectType === 'single'"
       :tree-props="treeProps"
       @current-change="handleSingleSelect"
@@ -178,6 +179,12 @@ export default {
       default: () => {
         return "加载中";
       }
+    },
+    border: {
+      type: Boolean,
+      default: () => {
+        return false;
+      }
     }
   },
   data() {

package/packages/table/search.vue

@@ -49,19 +49,20 @@
 
 <script>
 export default {
+  name: "ThTableSearch",
   props: {
     options: {
       type: Array,
       default: () => {
         return [];
-      },
+      }
     },
     params: {
       type: Object,
       default: () => {
         return {};
-      },
-    },
+      }
+    }
   },
   data() {
     return {
@@ -74,8 +75,8 @@ export default {
         "datetime",
         "datetimerange",
         "daterange",
-        "monthrange",
-      ],
+        "monthrange"
+      ]
     };
   },
   methods: {
@@ -85,8 +86,8 @@ export default {
     doReset() {
       this.params = {};
       this.$emit("on-reset", this.params);
-    },
-  },
+    }
+  }
 };
 </script>
 

package/packages/table/tools.vue

@@ -48,23 +48,24 @@
 
 <script>
 export default {
+  name: "ThTableTools",
   props: {
     options: {
       type: Array,
       default: () => {
         return [];
-      },
+      }
     },
     selectionDisabled: {
       type: Boolean,
       default: () => {
         return true;
-      },
-    },
+      }
+    }
   },
   data() {
     return {
-      loadingDel: false,
+      loadingDel: false
     };
   },
   methods: {
@@ -82,12 +83,12 @@ export default {
     },
     doBatch(item) {
       this.loadingDel = true;
-      const callback = (bool) => {
+      const callback = bool => {
         this.loadingDel = false;
       };
       this.$emit("on-batch", item, callback);
-    },
-  },
+    }
+  }
 };
 </script>