|
@@ -0,0 +1,262 @@
|
|
|
+<template>
|
|
|
+ <div class="zy-template">
|
|
|
+ <div class="zy-main-title">权限申请记录</div>
|
|
|
+ <div class="zy-module">
|
|
|
+ <el-form :model="query" label-width="80px">
|
|
|
+ <el-form-item label="关键字" class="zy-search-form-item">
|
|
|
+ <el-input v-model="query.key" size="mini" placeholder="手机号/申请信息" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="审核状态" class="zy-search-form-item">
|
|
|
+ <el-select v-model="query.status" size="mini" clearable placeholder="不选默认全部">
|
|
|
+ <el-option label="拒绝" value="-1" />
|
|
|
+ <el-option label="待审核" value="0" />
|
|
|
+ <el-option label="通过" value="1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-button type="primary" size="mini" @click="submit">查询</el-button>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="zy-module">
|
|
|
+ <el-table :data="page.records" max-height="800" stripe size="small"
|
|
|
+ header-cell-class-name="zy-table-header-cell" cell-class-name='zy-table-cell'>
|
|
|
+ <el-table-column prop="name" label="申请人" width="120" min-width="5%" />
|
|
|
+ <el-table-column prop="phone" label="手机号" width="150" min-width="5%" />
|
|
|
+ <el-table-column label="申请内容" min-width="30%">
|
|
|
+ <template #default="scope">
|
|
|
+ <div style="height: 24px; overflow: hidden;">
|
|
|
+ {{scope.row.remark}}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="createTime" label="申请时间" width="180" min-width="5%" />
|
|
|
+ <el-table-column label="审核状态" width="100" min-width="5%">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag type="success" v-if="scope.row.status==1">通过</el-tag>
|
|
|
+ <el-tag type="warning" v-if="scope.row.status==0">待审核</el-tag>
|
|
|
+ <el-tag type="danger" v-if="scope.row.status==-1">拒绝</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="auditTime" label="审核时间" width="180" min-width="5%" />
|
|
|
+ <el-table-column label="操作" width="150" min-width="10%">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button @click="handleDetail(scope.row)" type="text" size="small">详情</el-button>
|
|
|
+
|
|
|
+ <el-button @click="handlePass(scope.row.id)" type="text" size="small" style="color: #67c23a"
|
|
|
+ v-if="scope.row.status==0">通过</el-button>
|
|
|
+
|
|
|
+ <el-button @click="handleRefuse(scope.row.id)" type="text" size="small" style="color: #f56c6c;"
|
|
|
+ v-if="scope.row.status==0">拒绝</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-pagination class="zy-table-pagination" background layout="prev, pager, next"
|
|
|
+ :current-page="page.current" :total="page.total" :page-size="page.size" @current-change="pagination" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-dialog title="申请信息" v-model="detailDialog" width="500px">
|
|
|
+ <el-descriptions :column="1" border size="small">
|
|
|
+ <el-descriptions-item label="申请人:">{{detailInfo.name}}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="手机号:">{{detailInfo.phone}}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="申请时间:">{{detailInfo.createTime}}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="申请内容:">{{detailInfo.remark}}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="审核时间:" v-if="detailInfo.status!=0">{{detailInfo.auditTime}}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="拒绝原因:" v-if="detailInfo.status==-1">{{detailInfo.refuseReason}}
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <el-dialog title="拒绝申请" v-model="refuseDialog" width="500px">
|
|
|
+ <el-form :model="refuseForm" label-width="100px">
|
|
|
+ <el-form-item label="原因:">
|
|
|
+ <el-input type="textarea" v-model="refuseForm.refuseReason"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="refuseDialog = false">取 消</el-button>
|
|
|
+ <el-button type="danger" @click="refuseSubmit">拒 绝</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <el-dialog title="通过申请" v-model="passDialog" width="500px">
|
|
|
+ <el-form label-width="100px">
|
|
|
+ <el-form-item label="配置组:">
|
|
|
+ <el-tree :data="privList" show-checkbox node-key="id" ref="tree" highlight-current
|
|
|
+ :props="defaultProps" accordion>
|
|
|
+ </el-tree>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="passVisible = false">取 消</el-button>
|
|
|
+ <el-button type="success" @click="passSubmit">通 过</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ query: {
|
|
|
+ key: null,
|
|
|
+ status: null
|
|
|
+ },
|
|
|
+ page: {
|
|
|
+ current: 1,
|
|
|
+ size: 10,
|
|
|
+ },
|
|
|
+ detailDialog: false, //详情弹出框
|
|
|
+ refuseDialog: false, //拒绝申请弹出框
|
|
|
+ passDialog: false, //通过申请弹出框
|
|
|
+ detailInfo: null, //申请详情
|
|
|
+ selPassId: null, //选中的通过表单的ID
|
|
|
+ privList: null, //权限列表
|
|
|
+ defaultProps: {
|
|
|
+ children: 'children',
|
|
|
+ label: 'name'
|
|
|
+ },
|
|
|
+ refuseForm: { //拒绝申请表单
|
|
|
+ refuseReason: ''
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted: function() {
|
|
|
+ this.getListPage(this.page);
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /**
|
|
|
+ * 提交查询条件
|
|
|
+ */
|
|
|
+ submit: function() {
|
|
|
+ const params = {
|
|
|
+ key: this.query.key,
|
|
|
+ status: this.query.status
|
|
|
+ };
|
|
|
+ this.getListPage(params);
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 分页点击事件
|
|
|
+ */
|
|
|
+ pagination: function(current) {
|
|
|
+ const params = {
|
|
|
+ key: this.query.key,
|
|
|
+ status: this.query.status,
|
|
|
+ current: current,
|
|
|
+ size: this.page.size,
|
|
|
+ };
|
|
|
+ this.getListPage(params);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取设备列表
|
|
|
+ */
|
|
|
+ getListPage: function(params) {
|
|
|
+ this.$http.Get(this.$global.privilegeApply.listPage, params).then(res => {
|
|
|
+ console.log(res.data);
|
|
|
+ this.page = res.data;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 申请详情
|
|
|
+ */
|
|
|
+ handleDetail: function(obj) {
|
|
|
+ this.detailDialog = true;
|
|
|
+ this.detailInfo = obj;
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 拒绝申请
|
|
|
+ */
|
|
|
+ handleRefuse: function(id) {
|
|
|
+ this.refuseDialog = true;
|
|
|
+ this.refuseForm.id = id;
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 提交拒绝申请表单
|
|
|
+ */
|
|
|
+ refuseSubmit: function() {
|
|
|
+ const param = {
|
|
|
+ id: this.refuseForm.id,
|
|
|
+ refuseReason: this.refuseForm.refuseReason,
|
|
|
+ status: -1
|
|
|
+ }
|
|
|
+ this.$http.Post(this.$global.privilegeApply.audit, param).then(res => {
|
|
|
+ this.$message.success("提交成功!");
|
|
|
+ this.refresh();
|
|
|
+ this.refuseDialog = false;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 通过申请
|
|
|
+ */
|
|
|
+ handlePass: function(id) {
|
|
|
+ this.passDialog = true;
|
|
|
+ this.selPassId = id;
|
|
|
+ this.getPrivList();
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 提交通过申请表单
|
|
|
+ */
|
|
|
+ passSubmit: function() {
|
|
|
+ const arr = this.$refs.tree.getCheckedKeys(true);
|
|
|
+ if (arr == null || arr.length <= 0) {
|
|
|
+ this.$message.error("至少配置一个组!");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let groups = "";
|
|
|
+ arr.forEach(item => {
|
|
|
+ groups += (item + ",")
|
|
|
+ })
|
|
|
+ groups = groups.substr(0, groups.length - 1)
|
|
|
+ const params = {
|
|
|
+ id: this.selPassId,
|
|
|
+ groups: groups,
|
|
|
+ status: 1
|
|
|
+ }
|
|
|
+ console.log(params);
|
|
|
+ this.$http.Post(this.$global.privilegeApply.audit, params).then(res => {
|
|
|
+ this.$message.success("审核成功!");
|
|
|
+ this.refresh();
|
|
|
+ this.passDialog = false;
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 刷新列表
|
|
|
+ */
|
|
|
+ refresh: function() {
|
|
|
+ const params = {
|
|
|
+ key: this.query.key,
|
|
|
+ status: this.query.status,
|
|
|
+ current: this.page.current,
|
|
|
+ size: this.page.size,
|
|
|
+ }
|
|
|
+ this.getListPage(params);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取权限列表
|
|
|
+ */
|
|
|
+ getPrivList: function() {
|
|
|
+ this.$http.Get(this.$global.privilegeApply.getNoPrivGroups, {}).then(res => {
|
|
|
+ const arr = [];
|
|
|
+ for (let key in res.data) {
|
|
|
+ arr.push({
|
|
|
+ name: key,
|
|
|
+ children: res.data[key]
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.privList = arr;
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+
|
|
|
+</style>
|