hbte-saas-ui 0.0.1

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "hbte-saas-ui",
+  "version": "0.0.1",
+  "main": "./lib/hbte-ui.umd.min.js",
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build",
+    "lint": "vue-cli-service lint",
+    "lib": "vue-cli-service build --target lib --name hbte-ui --dest lib packages/index.js",
+    "doc": "vuePress dev docs --temp .temp",
+    "docs:build": "vuePress build docs"
+  },
+  "dependencies": {
+    "core-js": "^3.6.5",
+    "element-ui": "^2.15.6",
+    "pinyin-match": "^1.2.2",
+    "vue": "^2.6.11",
+    "vue-router": "^3.2.0",
+    "vuedraggable": "^2.24.3",
+    "vuex": "^4.0.2"
+  },
+  "devDependencies": {
+    "@vue/cli-plugin-babel": "~4.5.12",
+    "@vue/cli-plugin-eslint": "~4.5.12",
+    "@vue/cli-plugin-router": "~4.5.12",
+    "@vue/cli-service": "~4.5.12",
+    "@vue/eslint-config-prettier": "^6.0.0",
+    "axios": "^0.21.1",
+    "babel-eslint": "^10.1.0",
+    "eslint": "^6.7.2",
+    "eslint-plugin-prettier": "^3.3.1",
+    "eslint-plugin-vue": "^6.2.2",
+    "lodash": "^4.17.21",
+    "prettier": "^2.2.1",
+    "sass": "^1.29.0",
+    "sass-loader": "^10.1.0",
+    "vue-template-compiler": "^2.6.11",
+    "vuepress": "^1.9.7"
+  }
+}

package/packages/adv-query/index.js

@@ -0,0 +1,5 @@
+import HbAdvQuery from "./src/main.vue";
+HbAdvQuery.install = function (Vue) {
+  Vue.component(HbAdvQuery.name, HbAdvQuery);
+};
+export default HbAdvQuery;

package/packages/adv-query/src/main.vue

@@ -0,0 +1,294 @@
+<template>
+  <div class="hb-advquery">
+    <div class="hb-advquery-handles">
+      <div class="hb-advquery__tools">
+        <slot name="tools"></slot>
+      </div>
+      <div class="hb-advquery-query-btn">
+        <el-button
+          size="mini"
+          class="hb-advquery-query-btn__item"
+          @click="extend ? unextend() : extendFrom()"
+          v-if="showAdvQuery"
+          icon="hbui-gaojichaxun"
+        >
+          高级查询
+        </el-button>
+
+        <slot name="cusBtn"></slot>
+        <el-dropdown trigger="click" size="small" v-if="showCusQuery">
+          <div
+            v-if="customQueryLabel.length > 10"
+            class="hb-advquery-query-btn__custom"
+          >
+            <el-tooltip :content="customQueryLabel">
+              <span>{{ customQueryLabel.slice(0, 10) + "..." }}</span>
+            </el-tooltip>
+          </div>
+          <div v-else class="hb-advquery-query-btn__custom">
+            {{ customQueryLabel }}
+          </div>
+
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item
+              ><span @click="customQuery({ label: '全部', value: 'all' })"
+                >全部</span
+              ></el-dropdown-item
+            >
+            <el-dropdown-item>
+              <slot name="dropdownSlotItem"></slot>
+            </el-dropdown-item>
+
+            <el-dropdown-item
+              v-for="(i, index) in customQueryData"
+              :key="index"
+              :command="i.value"
+            >
+              <span v-if="i.label.length > 10"
+                ><el-tooltip :content="customQueryLabel">
+                  <span
+                    @click="customQuery(i)"
+                    class="hb-advquery-query-btn__custom__dropdown-item"
+                    >{{ i.label.slice(0, 10) + "..." }}</span
+                  >
+                </el-tooltip></span
+              ><span
+                @click="customQuery(i)"
+                v-else
+                class="hb-advquery-query-btn__custom__dropdown-item"
+                >{{ i.label }}</span
+              >
+              <i
+                class="el-icon-delete hb-advquery-query-btn__custom__handle-btn"
+                size="mini"
+                @click="deleteCus(i)"
+              ></i>
+              <i
+                class="el-icon-edit hb-advquery-query-btn__custom__handle-btn"
+                size="mini"
+                @click="editCus(i)"
+              ></i>
+            </el-dropdown-item>
+
+            <span @click="addCus">
+              <el-dropdown-item divided icon="el-icon-plus">
+                新建筛选</el-dropdown-item
+              >
+            </span>
+          </el-dropdown-menu>
+        </el-dropdown>
+        <el-button
+          size="mini"
+          class="hb-advquery-query-btn__item"
+          v-if="showRefresh"
+          @click="refresh"
+          icon="hbui-shuaxin"
+        >
+          刷新
+        </el-button>
+      </div>
+    </div>
+    <div
+      class="hb-advquery-form"
+      id="qry-form"
+      :class="extend ? 'hb-advquery-form-extend' : 'hb-advquery-form-unextend'"
+    >
+      <el-form
+        class="hb-advquery-form__content"
+        ref="queryForm"
+        :model="qryFormData"
+        label-position="top"
+        :rules="rules"
+      >
+        <div class="hb-advquery-form__row">
+          <el-form-item
+            v-for="(i, index) in qryFormProps"
+            :key="index"
+            class="hb-advquery-form__item"
+            :label="i.label"
+            :prop="i.prop ? i.prop : ''"
+          >
+            <hb-query-form
+              :formProp="i"
+              :qryFormData="qryFormData"
+              v-bind="i.bind"
+            >
+              <template :slot="i.prop" :index="index">
+                <slot :name="i.prop"></slot>
+              </template>
+            </hb-query-form>
+          </el-form-item>
+          <div class="hb-advquery-search-button">
+            <el-button
+              class="hb-advquery-search-button__btn"
+              size="small"
+              @click="advQuery"
+              type="primary"
+              >查询</el-button
+            >
+            <el-button
+              class="hb-advquery-search-button__btn"
+              @click="reset"
+              size="small"
+              >重置</el-button
+            >
+            <el-button
+              class="el-icon-arrow-up hb-advquery-search-button__extend"
+              size="small"
+              @click="unextend"
+            ></el-button>
+          </div>
+        </div>
+      </el-form>
+    </div>
+    <hb-custom-query
+      ref="dialog"
+      :qryFormProps="qryFormProps"
+      :qryFormData="qryFormData"
+      @customQuerySave="customQuerySave"
+    ></hb-custom-query>
+  </div>
+</template>
+<script>
+export default {
+  name: "HbAdvquery",
+  componentName: "HbAdvquery",
+  props: {
+    sessionExtend: {
+      type: Boolean,
+      default: true,
+    },
+    qryFormProps: {
+      type: Array,
+      default: () => [],
+    },
+    qryFormData: {
+      type: Object,
+      default: () => {
+        return {
+          AdvQueryExtend: false,
+        };
+      },
+    },
+    customQueryData: {
+      type: Array,
+      default: () => [],
+    },
+    showAdvQuery: {
+      type: Boolean,
+      default: true,
+    },
+    showCusQuery: {
+      type: Boolean,
+      default: true,
+    },
+    showRefresh: {
+      type: Boolean,
+      default: true,
+    },
+    rules: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  data() {
+    return {
+      customQueryLabel: "全部",
+      firstExtend: true, // 首次展开
+      extend: false,
+      sessionKey: "",
+    };
+  },
+  created() {
+    if (this.sessionExtend) {
+      this.sessionKey =
+        "Extend-" + this.$router.options.base + this.$route.fullPath;
+      let localData = sessionStorage.getItem(this.sessionKey);
+      this.extend = localData ? JSON.parse(localData) : false;
+    }
+  },
+  beforeDestroy() {
+    const { sessionExtend, extend, sessionKey } = this;
+    sessionExtend && sessionStorage.setItem(sessionKey, JSON.stringify(extend));
+  },
+  methods: {
+    /**
+     * 自定义筛选点击查询
+     */
+    customQuery(val) {
+      console.log(val);
+
+      this.customQueryLabel = val.label;
+      this.$emit("customQuery", val);
+    },
+    /**
+     * 刷新
+     */
+    refresh() {
+      this.$emit("refresh");
+    },
+    /**
+     * 新增自定义
+     */
+    addCus() {
+      this.$refs.dialog.open("add");
+    },
+    /**
+     * 编辑自定义
+     */
+    editCus(i) {
+      this.$refs.dialog.open("edit", i);
+    },
+    /**
+     * 删除自定义
+     */
+    deleteCus(i) {
+      this.$emit("deleteCus", i);
+    },
+    /**
+     * 自定义保存
+     */
+    customQuerySave(type, data) {
+      console.log(type);
+      console.log(data);
+    },
+    /**
+     * 查询回调
+     */
+    advQuery() {
+      console.log(this.qryFormData);
+      this.$emit("advQuery", this.qryFormData);
+    },
+    /**
+     * 重置
+     */
+    reset() {
+      this.$refs.queryForm.resetFields();
+      this.$emit("reset");
+    },
+    /**
+     * 高级查询展开
+     */
+    extendFrom() {
+      if (this.extend) {
+        this.unextend();
+        return;
+      }
+
+      // 首次展开
+      if (this.firstExtend) {
+        this.$emit("firstExtend");
+        this.firstExtend = false;
+      }
+      // 展开回调
+      this.$emit("extendFrom");
+      //展开
+      this.extend = true;
+    },
+    unextend() {
+      //收起
+      this.extend = false;
+    },
+  },
+};
+</script>

package/packages/area-select/index.js

@@ -0,0 +1,7 @@
+import HbAreaSelect from "./src/main.vue";
+
+HbAreaSelect.install = function (Vue) {
+  Vue.component(HbAreaSelect.name, HbAreaSelect);
+};
+
+export default HbAreaSelect;

package/packages/area-select/src/main.vue

@@ -0,0 +1,37 @@
+<template>
+  <el-cascader
+    size="small"
+    :options="areaData"
+    :props="propsSetting"
+    :placeholder="placeholder"
+    clearable
+    v-bind="$attrs"
+    v-on="$listeners"
+  ></el-cascader>
+</template>
+
+<script>
+export default {
+  name: "HbAreaSelect",
+  componentName: "HbAreaSelect",
+
+  props: {
+    placeholder: {
+      default: "请选择",
+      type: String,
+    },
+    propsSetting: {
+      default: () => {
+        return { checkStrictly: true };
+      },
+      type: Object,
+    },
+    areaData: {
+      default: () => {
+        return [];
+      },
+      type: Array,
+    },
+  },
+};
+</script>

package/packages/authority/index.js

@@ -0,0 +1,5 @@
+import HbAuthority from "./src/main.vue";
+HbAuthority.install = function (Vue) {
+  Vue.component(HbAuthority.name, HbAuthority);
+};
+export default HbAuthority;