leadal-auth 0.0.2 → 0.0.3

package/src/components/organ-tree.vue

@@ -1,211 +0,0 @@
-<template>
-  <div class="organ-tree">
-    <div class="organ-tree-header f_between">
-      <h3>机构列表</h3>
-      <i
-        class="el-icon-circle-plus-outline"
-        style="font-size: 20px; cursor: pointer"
-        @click="h_showOrgConfig(null)"
-      ></i>
-    </div>
-    <div class="organ-tree-content">
-      <el-scrollbar style="height: 100%; padding: 14px; box-sizing: border-box">
-        <el-tree
-          ref="tree"
-          node-key="id"
-          :highlight-current="true"
-          :expand-on-click-node="false"
-          :props="props"
-          :load="f_loadNode"
-          lazy
-          @node-click="h_nodeClick"
-        >
-          <span class="custom-tree-node" slot-scope="{ data }">
-            <span class="node-text" :title="data.caption">{{
-              data.caption
-            }}</span>
-            <span class="action-buttons" style="width: 40px">
-              <i
-                class="el-icon-edit"
-                style="font-size: 16px"
-                @click="h_showOrgConfig(data)"
-              ></i>
-              <i
-                class="el-icon-delete"
-                @click="h_delOrg(data)"
-                style="margin-left: 10px; font-size: 16px"
-              ></i>
-            </span>
-          </span>
-        </el-tree>
-      </el-scrollbar>
-    </div>
-    <edit-user-dialog
-      v-if="visible"
-      @closed="visible = false"
-      :edit="edit"
-      @refresh="refreshTree"
-    />
-  </div>
-</template>
-
-<script>
-import { apiOrganTree, apiDelOrg } from "@/api";
-import EditUserDialog from "@/components/edit-user-dialog.vue";
-
-export default {
-  name: "organ-tree",
-  components: {
-    EditUserDialog,
-  },
-  data() {
-    return {
-      props: {
-        label: "caption",
-        // isLeaf: (data) => {
-        //   return data.hasChild === false
-        // }
-      },
-      form: {
-        sequence: 1,
-      },
-      rules: {
-        name: [
-          {
-            required: true,
-            message: "机构名称不能为空",
-          },
-        ],
-      },
-      edit: null,
-      visible: false,
-    };
-  },
-  methods: {
-    async refreshTree(type, parentId, data) {
-      if (type === "current") {
-        this.$refs.tree.updateKeyChildren(parentId, data);
-      } else {
-        this.$refs.tree.store.setData(data || []);
-      }
-    },
-    async f_loadNode(node, resolve) {
-      if (node.level === 0) {
-        const res = await apiOrganTree();
-        resolve(res.data || []);
-      } else {
-        const res = await apiOrganTree({ parentId: node.data.id });
-        res.data.forEach((item) => {
-          item.parentId = node.data.id;
-          item.parentName = node.data.caption;
-        });
-        resolve(res.data || []);
-      }
-    },
-    h_showOrgConfig(val) {
-      this.edit = val;
-      this.visible = true;
-    },
-    h_delOrg(val) {
-      this.$confirm("确认删除该项？", "提示", "warning")
-        .then(async (res) => {
-          if (res) {
-            await apiDelOrg({ ids: val.id });
-            this.$refs.tree.remove(val);
-            this.$message.success(`删除成功!`);
-          }
-        })
-        .catch((err) => {
-          console.error("用户状态 err", err);
-        });
-    },
-    h_nodeClick(val) {
-      this.$emit("load-user-data", val);
-    },
-  },
-};
-</script>
-
-<style scoped lang="scss">
-.organ-tree {
-  width: 100%;
-  height: 100%;
-  border: 1px solid #cedded;
-
-  .organ-tree-header {
-    width: 100%;
-    height: 50px;
-    padding: 0 10px;
-    background: #f9fbfd;
-    box-sizing: border-box;
-
-    h3 {
-      font-size: 16px;
-      color: #525252;
-      margin: 0;
-      padding: 0;
-    }
-
-    span {
-      color: #4e91ea;
-      cursor: pointer;
-    }
-  }
-
-  ::v-deep .custom-tree-node {
-    width: calc(100% - 34px);
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-
-    .node-text {
-      max-width: calc(100% - 60px);
-      display: inline-block;
-      overflow: hidden;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-    }
-
-    .action-buttons {
-      opacity: 0;
-      visibility: hidden;
-      transition: opacity 0.2s ease, visibility 0.2s ease;
-
-      i {
-        margin-left: 4px;
-        cursor: pointer;
-        color: #606266;
-
-        &:hover {
-          color: #409eff;
-        }
-      }
-    }
-
-    &:hover .action-buttons {
-      opacity: 1;
-      visibility: visible;
-    }
-  }
-
-  ::v-deep .el-dialog__header {
-    padding: 10px;
-
-    .el-dialog__headerbtn {
-      top: 14px;
-    }
-  }
-
-  .organ-tree-content {
-    width: 100%;
-    height: calc(100% - 50px);
-  }
-}
-
-::v-deep .el-tree-node__content {
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  padding: 5px 8px;
-}
-</style>

package/src/components/tree-select.vue

@@ -1,131 +0,0 @@
-<template>
-  <div class="tree-select" @click.stop>
-    <!-- 输入框部分 -->
-    <el-input
-        v-model="selectedLabel"
-        :placeholder="placeholder"
-        @click.native="toggleTree"
-    >
-    </el-input>
-    <!-- 树形下拉区域 -->
-    <div v-show="showTree" class="tree-container">
-      <el-scrollbar style="max-height: 300px;">
-        <el-tree
-            ref="tree"
-            :lazy="true"
-            :load="load"
-            :props="defaultProps"
-            @node-click="handleNodeClick"
-            node-key="id"
-        ></el-tree>
-      </el-scrollbar>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "tree-select",
-  props: {
-    value: [String, Number, Array], // 选中的值（单选）
-    placeholder: { type: String, default: '请选择' },
-    defaultLabel: {
-      type: String,
-      default: ''
-    },
-    load: {
-      type: Function,
-      default: () => { }
-    },
-    defaultProps: {
-      type: Object,
-      default: () => ({ })
-    }
-  },
-  data() {
-    return {
-      showTree: false,
-      selectedLabel: ''
-    };
-  },
-  watch: {
-    value: {
-      handler(val) {
-        // 根据 value 回显 label
-        if (val) {
-          this.updateLabel(val)
-        } else {
-          this.selectedLabel = '根目录'
-        }
-      },
-      immediate: true
-    }
-  },
-  mounted() {
-    // 监听点击其他空白区域事件
-    document.addEventListener('click', this.handleOutsideClick);
-  },
-  beforeDestroy() {
-    // 移除点击其他空白区域事件监听
-    document.removeEventListener('click', this.handleOutsideClick);
-  },
-  methods: {
-    toggleTree() {
-      this.showTree = !this.showTree;
-      console.log('this.showTree', this.showTree)
-    },
-    handleNodeClick(node) {
-      // 手动勾选当前节点
-      this.$nextTick(() => {
-        this.$refs.tree.setChecked(node, true, false);
-        this.handleSingleSelect(node);
-        this.showTree = false
-      });
-    },
-    handleSingleSelect(node) {
-      // 取消所有其他节点的勾选状态
-      const allNodes = this.$refs.tree.getCheckedNodes(false, true);
-      allNodes.forEach(n => {
-        if (n.id!== node.id) {
-          this.$refs.tree.setChecked(n, false, false);
-        }
-      });
-      this.$emit('input', node.id);
-      this.$emit('setNode', node)
-      this.selectedLabel = node[this.defaultProps.label];
-    },
-    updateLabel() {
-      this.selectedLabel = this.defaultLabel || '根目录'
-    },
-    handleOutsideClick() {
-      // 点击其他空白区域隐藏树形菜单
-      this.showTree = false;
-    }
-  }
-};
-</script>
-
-<style scoped lang="scss">
-.tree-select {
-  position: relative;
-}
-
-.tree-container {
-  position: absolute;
-  width: 100%;
-  border: 1px solid #e4e7ed;
-  z-index: 999;
-  background: white;
-  top: 34px;
-  max-height: 300px;
-}
-
-.el-icon-arrow-down.is-reverse {
-  transform: rotate(180deg);
-}
-
-::v-deep .el-scrollbar__wrap {
-  max-height: 300px;
-}
-
-</style>

package/src/components/user-drawer.vue

@@ -1,147 +0,0 @@
-<template>
-  <el-drawer
-    size="100%"
-    :visible="visible"
-    :with-header="false"
-    @closed="closed"
-  >
-    <div class="user-drawer">
-      <div class="user-drawer-header f_between">
-        <div class="icon-back" @click="h_back">
-          <i class="el-icon-arrow-left" style="font-weight: 600"></i>
-          <span>返回</span>
-        </div>
-        <el-button type="primary" @click="f_save" :loading="loading"
-          >保存</el-button
-        >
-      </div>
-      <div class="user-drawer-content f_center">
-        <div class="user-auth">
-          <auth-com v-if="drawerInfo.userId" ref="auth-com" :auth-collect="authCollect" :drawerInfo="drawerInfo">
-            <template #face>
-              <slot name="face"> </slot>
-            </template>
-            <template #finger>
-              <slot name="finger"> </slot>
-            </template>
-            <template #idCard>
-              <slot name="idCard"> </slot>
-            </template>
-          </auth-com>
-          <empty-view v-else />
-        </div>
-        <div class="user-info">
-          <user-info ref="user-info" :drawer-info="drawerInfo" />
-        </div>
-      </div>
-    </div>
-  </el-drawer>
-</template>
-
-<script>
-import { apiUserSave } from "@/api";
-
-import UserInfo from "@/components/user-info.vue";
-import AuthCom from "@/components/auth-com.vue";
-import EmptyView from "@/components/empty.vue";
-
-export default {
-  name: "user-drawer",
-  components: {
-    UserInfo,
-    AuthCom,
-    EmptyView,
-  },
-  props: {
-    authCollect: {
-      required: false,
-      type: Array,
-      default: () => ["face", "finger", "idCard"],
-    },
-    drawerInfo: {
-      type: Object,
-    },
-  },
-  data() {
-
-    return {
-      visible: false,
-      loading: false,
-    };
-  },
-  mounted() {
-    this.visible = true;
-  },
-  methods: {
-    closed() {
-      this.$emit("closed");
-    },
-    h_back() {
-      this.visible = false;
-    },
-    async f_save() {
-      try {
-        this.loading = true;
-        const data = this.$refs["user-info"].h_getFormData();
-        await apiUserSave({ ...data, organId: this.drawerInfo.organ.id });
-        this.$emit("refresh");
-        this.visible = false;
-      } finally {
-        this.loading = false;
-      }
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.user-drawer {
-  width: calc(100% - 4px);
-  height: calc(100% - 4px);
-  padding: 0 2px;
-
-  .user-drawer-header {
-    height: 50px;
-    padding: 0 0 0 12px;
-    border-bottom: 1px solid #ecebeb;
-
-    // span {
-    //   cursor: pointer;
-    //   color: #3391ff;
-    // }
-  }
-  .user-drawer-content {
-    width: 100%;
-    height: calc(100% - 50px);
-
-    .user-auth {
-      width: calc(100% - 460px);
-      height: 100%;
-    }
-
-    .user-info {
-      width: 460px;
-      height: 100%;
-      border-left: 1px solid #ecebeb;
-    }
-  }
-}
-
-.icon-back {
-  cursor: pointer;
-  display: flex;
-  color: #5a5a5a;
-  font-weight: 500;
-  font-size: 16px;
-  width: 53px;
-  height: 44px;
-  align-items: center;
-  justify-content: space-between;
-
-  span {
-    color: #5a5a5a;
-    font-weight: 500;
-    font-size: 16px;
-  }
-}
-</style>