Merge branch 'lijinlong' of http://39.101.188.84:8000/suzhou-jichuang-lanhai/volunteer-pc into dev
commit
8d3fe49568
@ -1,13 +1,13 @@
|
|||||||
# 页面标题
|
# 页面标题
|
||||||
VUE_APP_TITLE = 若依管理系统
|
VUE_APP_TITLE = 苏州园区志愿服务活动区块链平台
|
||||||
|
|
||||||
# 开发环境配置
|
# 开发环境配置
|
||||||
ENV = 'development'
|
ENV = 'development'
|
||||||
|
|
||||||
# 若依管理系统/开发环境
|
# 苏州园区志愿服务活动区块链平台/开发环境
|
||||||
# VUE_APP_BASE_API = 'https://vue.ruoyi.vip/prod-api'
|
# VUE_APP_BASE_API = 'https://vue.ruoyi.vip/prod-api'
|
||||||
# VUE_APP_BASE_API = 'http://192.168.0.108:9034'
|
|
||||||
VUE_APP_BASE_API = 'http://39.101.188.84:9034'
|
VUE_APP_BASE_API = 'http://39.101.188.84:9034'
|
||||||
|
# VUE_APP_BASE_API = 'http://192.168.0.117:9034'
|
||||||
|
|
||||||
# 路由懒加载
|
# 路由懒加载
|
||||||
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
# 页面标题
|
# 页面标题
|
||||||
VUE_APP_TITLE = 若依管理系统
|
VUE_APP_TITLE = 苏州园区志愿服务活动区块链平台
|
||||||
|
|
||||||
# 生产环境配置
|
# 生产环境配置
|
||||||
ENV = 'production'
|
ENV = 'production'
|
||||||
|
|
||||||
# 若依管理系统/生产环境
|
# 苏州园区志愿服务活动区块链平台/生产环境
|
||||||
VUE_APP_BASE_API = 'http://39.101.188.84:9034'
|
VUE_APP_BASE_API = 'http://39.101.188.84:9034'
|
||||||
|
|||||||
@ -1,10 +1,10 @@
|
|||||||
# 页面标题
|
# 页面标题
|
||||||
VUE_APP_TITLE = 若依管理系统
|
VUE_APP_TITLE = 苏州园区志愿服务活动区块链平台
|
||||||
|
|
||||||
NODE_ENV = production
|
NODE_ENV = production
|
||||||
|
|
||||||
# 测试环境配置
|
# 测试环境配置
|
||||||
ENV = 'staging'
|
ENV = 'staging'
|
||||||
|
|
||||||
# 若依管理系统/测试环境
|
# 苏州园区志愿服务活动区块链平台/测试环境
|
||||||
VUE_APP_BASE_API = '/stage-api'
|
VUE_APP_BASE_API = '/stage-api'
|
||||||
|
|||||||
|
After Width: | Height: | Size: 861 B |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 509 KiB After Width: | Height: | Size: 667 KiB |
|
Before Width: | Height: | Size: 71 KiB After Width: | Height: | Size: 72 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 524 KiB |
@ -1,19 +1,21 @@
|
|||||||
const getters = {
|
const getters = {
|
||||||
sidebar: state => state.app.sidebar,
|
sidebar: (state) => state.app.sidebar,
|
||||||
size: state => state.app.size,
|
size: (state) => state.app.size,
|
||||||
device: state => state.app.device,
|
device: (state) => state.app.device,
|
||||||
dict: state => state.dict.dict,
|
dict: (state) => state.dict.dict,
|
||||||
visitedViews: state => state.tagsView.visitedViews,
|
visitedViews: (state) => state.tagsView.visitedViews,
|
||||||
cachedViews: state => state.tagsView.cachedViews,
|
cachedViews: (state) => state.tagsView.cachedViews,
|
||||||
token: state => state.user.token,
|
token: (state) => state.user.token,
|
||||||
avatar: state => state.user.avatar,
|
avatar: (state) => state.user.avatar,
|
||||||
name: state => state.user.name,
|
name: (state) => state.user.name,
|
||||||
introduction: state => state.user.introduction,
|
userId: (state) => state.user.userId,
|
||||||
roles: state => state.user.roles,
|
introduction: (state) => state.user.introduction,
|
||||||
permissions: state => state.user.permissions,
|
roles: (state) => state.user.roles,
|
||||||
permission_routes: state => state.permission.routes,
|
permissions: (state) => state.user.permissions,
|
||||||
topbarRouters:state => state.permission.topbarRouters,
|
permission_routes: (state) => state.permission.routes,
|
||||||
defaultRoutes:state => state.permission.defaultRoutes,
|
topbarRouters: (state) => state.permission.topbarRouters,
|
||||||
sidebarRouters:state => state.permission.sidebarRouters,
|
defaultRoutes: (state) => state.permission.defaultRoutes,
|
||||||
}
|
sidebarRouters: (state) => state.permission.sidebarRouters,
|
||||||
export default getters
|
integral: (state) => state.permission.integral,
|
||||||
|
};
|
||||||
|
export default getters;
|
||||||
|
|||||||
@ -1,96 +1,111 @@
|
|||||||
import { login, logout, getInfo } from '@/api/login'
|
import { login, logout, getInfo } from "@/api/login";
|
||||||
import { getToken, setToken, removeToken } from '@/utils/auth'
|
import { getToken, setToken, removeToken } from "@/utils/auth";
|
||||||
|
|
||||||
const user = {
|
const user = {
|
||||||
state: {
|
state: {
|
||||||
token: getToken(),
|
token: getToken(),
|
||||||
name: '',
|
name: "",
|
||||||
avatar: '',
|
userId: "",
|
||||||
|
avatar: "",
|
||||||
roles: [],
|
roles: [],
|
||||||
permissions: []
|
permissions: [],
|
||||||
},
|
},
|
||||||
|
|
||||||
mutations: {
|
mutations: {
|
||||||
SET_TOKEN: (state, token) => {
|
SET_TOKEN: (state, token) => {
|
||||||
state.token = token
|
state.token = token;
|
||||||
},
|
},
|
||||||
SET_NAME: (state, name) => {
|
SET_NAME: (state, name) => {
|
||||||
state.name = name
|
state.name = name;
|
||||||
|
},
|
||||||
|
SET_USER_ID: (state, userId) => {
|
||||||
|
state.userId = userId;
|
||||||
},
|
},
|
||||||
SET_AVATAR: (state, avatar) => {
|
SET_AVATAR: (state, avatar) => {
|
||||||
state.avatar = avatar
|
state.avatar = avatar;
|
||||||
},
|
},
|
||||||
SET_ROLES: (state, roles) => {
|
SET_ROLES: (state, roles) => {
|
||||||
state.roles = roles
|
state.roles = roles;
|
||||||
},
|
},
|
||||||
SET_PERMISSIONS: (state, permissions) => {
|
SET_PERMISSIONS: (state, permissions) => {
|
||||||
state.permissions = permissions
|
state.permissions = permissions;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
actions: {
|
actions: {
|
||||||
// 登录
|
// 登录
|
||||||
Login({ commit }, userInfo) {
|
Login({ commit }, userInfo) {
|
||||||
const username = userInfo.username.trim()
|
const username = userInfo.username.trim();
|
||||||
const password = userInfo.password
|
const password = userInfo.password;
|
||||||
const code = userInfo.code
|
const code = userInfo.code;
|
||||||
const uuid = userInfo.uuid
|
const uuid = userInfo.uuid;
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
login(username, password, code, uuid).then(res => {
|
login(username, password, code, uuid)
|
||||||
setToken(res.token)
|
.then((res) => {
|
||||||
commit('SET_TOKEN', res.token)
|
setToken(res.token);
|
||||||
resolve()
|
commit("SET_TOKEN", res.token);
|
||||||
}).catch(error => {
|
resolve();
|
||||||
reject(error)
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
reject(error);
|
||||||
|
});
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
// 获取用户信息
|
// 获取用户信息
|
||||||
GetInfo({ commit, state }) {
|
GetInfo({ commit, state }) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
getInfo().then(res => {
|
getInfo()
|
||||||
const user = res.user
|
.then((res) => {
|
||||||
const avatar = (user.avatar == "" || user.avatar == null) ? require("@/assets/images/profile.jpg") : process.env.VUE_APP_BASE_API + user.avatar;
|
const user = res.user;
|
||||||
if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
|
const avatar =
|
||||||
commit('SET_ROLES', res.roles)
|
user.avatar == "" || user.avatar == null
|
||||||
commit('SET_PERMISSIONS', res.permissions)
|
? require("@/assets/images/profile.jpg")
|
||||||
|
: process.env.VUE_APP_BASE_API + user.avatar;
|
||||||
|
if (res.roles && res.roles.length > 0) {
|
||||||
|
// 验证返回的roles是否是一个非空数组
|
||||||
|
commit("SET_ROLES", res.roles);
|
||||||
|
commit("SET_PERMISSIONS", res.permissions);
|
||||||
} else {
|
} else {
|
||||||
commit('SET_ROLES', ['ROLE_DEFAULT'])
|
commit("SET_ROLES", ["ROLE_DEFAULT"]);
|
||||||
}
|
}
|
||||||
commit('SET_NAME', user.userName)
|
commit("SET_NAME", user.nickName);
|
||||||
commit('SET_AVATAR', avatar)
|
commit("SET_USER_ID", user.userId);
|
||||||
resolve(res)
|
commit("SET_AVATAR", avatar);
|
||||||
}).catch(error => {
|
resolve(res);
|
||||||
reject(error)
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
reject(error);
|
||||||
|
});
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
// 退出系统
|
// 退出系统
|
||||||
LogOut({ commit, state }) {
|
LogOut({ commit, state }) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
logout(state.token).then(() => {
|
logout(state.token)
|
||||||
commit('SET_TOKEN', '')
|
.then(() => {
|
||||||
commit('SET_ROLES', [])
|
commit("SET_TOKEN", "");
|
||||||
commit('SET_PERMISSIONS', [])
|
commit("SET_ROLES", []);
|
||||||
removeToken()
|
commit("SET_PERMISSIONS", []);
|
||||||
resolve()
|
removeToken();
|
||||||
}).catch(error => {
|
resolve();
|
||||||
reject(error)
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
reject(error);
|
||||||
|
});
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
// 前端 登出
|
// 前端 登出
|
||||||
FedLogOut({ commit }) {
|
FedLogOut({ commit }) {
|
||||||
return new Promise(resolve => {
|
return new Promise((resolve) => {
|
||||||
commit('SET_TOKEN', '')
|
commit("SET_TOKEN", "");
|
||||||
removeToken()
|
removeToken();
|
||||||
resolve()
|
resolve();
|
||||||
})
|
});
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
|
|
||||||
export default user
|
export default user;
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,76 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form
|
||||||
|
ref="form"
|
||||||
|
:model="form"
|
||||||
|
:rules="rules"
|
||||||
|
label-width="80px"
|
||||||
|
class="user-address"
|
||||||
|
>
|
||||||
|
<el-form-item label="姓名" prop="nickName">
|
||||||
|
<el-input v-model="form.nickName" readonly></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="手机号" prop="phonenumber">
|
||||||
|
<el-input v-model="form.phonenumber" readonly></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="详细地址" prop="address">
|
||||||
|
<el-input v-model="form.address" type="textarea" :rows="3"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="handleSubmit()">提 交</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getUserProfile, updateUserProfile } from "@/api/system/user.js";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
form: {},
|
||||||
|
rules: {
|
||||||
|
address: [
|
||||||
|
{ required: true, message: "请输入详细地址", trigger: "blur" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getUserInfo();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getUserInfo() {
|
||||||
|
getUserProfile().then((res) => {
|
||||||
|
this.form = res.data;
|
||||||
|
console.log(this.form, res);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleSubmit() {
|
||||||
|
this.$refs["form"].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
updateUserProfile(this.form).then(() => {
|
||||||
|
this.$modal.msgSuccess("提交成功");
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.app-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-address {
|
||||||
|
padding: 30px 15px 0 15px;
|
||||||
|
width: 500px;
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,660 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-dialog
|
||||||
|
:visible.sync="dialogVisible"
|
||||||
|
width="50%"
|
||||||
|
@close="closeDetail"
|
||||||
|
:destroy-on-close="true"
|
||||||
|
>
|
||||||
|
<div slot="title">
|
||||||
|
<div class="titleText">查看详情</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-content">
|
||||||
|
<header>
|
||||||
|
<div class="icons"></div>
|
||||||
|
<span>活动信息</span>
|
||||||
|
</header>
|
||||||
|
<div class="mainsEvents">
|
||||||
|
<div class="itemE">
|
||||||
|
<div>活动名称:</div>
|
||||||
|
<div>{{ detailData.name }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="itemE">
|
||||||
|
<div>活动地址:</div>
|
||||||
|
<div>{{ detailData.address }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mainsEvents">
|
||||||
|
<div class="itemE">
|
||||||
|
<div>活动举办方:</div>
|
||||||
|
<div>{{ detailData.publisher }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="itemE">
|
||||||
|
<div>活动标签:</div>
|
||||||
|
<div class="mainTag mainTag-label">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in detailDatalist"
|
||||||
|
:key="index"
|
||||||
|
v-show="item != ''"
|
||||||
|
>
|
||||||
|
{{ item }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mainsTitle">
|
||||||
|
<div>活动内容:</div>
|
||||||
|
<div>{{ detailData.content }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="mainsTitle">
|
||||||
|
<div>活动时间:</div>
|
||||||
|
<div>{{ detailData.activityTime }}至{{ detailData.endTime }}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 人员匹配度 -->
|
||||||
|
<header>
|
||||||
|
<div class="icons icons1"></div>
|
||||||
|
<span>人员匹配度</span>
|
||||||
|
</header>
|
||||||
|
<div v-loading="load1">
|
||||||
|
<div class="mainPeople" v-if="personList.length > 0">
|
||||||
|
<div
|
||||||
|
class="subMan"
|
||||||
|
v-for="(item, index) in personList"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<div class="leftSub">
|
||||||
|
<div
|
||||||
|
class="leftAvatar"
|
||||||
|
:style="`background-image:url('${require('../../../../assets/images/profile.jpg')}')`"
|
||||||
|
></div>
|
||||||
|
<div class="leftName">
|
||||||
|
<div>{{ item.id }}</div>
|
||||||
|
<div class="mainTag">
|
||||||
|
<div
|
||||||
|
v-show="item != ''"
|
||||||
|
v-for="(item, index) in item.arrlist"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
{{ item }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="rightSub">
|
||||||
|
<div class="numPercen">
|
||||||
|
<span>匹配度:</span>
|
||||||
|
<span>1%</span>
|
||||||
|
</div>
|
||||||
|
<div class="itemBtn">
|
||||||
|
<div class="look" @click="looks1(item.id)">查看</div>
|
||||||
|
<div class="looks" @click="invite(item)">邀请</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-else class="noneStyle">暂无数据</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="titlePagin">
|
||||||
|
<el-pagination
|
||||||
|
small
|
||||||
|
layout="prev, pager, next"
|
||||||
|
:total="personTotal"
|
||||||
|
:current-page.sync="personParams.pageNum"
|
||||||
|
@current-change="changePersonSize"
|
||||||
|
>
|
||||||
|
</el-pagination>
|
||||||
|
</div>
|
||||||
|
<!-- 参与报名 -->
|
||||||
|
<header>
|
||||||
|
<div class="icons icons2"></div>
|
||||||
|
<span>参与报名</span>
|
||||||
|
</header>
|
||||||
|
<div v-loading="load2">
|
||||||
|
<div class="mainPeople" v-if="participationList.length > 0">
|
||||||
|
<div
|
||||||
|
class="subMan"
|
||||||
|
v-for="(item, index) in participationList"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<div class="leftSub">
|
||||||
|
<div
|
||||||
|
class="leftAvatar"
|
||||||
|
:style="`background-image:url('${require('../../../../assets/images/profile.jpg')}')`"
|
||||||
|
></div>
|
||||||
|
<div class="leftName">
|
||||||
|
<div>周爱</div>
|
||||||
|
<div class="mainTag">
|
||||||
|
<div
|
||||||
|
v-show="item != ''"
|
||||||
|
v-for="(item, index) in item.arrlist"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
{{ item }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="rightSub">
|
||||||
|
<div class="numPercen">
|
||||||
|
<span>匹配度:</span>
|
||||||
|
<span>99%</span>
|
||||||
|
</div>
|
||||||
|
<div class="itemBtn" style="justify-content: center">
|
||||||
|
<div class="look" @click="looks2(item)">查看</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-else class="noneStyle">暂无数据</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="titlePagin">
|
||||||
|
<el-pagination
|
||||||
|
small
|
||||||
|
layout="prev, pager, next"
|
||||||
|
:total="participationTotal"
|
||||||
|
:current-page.sync="participationParams.pageNum"
|
||||||
|
>
|
||||||
|
</el-pagination>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
<!-- 查看该人员的详情 -->
|
||||||
|
<el-dialog
|
||||||
|
:visible.sync="peopelDetail"
|
||||||
|
width="40%"
|
||||||
|
@close="cancel"
|
||||||
|
:destroy-on-close="true"
|
||||||
|
>
|
||||||
|
<div slot="title">
|
||||||
|
<div class="titleText">查看人员详情</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-content">
|
||||||
|
<el-descriptions class="margin-top" :column="2" border>
|
||||||
|
<el-descriptions-item
|
||||||
|
v-for="(item, index) in beforeData"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<template slot="label"> {{ item.name }} </template>
|
||||||
|
{{ item.value }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
activityGet,
|
||||||
|
peopleList,
|
||||||
|
canyuList,
|
||||||
|
peopleGet,
|
||||||
|
yaoqingAdd,
|
||||||
|
} from "@/api/volunteer/hdgl";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
beforeData: [
|
||||||
|
{
|
||||||
|
name: "年龄",
|
||||||
|
label: "ageRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "文化程度",
|
||||||
|
label: "educationRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "小区",
|
||||||
|
label: "housingRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "行业类型",
|
||||||
|
label: "industryRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "兴趣爱好",
|
||||||
|
label: "interestRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "国籍",
|
||||||
|
label: "nationalityRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
name: "政治面貌",
|
||||||
|
label: "politicalRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "专业类型",
|
||||||
|
label: "professionalRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "院校",
|
||||||
|
label: "schoolRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "性别",
|
||||||
|
label: "sexRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
dialogVisible: false,
|
||||||
|
detailData: {},
|
||||||
|
detailDatalist: [],
|
||||||
|
load1: true,
|
||||||
|
personList: [],
|
||||||
|
personTotal: 0,
|
||||||
|
personParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
ageRange: "",
|
||||||
|
educationRange: "",
|
||||||
|
housingRange: "",
|
||||||
|
industryRange: "",
|
||||||
|
interestRange: "",
|
||||||
|
nationalityRange: "",
|
||||||
|
politicalRange: "",
|
||||||
|
professionalRange: "",
|
||||||
|
schoolRange: "",
|
||||||
|
sexRange: "",
|
||||||
|
},
|
||||||
|
load2: true,
|
||||||
|
participationList: [],
|
||||||
|
participationTotal: 0,
|
||||||
|
participationParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
activityId: "",
|
||||||
|
},
|
||||||
|
peopelDetail: false,
|
||||||
|
arr: [
|
||||||
|
"ageRange",
|
||||||
|
"sexRange",
|
||||||
|
"politicalRange",
|
||||||
|
"educationRange",
|
||||||
|
"housingRange",
|
||||||
|
"industryRange",
|
||||||
|
"interestRange",
|
||||||
|
"professionalRange",
|
||||||
|
"schoolRange",
|
||||||
|
"nationalityRange",
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
props: {},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
open(e) {
|
||||||
|
activityGet(e).then((res) => {
|
||||||
|
this.detailData = res.data;
|
||||||
|
for (let key1 in this.personParams) {
|
||||||
|
for (let key2 in this.detailData) {
|
||||||
|
if (key1 == key2) {
|
||||||
|
this.personParams[key1] = this.detailData[key2];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.detailDatalist = this.labelgenerate(this.detailData);
|
||||||
|
if (this.personParams.sexRange == "") {
|
||||||
|
this.personParams.sexRange = "男,女";
|
||||||
|
}
|
||||||
|
this.participationParams.activityId = this.detailData.id;
|
||||||
|
this.getPersonData();
|
||||||
|
this.getParticipationData();
|
||||||
|
this.dialogVisible = true;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
//标签生成
|
||||||
|
labelgenerate(data = {}) {
|
||||||
|
let arrlist = [];
|
||||||
|
for (let key3 of this.arr) {
|
||||||
|
for (let key4 in data) {
|
||||||
|
if (key3 == key4) {
|
||||||
|
let a = data[key3];
|
||||||
|
arrlist.push(a);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return arrlist;
|
||||||
|
},
|
||||||
|
//关闭详情
|
||||||
|
closeDetail() {
|
||||||
|
this.detailData = {};
|
||||||
|
this.detailDatalist = [];
|
||||||
|
this.dialogVisible = false;
|
||||||
|
},
|
||||||
|
getPersonData() {
|
||||||
|
//查看人员匹配度列表
|
||||||
|
this.load1 = true;
|
||||||
|
peopleList(this.personParams).then((res) => {
|
||||||
|
this.personList = res.rows;
|
||||||
|
if (this.personList.length > 0) {
|
||||||
|
this.personList.forEach((item) => {
|
||||||
|
item.arrlist = this.labelgenerate(item);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
this.personTotal = res.total;
|
||||||
|
this.load1 = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getParticipationData() {
|
||||||
|
this.load2 = true;
|
||||||
|
//查看参与报名列表
|
||||||
|
canyuList(this.participationParams).then((res) => {
|
||||||
|
this.participationList = res.rows;
|
||||||
|
if (this.participationList.length > 0) {
|
||||||
|
this.participationList.forEach((item) => {
|
||||||
|
item.arrlist = this.labelgenerate(item);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.participationTotal = res.total;
|
||||||
|
this.load2 = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
//更改人员匹配度页码
|
||||||
|
changePersonSize(e) {
|
||||||
|
this.personParams.pageNum = e;
|
||||||
|
this.getPersonData();
|
||||||
|
},
|
||||||
|
//更改参与报名匹配度页码
|
||||||
|
changeParticipationSize(e) {
|
||||||
|
this.participationParams.pageNum = e;
|
||||||
|
this.getParticipationData();
|
||||||
|
},
|
||||||
|
looks1(e) {
|
||||||
|
peopleGet(e).then((res) => {
|
||||||
|
this.beforeData.forEach((value, index) => {
|
||||||
|
for (let key in res.data) {
|
||||||
|
if (value.label == key) {
|
||||||
|
this.beforeData[index].value = res.data[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.peopelDetail = true;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
looks2(item) {
|
||||||
|
this.beforeData.forEach((value, index) => {
|
||||||
|
for (let key in item) {
|
||||||
|
if (value.label == key) {
|
||||||
|
this.beforeData[index].value = item[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.peopelDetail = true;
|
||||||
|
},
|
||||||
|
invite(e) {
|
||||||
|
console.log(e);
|
||||||
|
this.$modal
|
||||||
|
.confirm("是否确认邀请该人参加活动?")
|
||||||
|
.then(() => {
|
||||||
|
yaoqingAdd({ activityId: this.detailData.id, uid: e.uid }).then(
|
||||||
|
() => {
|
||||||
|
this.$modal.msgSuccess("邀请成功");
|
||||||
|
}
|
||||||
|
);
|
||||||
|
})
|
||||||
|
.catch(() => {});
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.peopelDetail = false;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
::v-deep .margin-top td {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
}
|
||||||
|
::v-deep .margin-top th {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
.titlePagin {
|
||||||
|
margin: 12px 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row-reverse;
|
||||||
|
}
|
||||||
|
::v-deep .titlePagin .el-pagination {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.mainTag-label {
|
||||||
|
position: absolute;
|
||||||
|
width: 300px;
|
||||||
|
left: 80px;
|
||||||
|
}
|
||||||
|
.mainTag {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
flex-direction: row; /* 从左往右排列 */
|
||||||
|
& > div {
|
||||||
|
margin-bottom: 5px;
|
||||||
|
margin-right: 5px;
|
||||||
|
background-color: rgba(248, 65, 77, 0.06);
|
||||||
|
padding: 3px 5px;
|
||||||
|
color: #e16a70;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog {
|
||||||
|
border-radius: 10px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__header {
|
||||||
|
padding: 10px;
|
||||||
|
padding-left: 15px;
|
||||||
|
background: #f7f5f5;
|
||||||
|
border-top-left-radius: 10px;
|
||||||
|
border-top-right-radius: 10px;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__body {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__footer {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__headerbtn {
|
||||||
|
top: 12px;
|
||||||
|
}
|
||||||
|
.titleText {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
font-weight: bold;
|
||||||
|
color: #4c4949;
|
||||||
|
padding-left: 15px;
|
||||||
|
font-size: 16px;
|
||||||
|
position: relative;
|
||||||
|
&::before {
|
||||||
|
position: absolute;
|
||||||
|
top: 3.8px;
|
||||||
|
left: 0;
|
||||||
|
content: "";
|
||||||
|
width: 5px;
|
||||||
|
height: 15px;
|
||||||
|
background: #f8414d;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.center-content {
|
||||||
|
padding: 20px 30px;
|
||||||
|
header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 14px;
|
||||||
|
.icons {
|
||||||
|
height: 14px;
|
||||||
|
width: 14px;
|
||||||
|
background-image: url("../../../../assets/images/hdxx.png");
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.icons1 {
|
||||||
|
background-image: url("../../../../assets/images/rypp.png");
|
||||||
|
}
|
||||||
|
.icons2 {
|
||||||
|
background-image: url("../../../../assets/images/baoming1.png");
|
||||||
|
}
|
||||||
|
span {
|
||||||
|
margin-left: 10px;
|
||||||
|
color: #4c4949;
|
||||||
|
font-weight: bold;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mainsEvents {
|
||||||
|
// height: 35px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
margin-bottom: 12px;
|
||||||
|
|
||||||
|
.itemE {
|
||||||
|
position: relative;
|
||||||
|
width: 50%;
|
||||||
|
display: flex;
|
||||||
|
& > div:nth-of-type(1) {
|
||||||
|
display: flex;
|
||||||
|
// align-items: center;
|
||||||
|
color: #4c4949;
|
||||||
|
width: 24%;
|
||||||
|
}
|
||||||
|
& > div:nth-last-of-type(2) {
|
||||||
|
color: #807a7a;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mainsTitle {
|
||||||
|
margin-bottom: 12px;
|
||||||
|
display: flex;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
& > div:nth-of-type(1) {
|
||||||
|
color: #807a7a;
|
||||||
|
width: 12%;
|
||||||
|
}
|
||||||
|
& > div:nth-of-type(2) {
|
||||||
|
width: 50%;
|
||||||
|
color: #606266;
|
||||||
|
white-space: nowrap; /* 不换行 */
|
||||||
|
overflow: hidden; /* 超出部分隐藏 */
|
||||||
|
text-overflow: ellipsis; /* 溢出显示省略号 */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.noneStyle {
|
||||||
|
height: 200px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Medium.otf";
|
||||||
|
color: #606266;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.mainPeople {
|
||||||
|
overflow: auto;
|
||||||
|
// height: 200px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
.subMan {
|
||||||
|
width: 100%;
|
||||||
|
min-height: 95px;
|
||||||
|
background: #fafafa;
|
||||||
|
border: 1px solid #f5edeb;
|
||||||
|
border-radius: 10px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 15px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
.leftSub {
|
||||||
|
width: 84%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.leftAvatar {
|
||||||
|
width: 20%;
|
||||||
|
min-height: 95px;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
.leftName {
|
||||||
|
width: 80%;
|
||||||
|
|
||||||
|
margin-left: 15px;
|
||||||
|
& > div:nth-of-type(1) {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Medium.otf";
|
||||||
|
color: #4c4949;
|
||||||
|
font-size: 18px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
& > div:nth-of-type(2) {
|
||||||
|
margin-bottom: -15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.rightSub {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
.numPercen {
|
||||||
|
display: flex;
|
||||||
|
// align-items: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
& > span:nth-of-type(1) {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
font-weight: 400;
|
||||||
|
color: #8a8585;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
& > span:nth-of-type(2) {
|
||||||
|
font-family: "youshebiaotihei";
|
||||||
|
color: #49b28f;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.itemBtn {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.look {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 4px;
|
||||||
|
color: #188ffe;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
padding: 5px 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
.looks {
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 4px;
|
||||||
|
color: #49b28f;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
padding: 5px 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 5px;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background: #e5d3d4;
|
||||||
|
}
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background: #f4f1f1;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,72 @@
|
|||||||
|
<!--
|
||||||
|
* @Descripttion:
|
||||||
|
* @version:
|
||||||
|
* @Author: JC9527
|
||||||
|
* @Date: 2023-09-18 10:08:30
|
||||||
|
* @LastEditors: JC9527
|
||||||
|
* @LastEditTime: 2023-09-22 14:36:35
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="plan-management">
|
||||||
|
<div class="plan-bottomBox">
|
||||||
|
<component :is="defaultRouter" :value="input" ref="myComponents"></component>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import inviteView from '../../components/invite.vue'
|
||||||
|
import recommendView from '../../components/recommend.vue'
|
||||||
|
export default {
|
||||||
|
components:{inviteView,recommendView},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
input: '',
|
||||||
|
activeName: 'recommendView',
|
||||||
|
defaultRouter:'recommendView',
|
||||||
|
isClick:false,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
// 输入框的值
|
||||||
|
changeInput(value){
|
||||||
|
this.input = value;
|
||||||
|
this.isClick = true;
|
||||||
|
},
|
||||||
|
// 监听输入框是否清空
|
||||||
|
changeValue(value){
|
||||||
|
if(this.isClick && value == ''){
|
||||||
|
this.$refs.myComponents.getList('1')
|
||||||
|
this.isClick = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleClick() {
|
||||||
|
this.defaultRouter = this.activeName
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async created() {
|
||||||
|
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.plan-management {
|
||||||
|
padding: 0 20px 10px 20px;
|
||||||
|
background-color: #fff;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 10px 10px 0 0;
|
||||||
|
box-shadow: 0px 0px 15px 0px rgba(229,212,212,0.58);
|
||||||
|
.plan-topBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 20px 0 0 0;
|
||||||
|
::v-deep .el-tabs--top {
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.plan-bottomBox {
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,73 @@
|
|||||||
|
<!--
|
||||||
|
* @Descripttion:
|
||||||
|
* @version:
|
||||||
|
* @Author: JC9527
|
||||||
|
* @Date: 2023-09-18 10:08:30
|
||||||
|
* @LastEditors: JC9527
|
||||||
|
* @LastEditTime: 2023-09-22 14:36:35
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="plan-management">
|
||||||
|
<div class="plan-bottomBox">
|
||||||
|
<component :is="defaultRouter" :value="input" ref="myComponents"></component>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import inviteView from '../../components/invite.vue'
|
||||||
|
import recommendView from '../../components/recommend.vue'
|
||||||
|
import myInput from "@/views/components/myInput/index.vue"
|
||||||
|
export default {
|
||||||
|
components:{inviteView,recommendView,myInput},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
input: '',
|
||||||
|
activeName: 'inviteView',
|
||||||
|
defaultRouter:'inviteView',
|
||||||
|
isClick:false,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
// 输入框的值
|
||||||
|
changeInput(value){
|
||||||
|
this.input = value;
|
||||||
|
this.isClick = true;
|
||||||
|
},
|
||||||
|
// 监听输入框是否清空
|
||||||
|
changeValue(value){
|
||||||
|
if(this.isClick && value == ''){
|
||||||
|
this.$refs.myComponents.getList('1')
|
||||||
|
this.isClick = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleClick() {
|
||||||
|
this.defaultRouter = this.activeName
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async created() {
|
||||||
|
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.plan-management {
|
||||||
|
padding: 0 20px 10px 20px;
|
||||||
|
background-color: #fff;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 10px 10px 0 0;
|
||||||
|
box-shadow: 0px 0px 15px 0px rgba(229,212,212,0.58);
|
||||||
|
.plan-topBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 20px 0 0 0;
|
||||||
|
::v-deep .el-tabs--top {
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.plan-bottomBox {
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,376 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container" ref="apps">
|
||||||
|
<div class="titleInput" ref="titleInput">
|
||||||
|
<el-input
|
||||||
|
placeholder="请输入姓名"
|
||||||
|
v-model="afterParams.nationalityRange"
|
||||||
|
class="input-with-select"
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
slot="append"
|
||||||
|
icon="el-icon-search"
|
||||||
|
@click="search"
|
||||||
|
></el-button>
|
||||||
|
</el-input>
|
||||||
|
</div>
|
||||||
|
<div v-loading="loads">
|
||||||
|
<div class="peopleContent" v-if="arrList.length > 0">
|
||||||
|
<div class="subMan" v-for="(item, index) in arrList" :key="index">
|
||||||
|
<div class="leftSub">
|
||||||
|
<div
|
||||||
|
class="leftAvatar"
|
||||||
|
:style="`background-image:url('${require('../../../../assets/images/profile.jpg')}')`"
|
||||||
|
></div>
|
||||||
|
<div class="leftName">
|
||||||
|
<div>周爱</div>
|
||||||
|
<div class="mainTag">
|
||||||
|
<!-- <div>{{ item.ageRange }}</div>
|
||||||
|
<div>
|
||||||
|
{{ item.sexRange }}
|
||||||
|
</div>
|
||||||
|
<div>{{ item.educationRange }}</div> -->
|
||||||
|
<div
|
||||||
|
v-show="itema != ''"
|
||||||
|
v-for="(itema, index) in item.arrlist"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
{{ itema }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="rightSub">
|
||||||
|
<div class="lookDetail" @click="looks(item.id)">查看</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-else class="noneStyle">暂无数据</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="pagination" ref="pagination">
|
||||||
|
<my-pagination :total="total" @pagesChange="pagesChange"></my-pagination>
|
||||||
|
</div>
|
||||||
|
<!-- 查看该人员的详情 -->
|
||||||
|
<el-dialog
|
||||||
|
:visible.sync="peopelDetail"
|
||||||
|
width="40%"
|
||||||
|
@close="cancel"
|
||||||
|
:destroy-on-close="true"
|
||||||
|
>
|
||||||
|
<div slot="title">
|
||||||
|
<div class="titleText">查看人员详情</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-content">
|
||||||
|
<el-descriptions class="margin-top" :column="2" border>
|
||||||
|
<el-descriptions-item
|
||||||
|
v-for="(item, index) in beforeData"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<template slot="label"> {{ item.name }} </template>
|
||||||
|
{{ item.value }}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { peopleList, peopleGet } from "@/api/volunteer/hdgl";
|
||||||
|
import myPagination from "@/views/components/myPagination/index.vue";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
arrList: [],
|
||||||
|
form: {
|
||||||
|
pageSize: 10,
|
||||||
|
pageNum: 1,
|
||||||
|
},
|
||||||
|
afterParams: {
|
||||||
|
nationalityRange: "",
|
||||||
|
},
|
||||||
|
total: 0,
|
||||||
|
loads: false,
|
||||||
|
//=========
|
||||||
|
peopelDetail: false,
|
||||||
|
beforeData: [
|
||||||
|
{
|
||||||
|
name: "年龄",
|
||||||
|
label: "ageRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "文化程度",
|
||||||
|
label: "educationRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "小区",
|
||||||
|
label: "housingRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "行业类型",
|
||||||
|
label: "industryRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "兴趣爱好",
|
||||||
|
label: "interestRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "国籍",
|
||||||
|
label: "nationalityRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
name: "政治面貌",
|
||||||
|
label: "politicalRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "专业类型",
|
||||||
|
label: "professionalRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "院校",
|
||||||
|
label: "schoolRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "性别",
|
||||||
|
label: "sexRange",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
arr: [
|
||||||
|
"ageRange",
|
||||||
|
"sexRange",
|
||||||
|
"politicalRange",
|
||||||
|
"educationRange",
|
||||||
|
"housingRange",
|
||||||
|
"industryRange",
|
||||||
|
"interestRange",
|
||||||
|
"professionalRange",
|
||||||
|
"schoolRange",
|
||||||
|
"nationalityRange",
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
cancel() {
|
||||||
|
this.peopelDetail = false;
|
||||||
|
},
|
||||||
|
looks(e) {
|
||||||
|
peopleGet(e).then((res) => {
|
||||||
|
this.beforeData.forEach((value, index) => {
|
||||||
|
for (let key in res.data) {
|
||||||
|
if (value.label == key) {
|
||||||
|
this.beforeData[index].value = res.data[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.peopelDetail = true;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
search() {
|
||||||
|
this.form = { ...this.form, ...this.afterParams };
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
//标签生成
|
||||||
|
labelgenerate(data = {}) {
|
||||||
|
let arrlist = [];
|
||||||
|
for (let key3 of this.arr) {
|
||||||
|
for (let key4 in data) {
|
||||||
|
if (key3 == key4) {
|
||||||
|
let a = data[key3];
|
||||||
|
arrlist.push(a);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return arrlist;
|
||||||
|
},
|
||||||
|
getList() {
|
||||||
|
this.loads = true;
|
||||||
|
peopleList(this.form).then((res) => {
|
||||||
|
this.arrList = res.rows;
|
||||||
|
if (this.arrList.length > 0) {
|
||||||
|
this.arrList.forEach((item) => {
|
||||||
|
item.arrlist = this.labelgenerate(item);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.total = res.total;
|
||||||
|
this.loads = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
pagesChange(e) {
|
||||||
|
this.form.pageNum = e.pageNum;
|
||||||
|
this.form.pageSize = e.pageSize;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
myPagination,
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.noneStyle {
|
||||||
|
height: 490px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Medium.otf";
|
||||||
|
color: #606266;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.center-content {
|
||||||
|
padding: 20px 30px;
|
||||||
|
}
|
||||||
|
::v-deep .margin-top td {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
}
|
||||||
|
::v-deep .margin-top th {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog {
|
||||||
|
border-radius: 10px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__header {
|
||||||
|
padding: 10px;
|
||||||
|
padding-left: 15px;
|
||||||
|
background: #f7f5f5;
|
||||||
|
border-top-left-radius: 10px;
|
||||||
|
border-top-right-radius: 10px;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__body {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__footer {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__headerbtn {
|
||||||
|
top: 12px;
|
||||||
|
}
|
||||||
|
.titleText {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
font-weight: bold;
|
||||||
|
color: #4c4949;
|
||||||
|
padding-left: 15px;
|
||||||
|
font-size: 16px;
|
||||||
|
position: relative;
|
||||||
|
&::before {
|
||||||
|
position: absolute;
|
||||||
|
top: 3.8px;
|
||||||
|
left: 0;
|
||||||
|
content: "";
|
||||||
|
width: 5px;
|
||||||
|
height: 15px;
|
||||||
|
background: #f8414d;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .titleInput .el-input__inner {
|
||||||
|
border-right: none;
|
||||||
|
}
|
||||||
|
::v-deep .titleInput .el-input-group__append {
|
||||||
|
background: #f8414d;
|
||||||
|
border: none;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.titleInput {
|
||||||
|
width: 30%;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.mainTag {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Regular";
|
||||||
|
& > div {
|
||||||
|
margin-bottom: 5px;
|
||||||
|
margin-right: 5px;
|
||||||
|
background-color: rgba(248, 65, 77, 0.06);
|
||||||
|
padding: 3px 5px;
|
||||||
|
color: #e16a70;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.peopleContent {
|
||||||
|
height: 490px;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-content: flex-start;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
.subMan {
|
||||||
|
width: 49.2%;
|
||||||
|
height: 20.4%;
|
||||||
|
background: #fafafa;
|
||||||
|
border: 1px solid #f5edeb;
|
||||||
|
border-radius: 10px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin-bottom: 17px;
|
||||||
|
padding: 15px;
|
||||||
|
.leftSub {
|
||||||
|
width: 80%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.leftAvatar {
|
||||||
|
min-height: 100%;
|
||||||
|
width: 77px;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
.leftName {
|
||||||
|
margin-left: 15px;
|
||||||
|
& > div:nth-of-type(1) {
|
||||||
|
font-family: "Alibaba-PuHuiTi-Medium.otf";
|
||||||
|
color: #4c4949;
|
||||||
|
font-size: 18px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
& > div:nth-of-type(2) {
|
||||||
|
margin-bottom: -10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.rightSub {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
.lookDetail {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
background: #ffffff;
|
||||||
|
box-shadow: 0px 0px 15px 0px rgba(77, 161, 254, 0.17);
|
||||||
|
border-radius: 50%;
|
||||||
|
font-family: "Alibaba-PuHuiTi-Medium.otf";
|
||||||
|
font-weight: 400;
|
||||||
|
color: #188ffe;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,402 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||||
|
<el-form-item label="字典名称" prop="dictType">
|
||||||
|
<el-select v-model="queryParams.dictType">
|
||||||
|
<el-option
|
||||||
|
v-for="item in typeOptions"
|
||||||
|
:key="item.dictId"
|
||||||
|
:label="item.dictName"
|
||||||
|
:value="item.dictType"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="字典标签" prop="dictLabel">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.dictLabel"
|
||||||
|
placeholder="请输入字典标签"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select v-model="queryParams.status" placeholder="数据状态" clearable>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
plain
|
||||||
|
icon="el-icon-plus"
|
||||||
|
size="mini"
|
||||||
|
@click="handleAdd"
|
||||||
|
v-hasPermi="['system:dict:add']"
|
||||||
|
>新增</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="success"
|
||||||
|
plain
|
||||||
|
icon="el-icon-edit"
|
||||||
|
size="mini"
|
||||||
|
:disabled="single"
|
||||||
|
@click="handleUpdate"
|
||||||
|
v-hasPermi="['system:dict:edit']"
|
||||||
|
>修改</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="danger"
|
||||||
|
plain
|
||||||
|
icon="el-icon-delete"
|
||||||
|
size="mini"
|
||||||
|
:disabled="multiple"
|
||||||
|
@click="handleDelete"
|
||||||
|
v-hasPermi="['system:dict:remove']"
|
||||||
|
>删除</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="warning"
|
||||||
|
plain
|
||||||
|
icon="el-icon-download"
|
||||||
|
size="mini"
|
||||||
|
@click="handleExport"
|
||||||
|
v-hasPermi="['system:dict:export']"
|
||||||
|
>导出</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="warning"
|
||||||
|
plain
|
||||||
|
icon="el-icon-close"
|
||||||
|
size="mini"
|
||||||
|
@click="handleClose"
|
||||||
|
>关闭</el-button>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
|
<el-table-column label="字典编码" align="center" prop="dictCode" />
|
||||||
|
<el-table-column label="字典标签" align="center" prop="dictLabel">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span v-if="(scope.row.listClass == '' || scope.row.listClass == 'default') && (scope.row.cssClass == '' || scope.row.cssClass == null)">{{ scope.row.dictLabel }}</span>
|
||||||
|
<el-tag v-else :type="scope.row.listClass == 'primary' ? '' : scope.row.listClass" :class="scope.row.cssClass">{{ scope.row.dictLabel }}</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="字典键值" align="center" prop="dictValue" />
|
||||||
|
<el-table-column label="字典排序" align="center" prop="dictSort" />
|
||||||
|
<el-table-column label="状态" align="center" prop="status">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
||||||
|
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
@click="handleUpdate(scope.row)"
|
||||||
|
v-hasPermi="['system:dict:edit']"
|
||||||
|
>修改</el-button>
|
||||||
|
<!-- <el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-delete"
|
||||||
|
@click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['system:dict:remove']"
|
||||||
|
>删除</el-button> -->
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<pagination
|
||||||
|
v-show="total>0"
|
||||||
|
:total="total"
|
||||||
|
:page.sync="queryParams.pageNum"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- 添加或修改参数配置对话框 -->
|
||||||
|
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||||
|
<el-form-item label="字典类型">
|
||||||
|
<el-input v-model="form.dictType" :disabled="true" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据标签" prop="dictLabel">
|
||||||
|
<el-input v-model="form.dictLabel" placeholder="请输入数据标签" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据键值" prop="dictValue">
|
||||||
|
<el-input v-model="form.dictValue" placeholder="请输入数据键值" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="样式属性" prop="cssClass">
|
||||||
|
<el-input v-model="form.cssClass" placeholder="请输入样式属性" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="显示排序" prop="dictSort">
|
||||||
|
<el-input-number v-model="form.dictSort" controls-position="right" :min="0" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="回显样式" prop="listClass">
|
||||||
|
<el-select v-model="form.listClass">
|
||||||
|
<el-option
|
||||||
|
v-for="item in listClassOptions"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label + '(' + item.value + ')'"
|
||||||
|
:value="item.value"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-radio-group v-model="form.status">
|
||||||
|
<el-radio
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.value"
|
||||||
|
>{{dict.label}}</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||||
|
<el-button @click="cancel">取 消</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { listData, getData, delData, addData, updateData } from "@/api/system/dict/data";
|
||||||
|
import { optionselect as getDictOptionselect, getType } from "@/api/system/dict/type";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "Data",
|
||||||
|
dicts: ['sys_normal_disable'],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 遮罩层
|
||||||
|
loading: true,
|
||||||
|
// 选中数组
|
||||||
|
ids: [],
|
||||||
|
// 非单个禁用
|
||||||
|
single: true,
|
||||||
|
// 非多个禁用
|
||||||
|
multiple: true,
|
||||||
|
// 显示搜索条件
|
||||||
|
showSearch: true,
|
||||||
|
// 总条数
|
||||||
|
total: 0,
|
||||||
|
// 字典表格数据
|
||||||
|
dataList: [],
|
||||||
|
// 默认字典类型
|
||||||
|
defaultDictType: "",
|
||||||
|
// 弹出层标题
|
||||||
|
title: "",
|
||||||
|
// 是否显示弹出层
|
||||||
|
open: false,
|
||||||
|
// 数据标签回显样式
|
||||||
|
listClassOptions: [
|
||||||
|
{
|
||||||
|
value: "default",
|
||||||
|
label: "默认"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "primary",
|
||||||
|
label: "主要"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "success",
|
||||||
|
label: "成功"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "info",
|
||||||
|
label: "信息"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "warning",
|
||||||
|
label: "警告"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "danger",
|
||||||
|
label: "危险"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 类型数据字典
|
||||||
|
typeOptions: [],
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
dictName: undefined,
|
||||||
|
dictType: undefined,
|
||||||
|
status: undefined
|
||||||
|
},
|
||||||
|
// 表单参数
|
||||||
|
form: {},
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
dictLabel: [
|
||||||
|
{ required: true, message: "数据标签不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
dictValue: [
|
||||||
|
{ required: true, message: "数据键值不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
dictSort: [
|
||||||
|
{ required: true, message: "数据顺序不能为空", trigger: "blur" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
const dictId = this.$route.params && this.$route.params.dictId;
|
||||||
|
this.getType(dictId);
|
||||||
|
this.getTypeList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 查询字典类型详细 */
|
||||||
|
getType(dictId) {
|
||||||
|
getType(dictId).then(response => {
|
||||||
|
this.queryParams.dictType = response.data.dictType;
|
||||||
|
this.defaultDictType = response.data.dictType;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 查询字典类型列表 */
|
||||||
|
getTypeList() {
|
||||||
|
getDictOptionselect().then(response => {
|
||||||
|
this.typeOptions = response.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 查询字典数据列表 */
|
||||||
|
getList() {
|
||||||
|
this.loading = true;
|
||||||
|
listData(this.queryParams).then(response => {
|
||||||
|
this.dataList = response.rows;
|
||||||
|
this.total = response.total;
|
||||||
|
this.loading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 取消按钮
|
||||||
|
cancel() {
|
||||||
|
this.open = false;
|
||||||
|
this.reset();
|
||||||
|
},
|
||||||
|
// 表单重置
|
||||||
|
reset() {
|
||||||
|
this.form = {
|
||||||
|
dictCode: undefined,
|
||||||
|
dictLabel: undefined,
|
||||||
|
dictValue: undefined,
|
||||||
|
cssClass: undefined,
|
||||||
|
listClass: 'default',
|
||||||
|
dictSort: 0,
|
||||||
|
status: "0",
|
||||||
|
remark: undefined
|
||||||
|
};
|
||||||
|
this.resetForm("form");
|
||||||
|
},
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.pageNum = 1;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
/** 返回按钮操作 */
|
||||||
|
handleClose() {
|
||||||
|
const obj = { path: "/volunteer/userbq/dictGl" };
|
||||||
|
this.$tab.closeOpenPage(obj);
|
||||||
|
},
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
resetQuery() {
|
||||||
|
this.resetForm("queryForm");
|
||||||
|
this.queryParams.dictType = this.defaultDictType;
|
||||||
|
this.handleQuery();
|
||||||
|
},
|
||||||
|
/** 新增按钮操作 */
|
||||||
|
handleAdd() {
|
||||||
|
this.reset();
|
||||||
|
this.open = true;
|
||||||
|
this.title = "添加字典数据";
|
||||||
|
this.form.dictType = this.queryParams.dictType;
|
||||||
|
},
|
||||||
|
// 多选框选中数据
|
||||||
|
handleSelectionChange(selection) {
|
||||||
|
this.ids = selection.map(item => item.dictCode)
|
||||||
|
this.single = selection.length!=1
|
||||||
|
this.multiple = !selection.length
|
||||||
|
},
|
||||||
|
/** 修改按钮操作 */
|
||||||
|
handleUpdate(row) {
|
||||||
|
this.reset();
|
||||||
|
const dictCode = row.dictCode || this.ids
|
||||||
|
getData(dictCode).then(response => {
|
||||||
|
this.form = response.data;
|
||||||
|
this.open = true;
|
||||||
|
this.title = "修改字典数据";
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 提交按钮 */
|
||||||
|
submitForm: function() {
|
||||||
|
this.$refs["form"].validate(valid => {
|
||||||
|
if (valid) {
|
||||||
|
if (this.form.dictCode != undefined) {
|
||||||
|
updateData(this.form).then(response => {
|
||||||
|
this.$store.dispatch('dict/removeDict', this.queryParams.dictType);
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
addData(this.form).then(response => {
|
||||||
|
this.$store.dispatch('dict/removeDict', this.queryParams.dictType);
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 删除按钮操作 */
|
||||||
|
handleDelete(row) {
|
||||||
|
const dictCodes = row.dictCode || this.ids;
|
||||||
|
this.$modal.confirm('是否确认删除字典编码为"' + dictCodes + '"的数据项？').then(function() {
|
||||||
|
return delData(dictCodes);
|
||||||
|
}).then(() => {
|
||||||
|
this.getList();
|
||||||
|
this.$modal.msgSuccess("删除成功");
|
||||||
|
this.$store.dispatch('dict/removeDict', this.queryParams.dictType);
|
||||||
|
}).catch(() => {});
|
||||||
|
},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
this.download('system/dict/data/export', {
|
||||||
|
...this.queryParams
|
||||||
|
}, `data_${new Date().getTime()}.xlsx`)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
@ -0,0 +1,348 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||||
|
<el-form-item label="字典名称" prop="dictName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.dictName"
|
||||||
|
placeholder="请输入字典名称"
|
||||||
|
clearable
|
||||||
|
style="width: 240px"
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="字典类型" prop="dictType">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.dictType"
|
||||||
|
placeholder="请输入字典类型"
|
||||||
|
clearable
|
||||||
|
style="width: 240px"
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select
|
||||||
|
v-model="queryParams.status"
|
||||||
|
placeholder="字典状态"
|
||||||
|
clearable
|
||||||
|
style="width: 240px"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="创建时间">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="dateRange"
|
||||||
|
style="width: 240px"
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
type="daterange"
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
plain
|
||||||
|
icon="el-icon-plus"
|
||||||
|
size="mini"
|
||||||
|
@click="handleAdd"
|
||||||
|
v-hasPermi="['system:dict:add']"
|
||||||
|
>新增</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="success"
|
||||||
|
plain
|
||||||
|
icon="el-icon-edit"
|
||||||
|
size="mini"
|
||||||
|
:disabled="single"
|
||||||
|
@click="handleUpdate"
|
||||||
|
v-hasPermi="['system:dict:edit']"
|
||||||
|
>修改</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="danger"
|
||||||
|
plain
|
||||||
|
icon="el-icon-delete"
|
||||||
|
size="mini"
|
||||||
|
:disabled="multiple"
|
||||||
|
@click="handleDelete"
|
||||||
|
v-hasPermi="['system:dict:remove']"
|
||||||
|
>删除</el-button>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="warning"
|
||||||
|
plain
|
||||||
|
icon="el-icon-download"
|
||||||
|
size="mini"
|
||||||
|
@click="handleExport"
|
||||||
|
v-hasPermi="['system:dict:export']"
|
||||||
|
>导出</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="danger"
|
||||||
|
plain
|
||||||
|
icon="el-icon-refresh"
|
||||||
|
size="mini"
|
||||||
|
@click="handleRefreshCache"
|
||||||
|
v-hasPermi="['system:dict:remove']"
|
||||||
|
>刷新缓存</el-button>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-table v-loading="loading" :data="typeList" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
|
<el-table-column label="字典编号" align="center" prop="dictId" />
|
||||||
|
<el-table-column label="字典名称" align="center" prop="dictName" :show-overflow-tooltip="true" />
|
||||||
|
<el-table-column label="字典类型" align="center" :show-overflow-tooltip="true">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<router-link :to="'/volunteer/zyzsjgl/zdgl/' + scope.row.dictId" class="link-type">
|
||||||
|
<span>{{ scope.row.dictType }}</span>
|
||||||
|
</router-link>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="状态" align="center" prop="status">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
||||||
|
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
@click="handleUpdate(scope.row)"
|
||||||
|
v-hasPermi="['system:dict:edit']"
|
||||||
|
>修改</el-button>
|
||||||
|
<!-- <el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-delete"
|
||||||
|
@click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['system:dict:remove']"
|
||||||
|
>删除</el-button> -->
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<pagination
|
||||||
|
v-show="total>0"
|
||||||
|
:total="total"
|
||||||
|
:page.sync="queryParams.pageNum"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- 添加或修改参数配置对话框 -->
|
||||||
|
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||||
|
<el-form-item label="字典名称" prop="dictName">
|
||||||
|
<el-input v-model="form.dictName" placeholder="请输入字典名称" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="字典类型" prop="dictType">
|
||||||
|
<el-input v-model="form.dictType" placeholder="请输入字典类型" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-radio-group v-model="form.status">
|
||||||
|
<el-radio
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.value"
|
||||||
|
>{{dict.label}}</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||||
|
<el-button @click="cancel">取 消</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { listType, getType, delType, addType, updateType, refreshCache } from "@/api/system/dict/type";
|
||||||
|
import delgdata from "./data.vue"
|
||||||
|
export default {
|
||||||
|
name: "Dict",
|
||||||
|
dicts: ['sys_normal_disable'],
|
||||||
|
components:{delgdata},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 遮罩层
|
||||||
|
loading: true,
|
||||||
|
// 选中数组
|
||||||
|
ids: [],
|
||||||
|
// 非单个禁用
|
||||||
|
single: true,
|
||||||
|
// 非多个禁用
|
||||||
|
multiple: true,
|
||||||
|
// 显示搜索条件
|
||||||
|
showSearch: true,
|
||||||
|
// 总条数
|
||||||
|
total: 0,
|
||||||
|
// 字典表格数据
|
||||||
|
typeList: [],
|
||||||
|
// 弹出层标题
|
||||||
|
title: "",
|
||||||
|
// 是否显示弹出层
|
||||||
|
open: false,
|
||||||
|
// 日期范围
|
||||||
|
dateRange: [],
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
dictName: undefined,
|
||||||
|
dictType: undefined,
|
||||||
|
status: undefined
|
||||||
|
},
|
||||||
|
// 表单参数
|
||||||
|
form: {},
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
dictName: [
|
||||||
|
{ required: true, message: "字典名称不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
dictType: [
|
||||||
|
{ required: true, message: "字典类型不能为空", trigger: "blur" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 查询字典类型列表 */
|
||||||
|
getList() {
|
||||||
|
this.loading = true;
|
||||||
|
listType(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||||
|
this.typeList = response.rows;
|
||||||
|
this.total = response.total;
|
||||||
|
this.loading = false;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
// 取消按钮
|
||||||
|
cancel() {
|
||||||
|
this.open = false;
|
||||||
|
this.reset();
|
||||||
|
},
|
||||||
|
// 表单重置
|
||||||
|
reset() {
|
||||||
|
this.form = {
|
||||||
|
dictId: undefined,
|
||||||
|
dictName: undefined,
|
||||||
|
dictType: undefined,
|
||||||
|
status: "0",
|
||||||
|
remark: undefined
|
||||||
|
};
|
||||||
|
this.resetForm("form");
|
||||||
|
},
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.pageNum = 1;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
resetQuery() {
|
||||||
|
this.dateRange = [];
|
||||||
|
this.resetForm("queryForm");
|
||||||
|
this.handleQuery();
|
||||||
|
},
|
||||||
|
/** 新增按钮操作 */
|
||||||
|
handleAdd() {
|
||||||
|
this.reset();
|
||||||
|
this.open = true;
|
||||||
|
this.title = "添加字典类型";
|
||||||
|
},
|
||||||
|
// 多选框选中数据
|
||||||
|
handleSelectionChange(selection) {
|
||||||
|
this.ids = selection.map(item => item.dictId)
|
||||||
|
this.single = selection.length!=1
|
||||||
|
this.multiple = !selection.length
|
||||||
|
},
|
||||||
|
/** 修改按钮操作 */
|
||||||
|
handleUpdate(row) {
|
||||||
|
this.reset();
|
||||||
|
const dictId = row.dictId || this.ids
|
||||||
|
getType(dictId).then(response => {
|
||||||
|
this.form = response.data;
|
||||||
|
this.open = true;
|
||||||
|
this.title = "修改字典类型";
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 提交按钮 */
|
||||||
|
submitForm: function() {
|
||||||
|
this.$refs["form"].validate(valid => {
|
||||||
|
if (valid) {
|
||||||
|
if (this.form.dictId != undefined) {
|
||||||
|
updateType(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
addType(this.form).then(response => {
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 删除按钮操作 */
|
||||||
|
handleDelete(row) {
|
||||||
|
const dictIds = row.dictId || this.ids;
|
||||||
|
this.$modal.confirm('是否确认删除字典编号为"' + dictIds + '"的数据项？').then(function() {
|
||||||
|
return delType(dictIds);
|
||||||
|
}).then(() => {
|
||||||
|
this.getList();
|
||||||
|
this.$modal.msgSuccess("删除成功");
|
||||||
|
}).catch(() => {});
|
||||||
|
},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
this.download('system/dict/type/export', {
|
||||||
|
...this.queryParams
|
||||||
|
}, `type_${new Date().getTime()}.xlsx`)
|
||||||
|
},
|
||||||
|
/** 刷新缓存按钮操作 */
|
||||||
|
handleRefreshCache() {
|
||||||
|
refreshCache().then(() => {
|
||||||
|
this.$modal.msgSuccess("刷新成功");
|
||||||
|
this.$store.dispatch('dict/cleanDict');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
@ -0,0 +1,402 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||||
|
<el-form-item label="字典名称" prop="dictType">
|
||||||
|
<el-select v-model="queryParams.dictType">
|
||||||
|
<el-option
|
||||||
|
v-for="item in typeOptions"
|
||||||
|
:key="item.dictId"
|
||||||
|
:label="item.dictName"
|
||||||
|
:value="item.dictType"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="字典标签" prop="dictLabel">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.dictLabel"
|
||||||
|
placeholder="请输入字典标签"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select v-model="queryParams.status" placeholder="数据状态" clearable>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
plain
|
||||||
|
icon="el-icon-plus"
|
||||||
|
size="mini"
|
||||||
|
@click="handleAdd"
|
||||||
|
v-hasPermi="['system:dict:add']"
|
||||||
|
>新增</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="success"
|
||||||
|
plain
|
||||||
|
icon="el-icon-edit"
|
||||||
|
size="mini"
|
||||||
|
:disabled="single"
|
||||||
|
@click="handleUpdate"
|
||||||
|
v-hasPermi="['system:dict:edit']"
|
||||||
|
>修改</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="danger"
|
||||||
|
plain
|
||||||
|
icon="el-icon-delete"
|
||||||
|
size="mini"
|
||||||
|
:disabled="multiple"
|
||||||
|
@click="handleDelete"
|
||||||
|
v-hasPermi="['system:dict:remove']"
|
||||||
|
>删除</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<!-- <el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="warning"
|
||||||
|
plain
|
||||||
|
icon="el-icon-download"
|
||||||
|
size="mini"
|
||||||
|
@click="handleExport"
|
||||||
|
v-hasPermi="['system:dict:export']"
|
||||||
|
>导出</el-button>
|
||||||
|
</el-col> -->
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="warning"
|
||||||
|
plain
|
||||||
|
icon="el-icon-close"
|
||||||
|
size="mini"
|
||||||
|
@click="handleClose"
|
||||||
|
>关闭</el-button>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
|
<el-table-column label="字典编码" align="center" prop="dictCode" />
|
||||||
|
<el-table-column label="字典标签" align="center" prop="dictLabel">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span v-if="(scope.row.listClass == '' || scope.row.listClass == 'default') && (scope.row.cssClass == '' || scope.row.cssClass == null)">{{ scope.row.dictLabel }}</span>
|
||||||
|
<el-tag v-else :type="scope.row.listClass == 'primary' ? '' : scope.row.listClass" :class="scope.row.cssClass">{{ scope.row.dictLabel }}</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="字典键值" align="center" prop="dictValue" />
|
||||||
|
<el-table-column label="字典排序" align="center" prop="dictSort" />
|
||||||
|
<el-table-column label="状态" align="center" prop="status">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
||||||
|
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
@click="handleUpdate(scope.row)"
|
||||||
|
v-hasPermi="['system:dict:edit']"
|
||||||
|
>修改</el-button>
|
||||||
|
<!-- <el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-delete"
|
||||||
|
@click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['system:dict:remove']"
|
||||||
|
>删除</el-button> -->
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<pagination
|
||||||
|
v-show="total>0"
|
||||||
|
:total="total"
|
||||||
|
:page.sync="queryParams.pageNum"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- 添加或修改参数配置对话框 -->
|
||||||
|
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||||
|
<el-form-item label="字典类型">
|
||||||
|
<el-input v-model="form.dictType" :disabled="true" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据标签" prop="dictLabel">
|
||||||
|
<el-input v-model="form.dictLabel" placeholder="请输入数据标签" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="数据键值" prop="dictValue">
|
||||||
|
<el-input v-model="form.dictValue" placeholder="请输入数据键值" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="样式属性" prop="cssClass">
|
||||||
|
<el-input v-model="form.cssClass" placeholder="请输入样式属性" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="显示排序" prop="dictSort">
|
||||||
|
<el-input-number v-model="form.dictSort" controls-position="right" :min="0" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="回显样式" prop="listClass">
|
||||||
|
<el-select v-model="form.listClass">
|
||||||
|
<el-option
|
||||||
|
v-for="item in listClassOptions"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label + '(' + item.value + ')'"
|
||||||
|
:value="item.value"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-radio-group v-model="form.status">
|
||||||
|
<el-radio
|
||||||
|
v-for="dict in dict.type.sys_normal_disable"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.value"
|
||||||
|
>{{dict.label}}</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||||
|
<el-button @click="cancel">取 消</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { listData, getData, delData, addData, updateData } from "@/api/system/dict/data";
|
||||||
|
import { optionselect as getDictOptionselect, getType } from "@/api/system/dict/type";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "Data",
|
||||||
|
dicts: ['sys_normal_disable'],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 遮罩层
|
||||||
|
loading: true,
|
||||||
|
// 选中数组
|
||||||
|
ids: [],
|
||||||
|
// 非单个禁用
|
||||||
|
single: true,
|
||||||
|
// 非多个禁用
|
||||||
|
multiple: true,
|
||||||
|
// 显示搜索条件
|
||||||
|
showSearch: true,
|
||||||
|
// 总条数
|
||||||
|
total: 0,
|
||||||
|
// 字典表格数据
|
||||||
|
dataList: [],
|
||||||
|
// 默认字典类型
|
||||||
|
defaultDictType: "",
|
||||||
|
// 弹出层标题
|
||||||
|
title: "",
|
||||||
|
// 是否显示弹出层
|
||||||
|
open: false,
|
||||||
|
// 数据标签回显样式
|
||||||
|
listClassOptions: [
|
||||||
|
{
|
||||||
|
value: "default",
|
||||||
|
label: "默认"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "primary",
|
||||||
|
label: "主要"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "success",
|
||||||
|
label: "成功"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "info",
|
||||||
|
label: "信息"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "warning",
|
||||||
|
label: "警告"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "danger",
|
||||||
|
label: "危险"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 类型数据字典
|
||||||
|
typeOptions: [],
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
dictName: undefined,
|
||||||
|
dictType: undefined,
|
||||||
|
status: undefined
|
||||||
|
},
|
||||||
|
// 表单参数
|
||||||
|
form: {},
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
dictLabel: [
|
||||||
|
{ required: true, message: "数据标签不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
dictValue: [
|
||||||
|
{ required: true, message: "数据键值不能为空", trigger: "blur" }
|
||||||
|
],
|
||||||
|
dictSort: [
|
||||||
|
{ required: true, message: "数据顺序不能为空", trigger: "blur" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
const dictId = this.$route.params && this.$route.params.dictId;
|
||||||
|
this.getType(dictId);
|
||||||
|
this.getTypeList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 查询字典类型详细 */
|
||||||
|
getType(dictId) {
|
||||||
|
getType(dictId).then(response => {
|
||||||
|
this.queryParams.dictType = response.data.dictType;
|
||||||
|
this.defaultDictType = response.data.dictType;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 查询字典类型列表 */
|
||||||
|
getTypeList() {
|
||||||
|
getDictOptionselect().then(response => {
|
||||||
|
this.typeOptions = response.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 查询字典数据列表 */
|
||||||
|
getList() {
|
||||||
|
this.loading = true;
|
||||||
|
listData(this.queryParams).then(response => {
|
||||||
|
this.dataList = response.rows;
|
||||||
|
this.total = response.total;
|
||||||
|
this.loading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 取消按钮
|
||||||
|
cancel() {
|
||||||
|
this.open = false;
|
||||||
|
this.reset();
|
||||||
|
},
|
||||||
|
// 表单重置
|
||||||
|
reset() {
|
||||||
|
this.form = {
|
||||||
|
dictCode: undefined,
|
||||||
|
dictLabel: undefined,
|
||||||
|
dictValue: undefined,
|
||||||
|
cssClass: undefined,
|
||||||
|
listClass: 'default',
|
||||||
|
dictSort: 0,
|
||||||
|
status: "0",
|
||||||
|
remark: undefined
|
||||||
|
};
|
||||||
|
this.resetForm("form");
|
||||||
|
},
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.pageNum = 1;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
/** 返回按钮操作 */
|
||||||
|
handleClose() {
|
||||||
|
const obj = { path: "/volunteer/zyzsjgl/zdgl" };
|
||||||
|
this.$tab.closeOpenPage(obj);
|
||||||
|
},
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
resetQuery() {
|
||||||
|
this.resetForm("queryForm");
|
||||||
|
this.queryParams.dictType = this.defaultDictType;
|
||||||
|
this.handleQuery();
|
||||||
|
},
|
||||||
|
/** 新增按钮操作 */
|
||||||
|
handleAdd() {
|
||||||
|
this.reset();
|
||||||
|
this.open = true;
|
||||||
|
this.title = "添加字典数据";
|
||||||
|
this.form.dictType = this.queryParams.dictType;
|
||||||
|
},
|
||||||
|
// 多选框选中数据
|
||||||
|
handleSelectionChange(selection) {
|
||||||
|
this.ids = selection.map(item => item.dictCode)
|
||||||
|
this.single = selection.length!=1
|
||||||
|
this.multiple = !selection.length
|
||||||
|
},
|
||||||
|
/** 修改按钮操作 */
|
||||||
|
handleUpdate(row) {
|
||||||
|
this.reset();
|
||||||
|
const dictCode = row.dictCode || this.ids
|
||||||
|
getData(dictCode).then(response => {
|
||||||
|
this.form = response.data;
|
||||||
|
this.open = true;
|
||||||
|
this.title = "修改字典数据";
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 提交按钮 */
|
||||||
|
submitForm: function() {
|
||||||
|
this.$refs["form"].validate(valid => {
|
||||||
|
if (valid) {
|
||||||
|
if (this.form.dictCode != undefined) {
|
||||||
|
updateData(this.form).then(response => {
|
||||||
|
this.$store.dispatch('dict/removeDict', this.queryParams.dictType);
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
addData(this.form).then(response => {
|
||||||
|
this.$store.dispatch('dict/removeDict', this.queryParams.dictType);
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
this.open = false;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 删除按钮操作 */
|
||||||
|
handleDelete(row) {
|
||||||
|
const dictCodes = row.dictCode || this.ids;
|
||||||
|
this.$modal.confirm('是否确认删除字典编码为"' + dictCodes + '"的数据项？').then(function() {
|
||||||
|
return delData(dictCodes);
|
||||||
|
}).then(() => {
|
||||||
|
this.getList();
|
||||||
|
this.$modal.msgSuccess("删除成功");
|
||||||
|
this.$store.dispatch('dict/removeDict', this.queryParams.dictType);
|
||||||
|
}).catch(() => {});
|
||||||
|
},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
this.download('system/dict/data/export', {
|
||||||
|
...this.queryParams
|
||||||
|
}, `data_${new Date().getTime()}.xlsx`)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
Loading…
Reference in new issue