yh-pub 1.0.0

package/layout/main/system/roleManage.vue

@@ -0,0 +1,399 @@
+<template>
+  <div class="search">
+    <el-row class="operation">
+      <div style="padding: 5px 15px 5px 2px; font-size: 13px">角色名称</div>
+      <el-input
+        v-model="searchForm.key"
+        @search="getDataList"
+        placeholder="输入关键词搜索"
+        style="width: 300px; margin-left: 12px"
+        clearable
+        enter-button />
+    </el-row>
+    <el-row class="operation">
+      <div style="padding: 5px 15px 5px 2px; font-size: 18px; font-weight: bold">角色管理</div>
+      <el-button
+        @click="addRole"
+        type="primary">
+        <i class="iconfont icon-plus"></i>
+        添加角色
+      </el-button>
+      <el-popconfirm
+        title="确定要删除所选的角色吗？"
+        ok-text="删除"
+        cancel-text="取消"
+        @confirm="delAll"
+        style="margin-left: 12px">
+        <el-button>
+          <i class="iconfont icon-delete"></i>
+          批量删除
+        </el-button>
+      </el-popconfirm>
+      <el-button
+        @click="init"
+        style="margin-left: 12px">
+        <i class="iconfont icon-refresh"></i>
+        查询
+      </el-button>
+    </el-row>
+    <el-table
+      v-loading="loading"
+      row-key="ad_role_id"
+      :data="data"
+      ref="table"
+      highlight-current-row
+      :header-cell-style="{ background: '#f8f8f8', color: '#606266', fontSize: '13px' }"
+      stripe>
+      <el-table-column
+        label="#"
+        width="50">
+        <template #default="scope">{{ scope.$index + 1 }}</template>
+      </el-table-column>
+      <el-table-column
+        label="所属机构"
+        min-width="150"
+        prop="org_name"></el-table-column>
+      <el-table-column
+        label="角色名称"
+        min-width="300"
+        prop="name"></el-table-column>
+      <el-table-column
+        label="角色管理员"
+        min-width="300"
+        prop="is_admin"></el-table-column>
+      <el-table-column
+        label="备注"
+        min-width="200"
+        prop="description"></el-table-column>
+      <el-table-column
+        width="300"
+        label="操作">
+        <template #default="{ row }">
+          <el-button
+            size="small"
+            type="primary"
+            @click="editPerm(row)">
+            菜单权限
+          </el-button>
+          <el-button
+            size="small"
+            type="success"
+            @click="editOrg(row)">
+            角色机构
+          </el-button>
+          <el-button
+            size="small"
+            type="info"
+            @click="edit(row)">
+            编辑
+          </el-button>
+          <el-popconfirm
+            title="你确定要删除吗"
+            ok-text="确定"
+            cancel-text="取消"
+            @confirm="remove(row)">
+            <template #reference>
+              <el-button
+                title="删除"
+                size="small"
+                type="danger">
+                删除
+              </el-button>
+            </template>
+          </el-popconfirm>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      v-model:current-page="pagination.currentPage"
+      v-model:page-size="pagination.pageSize"
+      :page-sizes="[15, 30, 50, 100]"
+      layout="prev, pager, next, sizes, total, jumper"
+      :total="pagination.total"
+      @size-change="getDataList"
+      @current-change="getDataList" />
+    <!-- 编辑 -->
+    <el-dialog
+      :title="modalTitle"
+      v-model="roleModalVisible"
+      :mask-closable="false"
+      @cancel="cancelRole"
+      :width="500">
+      <el-form
+        ref="roleForm"
+        :model="roleForm"
+        :label-width="100"
+        :rules="roleFormValidate">
+        <el-form-item
+          label="组织机构"
+          prop="ad_org_id">
+          <dict
+            dict="ad_org_id"
+            url="/orgController/getGroupOrgs"
+            _select_id="2E72E905E55540FA8D2C297A362A2677"
+            _field_id="FBDE07DC546E453EABBBA45046FF335A"
+            _region_id="0944A00F8A434099BA2D9B6FA46F35F9"
+            v-model="roleForm.ad_org_id"
+            placeholder="请选择或输入搜索"
+            filterable
+            clearable />
+        </el-form-item>
+        <el-form-item
+          label="角色名称"
+          prop="name">
+          <el-input
+            v-model="roleForm.name"
+            placeholder="请输入" />
+        </el-form-item>
+        <el-form-item label="角色管理员">
+          <el-switch
+            v-model="roleForm.isAdmin"
+            true-value="Y"
+            false-value="N"
+            size="large">
+            <span slot="Y">Y</span>
+            <span slot="N">N</span>
+          </el-switch>
+        </el-form-item>
+        <el-form-item
+          label="备注"
+          prop="description">
+          <el-input v-model="roleForm.description" />
+        </el-form-item>
+      </el-form>
+      <div
+        slot="footer"
+        style="padding-left: 150px">
+        <el-button
+          text
+          @click="cancelRole">
+          取消
+        </el-button>
+        <el-button
+          type="primary"
+          :loading="submitLoading"
+          @click="submitRole">
+          提交
+        </el-button>
+      </div>
+    </el-dialog>
+    <!-- 菜单权限 -->
+    <el-drawer
+      :title="modalTitle"
+      v-model="permModalVisible"
+      :mask-closable="false"
+      :width="800"
+      @close="cancelPermEdit">
+      <el-row>
+        <el-col
+          :span="12"
+          style="overflow: auto; height: 100%">
+          <el-tree
+            ref="tree"
+            v-loading="treeLoading"
+            :data="permData"
+            :props="{ label: 'title' }"
+            show-checkbox
+            default-expand-all
+            node-key="adMenuId"
+            @current-change="selectTree"
+            @check-change="checkedMenuTree"></el-tree>
+        </el-col>
+        <el-col :span="12">
+          <div class="ivu-card-head"><p style="margin-bottom: 0px">按钮权限</p></div>
+          <div style="height: 100%; overflow-y: auto; padding: 0 10px">
+            <el-card
+              v-for="(item, key) in curWindowBtnList"
+              :key="key"
+              shadow="never"
+              style="margin-top: 5px">
+              <template #header>
+                {{ item.NAME }}
+                <el-checkbox
+                  style="margin-left: 10px"
+                  :indeterminate="item.indeterminate"
+                  v-model="item.checkAll"
+                  :key="item.ID"
+                  @change="handleCheckAll(item, key)">
+                  全选
+                </el-checkbox>
+              </template>
+              <el-checkbox-group
+                v-model="item.checkChilds"
+                :options="
+                  item.childs.map((item) => {
+                    return { value: item.ID, label: item.NAME };
+                  })
+                "
+                @change="checkAllGroupChange($event, key)">
+                <el-checkbox
+                  v-for="child in item.childs"
+                  :key="child.ID"
+                  :label="child.ID">
+                  {{ child.NAME }}
+                </el-checkbox>
+              </el-checkbox-group>
+            </el-card>
+            <el-empty
+              description="暂无按钮权限数据"
+              v-if="curWindowBtnList.length === 0"></el-empty>
+          </div>
+        </el-col>
+      </el-row>
+      <template #footer>
+        <el-button
+          type="primary"
+          :loading="submitPermLoading"
+          @click="submitPermEdit">
+          提交
+        </el-button>
+        <el-button
+          text
+          @click="cancelPermEdit">
+          取消
+        </el-button>
+      </template>
+    </el-drawer>
+    <!-- 角色机构所属 -->
+    <el-dialog
+      :title="modalTitle"
+      v-model="orgModalVisible"
+      :close-on-click-modal="false"
+      :width="500"
+      class="depModal yh-el-dialog">
+      <el-alert
+        show-icon
+        title="请勾选下方组织机构,选中复选框为角色管理员"></el-alert>
+      <div style="margin-top: 15px">
+        <div style="position: relative">
+          <el-tree
+            ref="depTree"
+            :data="orgData"
+            :props="{ label: 'title' }"
+            show-checkbox
+            default-expand-all
+            node-key="adOrgId"
+            check-on-click-node
+            :selectedKeys.sync="selectedKeys"
+            v-model="deptCheckedKeys"
+            @check-change="checkOrgTree"></el-tree>
+        </div>
+      </div>
+      <template #footer>
+        <el-button
+          type="primary"
+          :loading="submitDepLoading"
+          @click="submitRoleOrg">
+          提交
+        </el-button>
+        <el-button
+          text
+          @click="orgModalVisible = false">
+          取消
+        </el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script src="./roleManage.js"></script>
+<style lang="scss">
+.search {
+  padding: 10px 0;
+  .operation {
+    margin-bottom: 2vh;
+  }
+
+  .select-count {
+    font-weight: 600;
+    color: #40a9ff;
+  }
+
+  .select-clear {
+    margin-left: 10px;
+  }
+
+  .page {
+    margin-top: 2vh;
+  }
+
+  .drop-down {
+    margin-left: 5px;
+  }
+  .el-pagination {
+    padding: 10px 0;
+    justify-content: flex-end;
+  }
+  .el-drawer__body {
+    overflow: hidden;
+    .el-row {
+      height: 100%;
+      overflow: hidden;
+      .el-card__header {
+        padding: 5px 10px;
+      }
+      .el-card__body {
+        padding: 7px 10px;
+      }
+    }
+  }
+}
+
+.tree-list {
+  position: relative;
+  min-height: 80px;
+}
+
+.drawer-footer {
+  z-index: 10;
+  width: 100%;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  border-top: 1px solid #e8e8e8;
+  padding: 10px 16px;
+  text-align: left;
+  background: #fff;
+}
+
+.drawer-footer {
+  z-index: 10;
+  width: 100%;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  border-top: 1px solid #e8e8e8;
+  padding: 10px 16px;
+  text-align: left;
+  background: #fff;
+}
+
+.drawer-content {
+  overflow: auto;
+}
+
+.drawer-header {
+  display: flex;
+  align-items: center;
+  margin-bottom: 16px;
+  font-size: 16px;
+  color: rgba(0, 0, 0, 0.85);
+}
+
+.drawer-title {
+  font-size: 16px;
+  color: rgba(0, 0, 0, 0.85);
+  display: block;
+  margin-bottom: 16px;
+}
+
+.permModal .ivu-modal-body {
+  max-height: 560px;
+  overflow: auto;
+}
+
+.depModal .ivu-modal-body {
+  max-height: 500px;
+  overflow: auto;
+}
+</style>

package/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "yh-pub",
+  "version": "1.0.0",
+  "description": "公共代码",
+  "scripts": {
+    "pub:npm": "npm publish --registry https://registry.npmjs.org/ --no-git-checks"
+  },
+  "peerDependencies": {
+    "vue": "3.2.47"
+  },
+  "author": "Liubin"
+}

package/view/basic/error-logger.vue

@@ -0,0 +1,74 @@
+<template>
+  <div>
+    <a-button
+      @click="exportData"
+      type="primary"
+      style="margin: 0 10px 10px 0">
+      导出日志记录
+    </a-button>
+    <b>注：这里只会显示成功保存到服务端的错误日志，而且页面错误日志不会在浏览器持久化存储，刷新页面即会丢失</b>
+    <a-table
+      ref="table"
+      :columns="columns"
+      :data="errorList"></a-table>
+  </div>
+</template>
+
+<script>
+import { useAppStore } from "@/store/app";
+import dayjs from "dayjs";
+export default {
+  name: "error_logger_page",
+  data() {
+    return {
+      columns: [
+        {
+          type: "index",
+          title: "序号",
+          width: 100,
+        },
+        {
+          key: "type",
+          title: "类型",
+          width: 100,
+        },
+        {
+          key: "code",
+          title: "编码",
+        },
+        {
+          key: "mes",
+          title: "信息",
+        },
+        {
+          key: "url",
+          title: "URL",
+        },
+        {
+          key: "time",
+          title: "时间",
+          sortable: true,
+          sortType: "desc",
+        },
+      ],
+    };
+  },
+  computed: {
+    errorList() {
+      return this.$store.state.app.errorList;
+    },
+  },
+  methods: {
+    exportData() {
+      this.$refs.table.exportCsv({
+        filename: "错误日志.csv",
+      });
+    },
+  },
+  activated() {},
+  mounted() {},
+};
+</script>
+
+<style></style>
+@/store/app

package/view/basic/error-page/401.vue

@@ -0,0 +1,22 @@
+<template>
+  <error-content
+    code="401"
+    desc="Oh~~您没有浏览这个页面的权限~"
+    :src="src" />
+</template>
+
+<script>
+import error401 from "@/assets/images/error-page/error-401.svg";
+import errorContent from "./error-content.vue";
+export default {
+  name: "error_401",
+  components: {
+    errorContent,
+  },
+  data() {
+    return {
+      src: error401,
+    };
+  },
+};
+</script>

package/view/basic/error-page/404.vue

@@ -0,0 +1,22 @@
+<template>
+  <error-content
+    code="404"
+    desc="Oh~~您的页面好像飞走了~"
+    :src="src" />
+</template>
+
+<script>
+import error404 from "@/assets/images/error-page/error-404.svg";
+import errorContent from "./error-content.vue";
+export default {
+  name: "error_404",
+  components: {
+    errorContent,
+  },
+  data() {
+    return {
+      src: error404,
+    };
+  },
+};
+</script>

package/view/basic/error-page/500.vue

@@ -0,0 +1,22 @@
+<template>
+  <error-content
+    code="500"
+    desc="Oh~~鬼知道服务器经历了什么~"
+    :src="src" />
+</template>
+
+<script>
+import error404 from "@/assets/images/error-page/error-500.svg";
+import errorContent from "./error-content.vue";
+export default {
+  name: "error_500",
+  components: {
+    errorContent,
+  },
+  data() {
+    return {
+      src: error404,
+    };
+  },
+};
+</script>

package/view/basic/error-page/back-btn-group.vue

@@ -0,0 +1,48 @@
+<template>
+  <div>
+    <el-button
+      size="large"
+      text
+      @click="backHome">
+      返回首页
+    </el-button>
+    <el-button
+      size="large"
+      text
+      @click="backPrev">
+      返回上一页({{ second }}s)
+    </el-button>
+  </div>
+</template>
+
+<script>
+import "./error.less";
+export default {
+  name: "backBtnGroup",
+  data() {
+    return {
+      second: 5,
+      timer: null,
+    };
+  },
+  methods: {
+    backHome() {
+      this.$router.replace({
+        name: this.$config.homeName,
+      });
+    },
+    backPrev() {
+      this.$router.go(-1);
+    },
+  },
+  mounted() {
+    this.timer = setInterval(() => {
+      if (this.second === 0) this.backPrev();
+      else this.second--;
+    }, 1000);
+  },
+  beforeUnmount() {
+    clearInterval(this.timer);
+  },
+};
+</script>

package/view/basic/error-page/error-content.vue

@@ -0,0 +1,28 @@
+<template>
+  <div class="error-page">
+    <div class="content-con">
+      <img :src="src" :alt="code">
+      <div class="text-con">
+        <h4>{{ code }}</h4>
+        <h5>{{ desc }}</h5>
+      </div>
+      <back-btn-group class="back-btn-group"></back-btn-group>
+    </div>
+  </div>
+</template>
+
+<script>
+import './error.less'
+import backBtnGroup from './back-btn-group.vue'
+export default {
+  name: 'error_content',
+  components: {
+    backBtnGroup
+  },
+  props: {
+    code: String,
+    desc: String,
+    src: String
+  }
+}
+</script>

package/view/basic/error-page/error.less

@@ -0,0 +1,46 @@
+.error-page{
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background: #f8f8f9;
+  .content-con{
+    width: 700px;
+    height: 600px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -60%);
+    img{
+      display: block;
+      width: 100%;
+      height: 100%;
+    }
+    .text-con{
+      position: absolute;
+      left: 0px;
+      top: 0px;
+      h4{
+        position: absolute;
+        left: 0px;
+        top: 0px;
+        font-size: 80px;
+        font-weight: 700;
+        color: #348EED;
+      }
+      h5{
+        position: absolute;
+        width: 700px;
+        left: 0px;
+        top: 100px;
+        font-size: 20px;
+        font-weight: 700;
+        color: #67647D;
+      }
+    }
+    .back-btn-group{
+      position: absolute;
+      right: 0px;
+      bottom: 20px;
+    }
+  }
+}