hbte-saas-ui 0.0.2 → 1.0.0

package/examples/views/HBImageViewer.vue

@@ -1,57 +0,0 @@
-<template>
-  <div class="wrapper">
-    <img
-      v-for="(item, index) in urls"
-      :src="item"
-      :key="index"
-      alt=""
-      @click="show(index)"
-    />
-    <!-- <hb-image-viewer></hb-image-viewer> -->
-    <div>
-      <pre>
-        快捷键功能   esc => 关闭弹窗
-                    →   => 下一张
-                    ←   => 上一张
-                    鼠标滚轮下  => 放大
-                    鼠标滚轮上  => 缩小
-
-      </pre>
-    </div>
-  </div>
-</template>
-<script>
-import img1 from "../image/hb-image-viewer/3k.jpg";
-import img2 from "../image/hb-image-viewer/a.jpg";
-import img3 from "../image/hb-image-viewer/b.jpg";
-
-export default {
-  data() {
-    return {
-      zIndex: 200, //组件内默认100
-      urls: [img1, img2, img3],
-    };
-  },
-  methods: {
-    show(index) {
-      this.$hbViewer({
-        urls: this.urls,
-        activeIndex: index,
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.wrapper {
-  img {
-    width: 100px;
-    height: 100px;
-    object-fit: contain;
-    border: 1px solid #000;
-    margin: 10px;
-    background: #fff;
-  }
-}
-</style>

package/examples/views/HBNavMenu.vue

@@ -1,37 +0,0 @@
-<template>
-  <div>
-    <hb-navmenu :data="menuList" :props="defaultProps"></hb-navmenu>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      menuList: [
-        {
-          label: "说明1",
-          icon: "el-icon-delete",
-          path: "/HBNavMenu",
-          children: [
-            {
-              label: "说明文字说明文字说明文字",
-              icon: "el-icon-delete",
-              path: "/HBNavMenu/pathsub1",
-            },
-          ],
-        },
-      ],
-      defaultProps: {
-        icon: "icon",
-        label: "label",
-        path: "path",
-        children: "children",
-        id: "id",
-      },
-    };
-  },
-};
-</script>
-
-<style></style>

package/examples/views/HBOrganizeDialog.vue

@@ -1,133 +0,0 @@
-<template>
-  <div>
-    <hb-organize-dialog
-      :deptOnly="deptOnly"
-      :cancelAble="cancelAble"
-      ref="organize"
-      @confirm="confirm"
-    />
-    <el-button @click="open">选择部门和人员</el-button>
-    <el-button @click="openDept">仅选择部门</el-button>
-  </div>
-</template>
-<script>
-import organizeData from "../mock/organizeData";
-import { deptData } from "../mock/dept";
-
-export default {
-  data() {
-    return {
-      deptOnly: false,
-      cancelAble: true,
-      checkedList: [
-        //要把当前登录账号传进去,如果后端没返的话
-        {
-          id: "1",
-          isDept: "0",
-          name: "admin",
-          key: "value", //传入额外的key在选中时会抛出来！！
-        },
-        {
-          id: "373449754",
-          isDept: "1",
-          name: "微测中心",
-        },
-        {
-          id: "425752602",
-          isDept: "1",
-          name: "区域中心",
-        },
-        {
-          id: "774345882437943296",
-          isDept: "0",
-          name: "刘洋",
-        },
-        {
-          id: "774345860757585920",
-          isDept: "0",
-          name: "尹松",
-        },
-        {
-          id: "774345856772997120",
-          isDept: "0",
-          name: "许小辉",
-        },
-      ],
-      checkedDeptList: [
-        {
-          id: "455215811",
-          name: "商务组",
-        },
-        {
-          id: "455114863",
-          name: "销售组",
-        },
-      ],
-      data: organizeData,
-    };
-  },
-  methods: {
-    openDept() {
-      this.deptOnly = true;
-      this.$refs.organize.open();
-      let p1 = new Promise((resolve) => {
-        setTimeout(() => {
-          this.fixData(deptData);
-          resolve(deptData);
-        }, 0);
-      });
-      let p2 = new Promise((resolve) => {
-        setTimeout(() => {
-          let arr = this.checkedDeptList.map((item) =>
-            Object.assign(item, { isDept: "1" })
-          );
-          resolve(arr);
-        }, 0);
-      });
-      Promise.all([p1, p2])
-        .then((res) => {
-          this.$refs.organize.init(res[0][0], res[1]);
-        })
-        .catch((err) => {
-          console.log(err);
-        });
-    },
-    fixData(deptData) {
-      deptData.forEach((item) => {
-        item.children = item.child || [];
-        item.isDept = "1";
-        item.child?.length && this.fixData(item.child);
-      });
-    },
-    open() {
-      this.deptOnly = false;
-      this.$refs.organize.open();
-      let p1 = new Promise((resolve) => {
-        setTimeout(() => {
-          resolve(this.data); //!!!!!data是obj不是array
-        }, 0);
-      });
-      let p2 = new Promise((resolve) => {
-        setTimeout(() => {
-          resolve(this.checkedList);
-        }, 0);
-      });
-      Promise.all([p1, p2])
-        .then((res) => {
-          this.$refs.organize.init(res[0], res[1]);
-        })
-        .catch((err) => {
-          console.log(err);
-        });
-    },
-    confirm(data) {
-      console.log(data);
-      //不会自动关闭人员选择框需要手动调用
-      // this.$refs.organize.close()
-    },
-  },
-};
-</script>
-
-<style>
-</style>

package/examples/views/HBPagination.vue

@@ -1,80 +0,0 @@
-<template>
-  <div>
-    <hb-pagination
-      :columns="columns"
-      :pageData="pageData"
-      :pageSizes="pageSizes"
-      @change="handlePageChange"
-      @changeColumn="handleChangeColumn"
-    >
-    </hb-pagination>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      columns: [
-        {
-          prop: "name",
-          label: "名称",
-          currentSelect: true,
-        },
-        {
-          prop: "code",
-          label: "编码",
-          currentSelect: true,
-        },
-        {
-          prop: "company",
-          label: "公司",
-          currentSelect: true,
-        },
-        {
-          prop: "addr",
-          label: "地址",
-          currentSelect: true,
-        },
-        {
-          prop: "desc",
-          label: "简介",
-          currentSelect: true,
-        },
-        {
-          prop: "remark",
-          label: "说明",
-          currentSelect: true,
-        },
-      ],
-      // 分页配置
-      pageData: {
-        pageSize: 2,
-        pageNum: 1,
-        total: 100,
-      },
-      pageSizes: [2, 30, 50, 100],
-    };
-  },
-  methods: {
-    /**
-     * @function handleChangeColumn 列改变
-     */
-    handleChangeColumn(newColumns) {
-      this.$message.success("列改变");
-      this.columns = newColumns;
-    },
-    /**
-     * @function handlePageChange 页码改变
-     */
-    handlePageChange() {
-      //
-      this.$message.success("页码改变");
-      console.log(arguments);
-    },
-  },
-  mounted() {},
-};
-</script>
-
-<style></style>

package/examples/views/HBSelectVague.vue

@@ -1,57 +0,0 @@
-<template>
-  <div class="demo-wrapper">
-    <hb-select-vague
-      :options="options"
-      :defaultProps="defaultProps"
-      multiple
-      v-model="selected"
-      @change="onSelected"
-    ></hb-select-vague>
-  </div>
-</template>
-<script>
-export default {
-  data() {
-    return {
-      options: [
-        {
-          id: 1,
-          name: "刘洋",
-          disabled: true,
-        },
-        {
-          id: 2,
-          name: "柏飞",
-        },
-        {
-          id: 3,
-          name: "白费了",
-        },
-        {
-          id: 4,
-          name: "一百飞",
-        },
-      ],
-      defaultProps: {
-        value: "id",
-        label: "name",
-      },
-      selected: "",
-    };
-  },
-  methods: {
-    onSelected(res) {
-      //this.formData.selectValue = res 模拟数据绑定
-      console.log("hb-selected下拉框已选数据：", res);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.demo-wrapper {
-  display: flex;
-  justify-content: center;
-  padding-top: 150px;
-}
-</style>

package/examples/views/HBToolgroup.vue

@@ -1,29 +0,0 @@
-<template>
-  <div>
-    <hb-toolgroup
-      :icons="['add', 'test', 'upload', 'delete']"
-      :tools="tools"
-      @event="handleEvent"
-      @search="handleSearch"
-    >
-      <el-button size="mini">附加按钮</el-button>
-    </hb-toolgroup>
-  </div>
-</template>
-<script>
-export default {
-  data() {
-    return {
-      tools: [{ event: "test", text: "测试" }],
-    };
-  },
-  methods: {
-    handleEvent(event) {
-      this.$message.success(`事件：${event}`);
-    },
-    handleSearch(kw) {
-      this.$message.success(`搜索：${kw}`);
-    },
-  },
-};
-</script>

package/examples/views/HBTopBar.vue

@@ -1,16 +0,0 @@
-<template>
-  <div>
-    <hb-top-bar></hb-top-bar>
-  </div>
-</template>
-<script>
-export default {
-  data() {
-    return {};
-  },
-  methods: {},
-};
-</script>
-
-<style>
-</style>

package/packages/adv-query/index.js

@@ -1,5 +0,0 @@
-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

@@ -1,294 +0,0 @@
-<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>