tianheng-ui 0.0.3 → 0.0.4

package/src/component/table/column.vue

@@ -1,111 +0,0 @@
-<template>
-  <div>
-    <template v-for="(item, index) in options">
-      <template v-if="!item.hide">
-        <el-table-column
-          v-if="item.type"
-          :key="index"
-          :type="item.type"
-          :label="item.label"
-          width="50"
-        >
-        </el-table-column>
-        <el-table-column
-          v-else-if="item.children"
-          :key="index"
-          :prop="item.prop"
-          :label="item.label"
-          :width="item.width"
-          :align="item.align"
-          :fixed="item.fixed"
-          :sortable="item.sortable"
-          :sort-method="item.sortMethod"
-          show-overflow-tooltip
-        >
-          <TableColumn :key="index" :options="item.children"></TableColumn>
-        </el-table-column>
-        <el-table-column
-          v-else
-          :key="index"
-          :prop="item.prop"
-          :label="item.label"
-          :width="item.width"
-          :align="item.align"
-          :fixed="item.fixed"
-          :sortable="item.sortable"
-          :sort-method="item.sortMethod"
-          show-overflow-tooltip
-        >
-          <template slot-scope="scope">
-            <slot v-if="item.slot" name="slot" :scope="scope" :option="item" />
-            <div v-else>{{ scope.row[item.prop] }}</div>
-          </template>
-        </el-table-column>
-      </template>
-    </template>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "TableColumn",
-  props: {
-    options: {
-      type: Array,
-      default: () => {
-        return [];
-      },
-    },
-  },
-  created(){
-    /**
-     * 
-     * <template v-if={!item.hide}>
-            <el-table-column
-              v-if={item.type}
-              type={item.type}
-              label={item.label}
-              width="50"
-            ></el-table-column>
-            <el-table-column
-              v-else-if={item.children}
-              prop={item.prop}
-              label={item.label}
-              width={item.width}
-              align={item.align}
-              fixed={item.fixed}
-              sortable={item.sortable}
-              sort-method={item.sortMethod}
-              show-overflow-tooltip
-            >
-              {this.dynamicItem(item.children)}
-            </el-table-column>
-            <el-table-column
-              v-else
-              prop={item.prop}
-              label={item.label}
-              width={item.width}
-              align={item.align}
-              fixed={item.fixed}
-              sortable={item.sortable}
-              sort-method={item.sortMethod}
-              show-overflow-tooltip
-            >
-              <template slot-scope="scope">
-                <slot
-                  v-if={item.slot}
-                  name="slot"
-                  scope={scope}
-                  option={item}
-                />
-                <div v-else>{scope.row[item.prop]}</div>
-              </template>
-            </el-table-column>
-          </template>
-     */
-    console.log(this.options)
-  }
-};
-</script>
-
-<style></style>

package/src/component/table/index.js

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

package/src/component/table/index.vue

@@ -1,251 +0,0 @@
-<template>
-  <div class="th-table">
-    <el-table
-      ref="th_table"
-      v-loading="loading"
-      :data="data"
-      :row-key="rowKey"
-      stripe
-      :highlight-current-row="selectType === 'single'"
-      :tree-props="treeProps"
-      @current-change="handleSingleSelect"
-      @row-dblclick="dblclick"
-      @selection-change="handleSelectionChange"
-    >
-      <template v-for="(item, index) in options">
-        <template v-if="!item.hide">
-          <el-table-column
-            v-if="item.type"
-            :key="index"
-            :type="item.type"
-            :label="item.label"
-            width="50"
-          >
-          </el-table-column>
-          <el-table-column
-            v-else-if="item.children"
-            :key="index"
-            :prop="item.prop"
-            :label="item.label"
-            :width="item.width"
-            :align="item.align || 'left'"
-            :fixed="item.fixed || null"
-            :sortable="item.sortable"
-            :sort-method="item.sortMethod"
-            show-overflow-tooltip
-          >
-            <table-column :options="item.children"></table-column>
-          </el-table-column>
-          <el-table-column
-            v-else
-            :key="index"
-            :prop="item.prop"
-            :label="item.label"
-            :width="item.width"
-            :align="item.align || 'left'"
-            :fixed="item.fixed || null"
-            :sortable="item.sortable"
-            :sort-method="item.sortMethod"
-            show-overflow-tooltip
-          >
-            <template slot-scope="scope">
-              <slot
-                v-if="item.slot"
-                :name="item.slot"
-                :scope="scope"
-                :option="item"
-              />
-              <div v-else>{{ scope.row[item.prop] }}</div>
-            </template>
-          </el-table-column>
-        </template>
-      </template>
-      <!-- <table-column :options="options">
-        <template #slot="{ scope,option }">
-          <slot :name="option.slot" :scope="scope" :option="option" />
-        </template>
-      </table-column> -->
-      <template #empty>
-        <div>
-          {{ loading ? loadingText || "加载中" : emptyText || "暂无数据" }}
-        </div>
-      </template>
-    </el-table>
-    <!-- <i class="th-table-more el-icon-setting"></i> -->
-
-    <div v-if="Object.keys(pageInfo).length > 0 && showPage" class="pagination">
-      <el-pagination
-        :current-page="pageInfo.currentPage"
-        :page-sizes="pageInfo.sizes"
-        :page-size="pageInfo.pageSize"
-        layout="total, prev, pager, next, sizes"
-        :total="pageInfo.total"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        @prev-click="handlePrevClick"
-        @next-click="handleNextClick"
-      />
-    </div>
-  </div>
-</template>
-
-<script>
-import TableColumn from "./column.vue";
-
-export default {
-  name:'ThTable',
-  components: {
-    TableColumn,
-  },
-  props: {
-    data: {
-      type: Array,
-      default: () => {
-        return [];
-      },
-    },
-    options: {
-      type: Array,
-      default: () => {
-        return [];
-      },
-    },
-    // single:单行选中    multiple:多行选中
-    selectType: {
-      type: String,
-      default: () => {
-        return "";
-      },
-    },
-    // 行双击事件
-    dblclick: {
-      type: Function,
-      default: () => {
-        return null;
-      },
-    },
-    treeProps: {
-      type: Object,
-      default: function() {
-        return {};
-      },
-    },
-    // 对象，不传表示没有分页,包含三个参数,均必填pageSize：每页展示的条数。currentPage：当前页码。pageCount：总页数
-    pageInfo: {
-      type: Object,
-      default: function() {
-        return {};
-      },
-    },
-    loading: {
-      type: Boolean,
-      default: () => {
-        return false;
-      },
-    },
-    height: {
-      type: String,
-      default: () => {
-        return "";
-      },
-    },
-    rowKey: {
-      type: String,
-      default: () => {
-        return "";
-      },
-    },
-    showPage: {
-      type: Boolean,
-      default: () => {
-        return true;
-      },
-    },
-    emptyText: {
-      type: String,
-      default: () => {
-        return "暂无数据";
-      },
-    },
-    loadingText: {
-      type: String,
-      default: () => {
-        return "加载中";
-      },
-    },
-  },
-  data() {
-    return {};
-  },
-  methods: {
-    handleSelectionChange(currentRow) {
-      if (currentRow) {
-        this.$emit("selection-change", currentRow);
-      }
-    },
-    // 选中行--单选
-    handleSingleSelect(currentRow, oldCurrentRow) {
-      if (currentRow) {
-        this.$emit("select-row-change", currentRow);
-      }
-    },
-    // 每页展示的条数 改变时
-    handleSizeChange(val) {
-      this.pageInfo.pageSize = val;
-      this.$emit(
-        "pageNumberChange",
-        this.pageInfo.currentPage,
-        this.pageInfo.pageSize
-      );
-    },
-    // 当前页码 改变时
-    handleCurrentChange(val) {
-      this.pageInfo.currentPage = val;
-      this.$emit(
-        "pageNumberChange",
-        this.pageInfo.currentPage,
-        this.pageInfo.pageSize
-      );
-    },
-    // 点击上一页
-    handlePrevClick() {
-      if (this.pageInfo.currentPage === 1) return;
-      this.pageInfo.currentPage -= 1;
-      this.$emit(
-        "pageNumberChange",
-        this.pageInfo.currentPage,
-        this.pageInfo.pageSize
-      );
-    },
-    // 点击下一页
-    handleNextClick() {
-      if (this.pageInfo.currentPage === this.pageInfo.pageCount) return;
-      this.pageInfo.currentPage += 1;
-      this.$emit(
-        "pageNumberChange",
-        this.pageInfo.currentPage,
-        this.pageInfo.pageSize
-      );
-    },
-    getTable() {
-      return this.$refs["th_table"];
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped>
-.th-table {
-  position: relative;
-  width: 100%;
-  .pagination {
-    margin-top: 20px;
-  }
-  &-more {
-    position: absolute;
-    top: 13px;
-    right: 5px;
-    cursor: pointer;
-  }
-}
-</style>

package/src/component/table/search.vue

@@ -1,105 +0,0 @@
-<template>
-  <div class="table-search">
-    <template v-for="(item, index) in options">
-      <el-input
-        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
-        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>
-    </template>
-
-    <el-button
-      type="primary"
-      icon="el-icon-search"
-      size="mini"
-      plain
-      @click="doSearch"
-      >查询</el-button
-    >
-    <el-button
-      type="primary"
-      icon="el-icon-refresh-right"
-      size="mini"
-      plain
-      @click="doReset"
-      >重置</el-button
-    >
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    options: {
-      type: Array,
-      default: () => {
-        return [];
-      },
-    },
-    params: {
-      type: Object,
-      default: () => {
-        return {};
-      },
-    },
-  },
-  data() {
-    return {
-      datePickerTypes: [
-        "year",
-        "month",
-        "date",
-        "dates",
-        "week",
-        "datetime",
-        "datetimerange",
-        "daterange",
-        "monthrange",
-      ],
-    };
-  },
-  methods: {
-    doSearch() {
-      this.$emit("on-search", this.params);
-    },
-    doReset() {
-      this.params = {};
-      this.$emit("on-reset", this.params);
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped>
-.table-search {
-  display: flex;
-  align-items: center;
-  margin-bottom: 10px;
-  &-item {
-    margin-right: 10px;
-  }
-}
-.table-search-item:last-child {
-  margin-right: 20px !important;
-}
-</style>

package/src/component/table/tools.vue

@@ -1,98 +0,0 @@
-<template>
-  <div class="tableTools">
-    <template v-for="(item, index) in options">
-      <el-button
-        v-if="item.act_type === 'add'"
-        :key="index"
-        :style="{ color: item.btn_color }"
-        :type="item.btn_type"
-        :icon="item.btn_icon"
-        :disabled="item.btn_disabled"
-        @click="doAdd(item)"
-        >{{ item.btn_name }}</el-button
-      >
-      <el-button
-        v-if="item.act_type === 'refresh'"
-        :key="index"
-        :style="{ color: item.btn_color }"
-        :type="item.btn_type"
-        :icon="item.btn_icon"
-        :disabled="item.btn_disabled"
-        @click="doRefresh(item)"
-        >{{ item.btn_name }}</el-button
-      >
-      <el-button
-        v-if="item.act_type === 'export'"
-        :key="index"
-        :style="{ color: item.btn_color }"
-        :type="item.btn_type"
-        :icon="item.btn_icon"
-        :disabled="item.btn_disabled"
-        @click="doExport(item)"
-        >{{ item.btn_name }}</el-button
-      >
-      <el-button
-        v-if="item.act_type === 'batch'"
-        :key="index"
-        :style="{ color: item.btn_color }"
-        :type="item.btn_type"
-        :icon="item.btn_icon"
-        :disabled="item.btn_disabled || selectionDisabled"
-        :loading="loadingDel"
-        @click="doBatch(item)"
-        >{{ item.btn_name }}</el-button
-      >
-    </template>
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    options: {
-      type: Array,
-      default: () => {
-        return [];
-      },
-    },
-    selectionDisabled: {
-      type: Boolean,
-      default: () => {
-        return true;
-      },
-    },
-  },
-  data() {
-    return {
-      loadingDel: false,
-    };
-  },
-  methods: {
-    doEval(item) {
-      this.$emit("on-eval", item);
-    },
-    doAdd(item) {
-      this.$emit("on-add", item);
-    },
-    doRefresh(item) {
-      this.$emit("on-refresh", item);
-    },
-    doExport(item) {
-      this.$emit("on-export", item);
-    },
-    doBatch(item) {
-      this.loadingDel = true;
-      const callback = (bool) => {
-        this.loadingDel = false;
-      };
-      this.$emit("on-batch", item, callback);
-    },
-  },
-};
-</script>
-
-<style lang="less">
-.tableTools {
-  margin-bottom: 10px;
-}
-</style>

package/webpack.config.js

@@ -1,97 +0,0 @@
-var path = require("path");
-var webpack = require("webpack");
-
-module.exports = {
-  // entry: './src/main.js',
-  entry: "./src/index.js",
-  output: {
-    path: path.resolve(__dirname, "./dist"),
-    publicPath: "/dist/",
-    filename: "tianheng-ui.js",
-    library: "tianheng-ui",
-    libraryTarget: "umd",
-    umdNamedDefine: true
-  },
-  module: {
-    rules: [
-      {
-        test: /\.css$/,
-        use: ["vue-style-loader", "css-loader"]
-      },
-      {
-        test: /\.scss$/,
-        use: ["vue-style-loader", "css-loader", "sass-loader"]
-      },
-      {
-        test: /\.sass$/,
-        use: ["vue-style-loader", "css-loader", "sass-loader?indentedSyntax"]
-      },
-      {
-        test: /\.vue$/,
-        loader: "vue-loader",
-        options: {
-          loaders: {
-            // Since sass-loader (weirdly) has SCSS as its default parse mode, we map
-            // the "scss" and "sass" values for the lang attribute to the right configs here.
-            // other preprocessors should work out of the box, no loader config like this necessary.
-            scss: ["vue-style-loader", "css-loader", "sass-loader"],
-            sass: [
-              "vue-style-loader",
-              "css-loader",
-              "sass-loader?indentedSyntax"
-            ]
-          }
-          // other vue-loader options go here
-        }
-      },
-      {
-        test: /\.js$/,
-        loader: "babel-loader",
-        exclude: /node_modules/
-      },
-      {
-        test: /\.(png|jpg|gif|svg|woff|ttf)$/,
-        loader: "file-loader",
-        options: {
-          name: "[name].[ext]?[hash]"
-        }
-      },
-    ]
-  },
-  resolve: {
-    alias: {
-      vue$: "vue/dist/vue.esm.js"
-    },
-    extensions: ["*", ".js", ".vue", ".json"]
-  },
-  devServer: {
-    historyApiFallback: true,
-    noInfo: true,
-    overlay: true
-  },
-  performance: {
-    hints: false
-  },
-  devtool: "#eval-source-map"
-};
-
-if (process.env.NODE_ENV === "production") {
-  module.exports.devtool = "#source-map";
-  // http://vue-loader.vuejs.org/en/workflow/production.html
-  module.exports.plugins = (module.exports.plugins || []).concat([
-    new webpack.DefinePlugin({
-      "process.env": {
-        NODE_ENV: '"production"'
-      }
-    }),
-    new webpack.optimize.UglifyJsPlugin({
-      sourceMap: true,
-      compress: {
-        warnings: false
-      }
-    }),
-    new webpack.LoaderOptionsPlugin({
-      minimize: true
-    })
-  ]);
-}