|
@@ -0,0 +1,303 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <!-- 搜索 -->
|
|
|
+ <el-form :inline="true">
|
|
|
+ <!-- <el-form-item v-if="$permission('/admin/memberType/check')"> -->
|
|
|
+ <!-- <el-form-item>
|
|
|
+ <el-input v-model="queryParams.name" size="small" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item> -->
|
|
|
+ <!-- <el-form-item class="tenant" v-if="userinfo.rList?(userinfo.rList.filter(item=>item.roleId==1))[0]:''"> -->
|
|
|
+ <el-form-item class="tenant" >
|
|
|
+ <el-input
|
|
|
+ placeholder="根据会员类型/名称或创建人查询"
|
|
|
+ v-model="queryParams.likeName"
|
|
|
+ clearable
|
|
|
+ style="width: 280px;">
|
|
|
+ </el-input>
|
|
|
+ <!-- <el-autocomplete
|
|
|
+ class="inline-input"
|
|
|
+ v-model="tenant"
|
|
|
+ :fetch-suggestions="querySearch"
|
|
|
+ placeholder="根据会员类型/名称或创建人查询"
|
|
|
+ :trigger-on-focus="false"
|
|
|
+ @select="handleSelect"
|
|
|
+ style="width: 280px;"
|
|
|
+ ></el-autocomplete> -->
|
|
|
+ <!-- <el-select v-model="queryParams.tenant" @change="getList" clearable placeholder="根据租户/租户类别查询">
|
|
|
+ <el-option
|
|
|
+ v-for="item in tenantList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select> -->
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <!-- <el-button type="" size="small" @click="getList2" v-if="$permission('/admin/memberType/check')">查询</el-button>
|
|
|
+ <el-button type="primary" size="small" @click="handleAdd()" v-if="$permission('/admin/memberType/add')">新增</el-button> -->
|
|
|
+ <el-button type="" size="small" @click="getList" >查询</el-button>
|
|
|
+ <el-button type="primary" size="small" @click="handleAdd()">新增</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <!-- 表格 -->
|
|
|
+ <el-table
|
|
|
+ v-loading="loading"
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ @sort-change="sortMethod"
|
|
|
+ header-row-class-name="custom-table-header"
|
|
|
+ >
|
|
|
+ <el-table-column prop="tenantVipName" label="会员类型/名称" sortable align="center" width="200px">
|
|
|
+
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="功能权限" align="center" show-overflow-tooltip>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-for="item in scope.row.functionIdPathNameDescriptions" :key="item.functionId">{{ item.functionName }} </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="createPersonName" label="创建人" sortable align="center" width="100px"></el-table-column>
|
|
|
+ <el-table-column prop="createTime" label="创建时间" sortable align="center" ></el-table-column>
|
|
|
+ <el-table-column prop="remark" label="备注" align="center" width="200px"></el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" width="150">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-dropdown split-button type="primary" size="small">
|
|
|
+ <p v-if="$permission('/admin/memberType/modify')" @click="handleEdit(scope.row)">编辑</p>
|
|
|
+ <p v-else @click="handleEdit(scope.row)">编辑</p>
|
|
|
+ <el-dropdown-menu slot="dropdown" class="text-align_center">
|
|
|
+ <el-dropdown-item @click.native="handleDelete(scope.row.id)">删除</el-dropdown-item>
|
|
|
+ <!-- <el-dropdown-item @click.native="handleAdd(scope.row.id)">新增</el-dropdown-item> -->
|
|
|
+ <!-- <el-dropdown-item class="color-red" @click.native="handleDelete(scope.row)" divided
|
|
|
+ v-if="$permission('/admin/memberType/delete')">删除
|
|
|
+ </el-dropdown-item> -->
|
|
|
+ <!-- <el-dropdown-item @click.native="distributionPersonnel(scope.row)" divided>分配人员
|
|
|
+ </el-dropdown-item> -->
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </el-dropdown>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!-- 表格分页 -->
|
|
|
+ <div class="pagination">
|
|
|
+ <el-pagination :current-page.sync="queryParams.page" :page-size="queryParams.pageSize" :total="total"
|
|
|
+ @current-change="handleCurrentChange" layout="total, prev, pager, next, jumper"
|
|
|
+ background></el-pagination>
|
|
|
+ </div>
|
|
|
+ <!-- 新增/编辑弹窗 -->
|
|
|
+ <el-dialog :title="title" :visible.sync="visible" width="600px" max-height="800" :before-close="close" append-to-body>
|
|
|
+ <div style="height: 280px">
|
|
|
+ <el-form v-if="visible" :model="ruleForm" :rules="rules" ref="ruleForm" label-width="80px" label-position="left">
|
|
|
+ <el-form-item label="会员类型" prop="tenantVipName">
|
|
|
+ <el-input v-model="ruleForm.tenantVipName" placeholder="请输入会员类型名称"></el-input>
|
|
|
+ <!-- <el-select style="width:100%" v-model="ruleForm.memberType"
|
|
|
+ :disabled="(userinfo.rList?!(userinfo.rList.filter(item=>item.roleId==1))[0]:'')||disabled"
|
|
|
+ placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in tenantList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select> -->
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="创建人" prop="createPersonName">
|
|
|
+ <el-input v-model="ruleForm.createPersonName" placeholder="请输入创建人" disabled></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="功能权限" prop="functions" style="margin-top: 20px;">
|
|
|
+ <el-cascader
|
|
|
+ ref="FunctionCascader"
|
|
|
+ v-model="ruleForm.functions"
|
|
|
+ :options="authority"
|
|
|
+ :props="{multiple:true,value:'id',label:'name' }"
|
|
|
+ collapse-tags
|
|
|
+ placeholder="请选择功能权限"
|
|
|
+ clearable
|
|
|
+ @change="downloadChange"
|
|
|
+ style="width:100%"></el-cascader>
|
|
|
+ <el-button @click="btnCody">复制</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item label="创建时间" prop="createTime">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="ruleForm.createTime"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择日期"
|
|
|
+ format="yyyy-MM-dd"
|
|
|
+ disabled
|
|
|
+ style="width: 100%;">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item> -->
|
|
|
+ <el-form-item label="备注" prop="remark">
|
|
|
+ <el-input v-model="ruleForm.remark" placeholder="请输入备注" type="textarea" maxlength="100"
|
|
|
+ show-word-limit></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="close">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="submit" :loading="btnLoading">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ total:0,
|
|
|
+ tenantList: [],
|
|
|
+ tableData: [],
|
|
|
+ authority: [],//权限功能面板数据
|
|
|
+ ruleForm: {},//新增、编辑数据
|
|
|
+ queryParams: {
|
|
|
+ pageSize: 10,
|
|
|
+ page: 1,
|
|
|
+ likeName:'',
|
|
|
+ },
|
|
|
+ visible: false,
|
|
|
+ title:'',
|
|
|
+ loading:false,
|
|
|
+ btnLoading: false,
|
|
|
+ rules: {
|
|
|
+ tenantVipName: [{ required: true, message: '请输入会员类型/名称', trigger: 'blur' },],
|
|
|
+ functions: [{ required: true, message: '请选择功能权限', trigger: 'change' },],
|
|
|
+ },
|
|
|
+ tenant: '',
|
|
|
+ isMemberType: false,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ userinfo() {
|
|
|
+ return this.$store.state.admin.userinfo
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getFunction()
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 表格数据
|
|
|
+ getList() {
|
|
|
+ this.loading = true
|
|
|
+ this.$api.queryTenantVipType(this.queryParams).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.tableData = res.data.list
|
|
|
+ this.total = res.data.totalCount
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 复制
|
|
|
+ btnCody(){},
|
|
|
+ //排序
|
|
|
+ sortMethod({ column, prop, order }) {
|
|
|
+ console.log(column, prop, order);
|
|
|
+ },
|
|
|
+ // 新增类别
|
|
|
+ handleAdd() {
|
|
|
+ this.title = '新增会员类型功能权限'
|
|
|
+ this.ruleForm.createPersonName = this.userinfo.name
|
|
|
+ this.visible = true
|
|
|
+
|
|
|
+ },
|
|
|
+ // 表格编辑
|
|
|
+ handleEdit(row) {
|
|
|
+ this.title='编辑会员类型功能权限'
|
|
|
+ this.visible = true
|
|
|
+ this.isMemberType = true
|
|
|
+ let rows=JSON.parse(JSON.stringify(row))
|
|
|
+ this.ruleForm=rows
|
|
|
+
|
|
|
+ },
|
|
|
+ handleDelete(id) {
|
|
|
+ this.$api.deleteTenantVipType({id:id}).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$confirm('此操作将删除该会员类型,不可恢复, 是否继续?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.$message.success('删除成功!');
|
|
|
+ this.getList()
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message.info('已取消删除');
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 表格分页
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.queryParams.page = val;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ // 新增、编辑弹窗功能权限选择
|
|
|
+ downloadChange() { },
|
|
|
+ //权限功能
|
|
|
+ getFunction(val) {
|
|
|
+ this.$api.getAllFunctionList({type:val}).then(response => {
|
|
|
+ this.authority = []
|
|
|
+ this.authority = response.data
|
|
|
+ }).catch(error => {
|
|
|
+ this.loading = true
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 新增、编辑弹窗关闭
|
|
|
+ close() {
|
|
|
+ this.visible = false
|
|
|
+ this.ruleForm={}
|
|
|
+ },
|
|
|
+ // 新增、编辑弹窗确定
|
|
|
+ submit() {
|
|
|
+ console.log(this.ruleForm,this.userinfo);
|
|
|
+ this.$refs.ruleForm.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.btnLoading=true
|
|
|
+ if (this.ruleForm.hasOwnProperty('functions')) {
|
|
|
+ var functionModifyPaths=[]
|
|
|
+ this.ruleForm.functions.forEach(item => {
|
|
|
+ let a=item.join(',')
|
|
|
+ functionModifyPaths.push(a)
|
|
|
+ })
|
|
|
+ this.ruleForm.functionModifyPaths=functionModifyPaths
|
|
|
+ }
|
|
|
+ this.ruleForm.createPersonId = this.userinfo.id
|
|
|
+ console.log(this.ruleForm);
|
|
|
+ if (this.ruleForm.id) {
|
|
|
+ this.$api.updateNewTenantVipType(this.ruleForm).then(res => {
|
|
|
+ // console.log(11);
|
|
|
+ if (res.code==200) {
|
|
|
+ this.$message.success("更新会员功能权限成功")
|
|
|
+ this.btnLoading=false
|
|
|
+ this.getList()
|
|
|
+ this.close()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$api.addNewTenantVipType(this.ruleForm).then(res => {
|
|
|
+ // console.log(11);
|
|
|
+ if (res.code==200) {
|
|
|
+ this.$message.success("新增会员功能权限成功")
|
|
|
+ this.btnLoading=false
|
|
|
+ this.getList()
|
|
|
+ this.close()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 租户/租户类别查询
|
|
|
+ handleSelect(item) {
|
|
|
+ this.tenant=item
|
|
|
+ },
|
|
|
+ querySearch(queryString, cb){},
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+
|
|
|
+</style>
|