xs-common-plugins 1.2.3 → 1.2.5

package/src/components/TableCmp/index.vue

@@ -1,98 +1,98 @@
-<template>
-  <div v-loading="glo_loading" class="table-wrapper" style="display: flex">
-    <div v-if="!hidSearch" class="t-search">
-      <search-cmp
-        v-model="query"
-        :form-content="formContent"
-        :btn-content="btnContent"
-        @search-click="handleSearch"
-        @btn-click="handleCommand"
-        @btns-click="btnsClick"
-      >
-        <div slot="search_custemBtn">
-          <slot name="custemBtn" />
-        </div>
-      </search-cmp>
-    </div>
-    <div class="t-handle">
-      <slot name="total" />
-    </div>
-    <div class="t-table">
-      <el-table
-        :data="query.data || []"
-        style="width: 100%"
-        size="mini"
-        border
-        fit
-        highlight-current-row
-        default-expand-all
-        :height="height ? height : '100%'"
-        :row-class-name="rowClassName"
-        @selection-change="handleSelectionChange"
-        @sort-change="customSortChange"
-        :row-key="rowKey"
-        :tree-props="treeProps"
-      >
-        <slot />
-      </el-table>
-    </div>
-    <div v-if="query.pageInfo" class="t-page">
-      <el-pagination
-        class="pages"
-        :current-page.sync="query.pageInfo.page"
-        :page-sizes="[10, 30, 50, 100, 200, 300, 400]"
-        :page-size="query.pageInfo.pageSize"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="query.pageInfo.totalCount"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      />
-    </div>
-  </div>
-</template>
-<script>
-import data from "./data";
-import methods from "./methods";
-import SearchCmp from "../Search";
-import { ElTable } from "element-ui";
-import { mapState } from "vuex";
-
-export default {
-  name: "Table",
-  props: {
-    height: [String],
-    hidSearch: {
-      type: [Boolean],
-      default: false,
-    },
-    query: {
-      type: [Object],
-    },
-    formContent: {
-      type: [Object, Array],
-    },
-    btnContent: {
-      type: [Object, Array],
-    },
-    rowClassName: {
-      type: [String, Function],
-    },
-    treeProps: {
-      type: [Object],
-    },
-    rowKey: [String, Function],
-    defaultExpandAll: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data,
-  computed: {
-    ...mapState(["glo_loading"]),
-  },
-  mounted() {},
-  methods,
-  components: { SearchCmp },
-};
-</script>
-<style lang="scss" src="./index.scss" scoped></style>
+<template>
+  <div v-loading="glo_loading" class="table-wrapper" style="display: flex">
+    <div v-if="!hidSearch" class="t-search">
+      <search-cmp
+        v-model="query"
+        :form-content="formContent"
+        :btn-content="btnContent"
+        @search-click="handleSearch"
+        @btn-click="handleCommand"
+        @btns-click="btnsClick"
+      >
+        <div slot="search_custemBtn">
+          <slot name="custemBtn" />
+        </div>
+      </search-cmp>
+    </div>
+    <div class="t-handle">
+      <slot name="total" />
+    </div>
+    <div class="t-table">
+      <el-table
+        :data="query.data || []"
+        style="width: 100%"
+        size="mini"
+        border
+        fit
+        highlight-current-row
+        default-expand-all
+        :height="height ? height : '100%'"
+        :row-class-name="rowClassName"
+        @selection-change="handleSelectionChange"
+        @sort-change="customSortChange"
+        :row-key="rowKey"
+        :tree-props="treeProps"
+      >
+        <slot />
+      </el-table>
+    </div>
+    <div v-if="query.pageInfo" class="t-page">
+      <el-pagination
+        class="pages"
+        :current-page.sync="query.pageInfo.page"
+        :page-sizes="[10, 30, 50, 100, 200, 300, 400]"
+        :page-size="query.pageInfo.pageSize"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="query.pageInfo.totalCount"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
+    </div>
+  </div>
+</template>
+<script>
+import data from "./data";
+import methods from "./methods";
+import SearchCmp from "../Search";
+import { ElTable } from "element-ui";
+import { mapState } from "vuex";
+
+export default {
+  name: "Table",
+  props: {
+    height: [String],
+    hidSearch: {
+      type: [Boolean],
+      default: false,
+    },
+    query: {
+      type: [Object],
+    },
+    formContent: {
+      type: [Object, Array],
+    },
+    btnContent: {
+      type: [Object, Array],
+    },
+    rowClassName: {
+      type: [String, Function],
+    },
+    treeProps: {
+      type: [Object],
+    },
+    rowKey: [String, Function],
+    defaultExpandAll: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data,
+  computed: {
+    ...mapState(["glo_loading"]),
+  },
+  mounted() {},
+  methods,
+  components: { SearchCmp },
+};
+</script>
+<style lang="scss" src="./index.scss" scoped></style>

package/src/components/TableCmp/methods.js

@@ -1,35 +1,35 @@
-export default {
-  // ------------------------------------------------------------------
-  // pragma mark - inti(初始化行为)
-  // ------------------------------------------------------------------
-  handleSelectionChange(val) {
-    this.$emit("select-change", val);
-  },
-  handleCommand(val) {
-    this.$emit("btn-click", val);
-  },
-  btnsClick(obj) {
-    this.$emit("btns-click", obj);
-  },
-  handleSearch() {
-    this.handleCurrentChange(1);
-  },
-
-  handleSizeChange(val) {
-    this.query.pageInfo.pageSize = val;
-    this.$emit("loadData");
-  },
-
-  handleCurrentChange(val) {
-    this.query.pageInfo.page = val;
-    this.$emit("loadData");
-  },
-
-  customSortChange(obj) {
-    this.query.orderAsc = obj.order == "ascending" ? true : false;
-    this.query.orderBy = obj.prop;
-    if (obj.order) {
-      this.$emit("loadData");
-    }
-  }
-};
+export default {
+  // ------------------------------------------------------------------
+  // pragma mark - inti(初始化行为)
+  // ------------------------------------------------------------------
+  handleSelectionChange(val) {
+    this.$emit("select-change", val);
+  },
+  handleCommand(val) {
+    this.$emit("btn-click", val);
+  },
+  btnsClick(obj) {
+    this.$emit("btns-click", obj);
+  },
+  handleSearch() {
+    this.handleCurrentChange(1);
+  },
+
+  handleSizeChange(val) {
+    this.query.pageInfo.pageSize = val;
+    this.$emit("loadData");
+  },
+
+  handleCurrentChange(val) {
+    this.query.pageInfo.page = val;
+    this.$emit("loadData");
+  },
+
+  customSortChange(obj) {
+    this.query.orderAsc = obj.order == "ascending" ? true : false;
+    this.query.orderBy = obj.prop;
+    if (obj.order) {
+      this.$emit("loadData");
+    }
+  }
+};

package/src/components/TableItem/TableItem.vue

@@ -1,56 +1,56 @@
-<template>
-    <el-table-column
-        :label="label"
-        :width="width"
-        :header-align="headerAlign" 
-        :align="align"
-    >
-      <template slot-scope="scope">
-        <template v-if="isSlot">
-            <slot :name="slotName" :row="scope.row" :index="scope.$index"></slot>
-        </template>
-        <template v-else>
-            <span>{{ scope.row[prop] }}</span>
-        </template>
-      </template>
-    </el-table-column>
-</template>
-
-<script>
-export default {
-    name: 'tableItem',
-    props: {
-        label: {
-            type: String,
-        },
-        width: {
-            type: [String, Number],
-        },
-        value: {
-            type: [String, Number]
-        },
-        headerAlign: {
-            type: String,
-            default:'center'
-        },
-        align: {
-            type: String,
-            default:'left'
-        },
-        prop: {
-            type: String,
-        },
-        isSlot: {
-            type: [String, Boolean],
-            default: true
-        },
-        slotName: {
-            type: String
-        }
-    }
-}
-</script>
-
-<style lang="scss" scoped>
-
+<template>
+    <el-table-column
+        :label="label"
+        :width="width"
+        :header-align="headerAlign" 
+        :align="align"
+    >
+      <template slot-scope="scope">
+        <template v-if="isSlot">
+            <slot :name="slotName" :row="scope.row" :index="scope.$index"></slot>
+        </template>
+        <template v-else>
+            <span>{{ scope.row[prop] }}</span>
+        </template>
+      </template>
+    </el-table-column>
+</template>
+
+<script>
+export default {
+    name: 'tableItem',
+    props: {
+        label: {
+            type: String,
+        },
+        width: {
+            type: [String, Number],
+        },
+        value: {
+            type: [String, Number]
+        },
+        headerAlign: {
+            type: String,
+            default:'center'
+        },
+        align: {
+            type: String,
+            default:'left'
+        },
+        prop: {
+            type: String,
+        },
+        isSlot: {
+            type: [String, Boolean],
+            default: true
+        },
+        slotName: {
+            type: String
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+
 </style>

package/src/components/TextOVer/index.vue

@@ -1,56 +1,56 @@
-<template>
-  <div class="textOVer">
-    <span class="textOVerThree">
-      {{ text }}
-    </span>
-    <el-button
-      v-if="text"
-      type="text"
-      size="mini"
-      v-clipboard:copy="text"
-      v-clipboard:success="onCopy"
-      v-clipboard:error="onError"
-      >复制</el-button
-    >
-  </div>
-
-  <!-- 
-    导入 :import
-    调用: <TextOVer :text="text"></TextOVer>
-   -->
-</template>
-<script>
-export default {
-  props: {
-    text: [String],
-  },
-  methods: {
-    onCopy: function (e) {
-      this.$message({
-        type: "success",
-        message: "复制成功",
-      });
-    },
-    onError: function (e) {
-      this.$message({
-        type: "error",
-        message: "复制失败",
-      });
-    },
-  },
-};
-</script>
-<style lang="scss">
-.textOVer {
-  text-align: center;
-  .textOVerThree {
-    display: -webkit-box;
-    overflow: hidden;
-    white-space: normal !important;
-    text-overflow: ellipsis;
-    word-wrap: break-word;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;
-  }
-}
+<template>
+  <div class="textOVer">
+    <span class="textOVerThree">
+      {{ text }}
+    </span>
+    <el-button
+      v-if="text"
+      type="text"
+      size="mini"
+      v-clipboard:copy="text"
+      v-clipboard:success="onCopy"
+      v-clipboard:error="onError"
+      >复制</el-button
+    >
+  </div>
+
+  <!-- 
+    导入 :import
+    调用: <TextOVer :text="text"></TextOVer>
+   -->
+</template>
+<script>
+export default {
+  props: {
+    text: [String],
+  },
+  methods: {
+    onCopy: function (e) {
+      this.$message({
+        type: "success",
+        message: "复制成功",
+      });
+    },
+    onError: function (e) {
+      this.$message({
+        type: "error",
+        message: "复制失败",
+      });
+    },
+  },
+};
+</script>
+<style lang="scss">
+.textOVer {
+  text-align: center;
+  .textOVerThree {
+    display: -webkit-box;
+    overflow: hidden;
+    white-space: normal !important;
+    text-overflow: ellipsis;
+    word-wrap: break-word;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+  }
+}
 </style>