李劲龙 2 years ago
commit 37a475562b

@ -1,10 +1,10 @@
# 页面标题 # 页面标题
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://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'

@ -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'

@ -1,7 +1,7 @@
{ {
"name": "ruoyi", "name": "ruoyi",
"version": "3.8.6", "version": "3.8.6",
"description": "若依管理系统", "description": "志愿者管理系统",
"author": "若依", "author": "若依",
"license": "MIT", "license": "MIT",
"scripts": { "scripts": {

@ -20,3 +20,7 @@
font-family: "Alibaba PuHuiTi"; font-family: "Alibaba PuHuiTi";
src: url("http://www.jichuanglanhai.com/demo/taicang-file/fonts/Alibaba-PuHuiTi-Regular.otf"); src: url("http://www.jichuanglanhai.com/demo/taicang-file/fonts/Alibaba-PuHuiTi-Regular.otf");
} }
@font-face {
font-family: "din-bold-2.ttf";
src: url("http://www.jichuanglanhai.com/demo/taicang-file/fonts/din-bold-2.ttf");
}

@ -33,10 +33,10 @@
} }
// //
.info-box { .info-box {
display: flex; // display: flex;
flex-direction: column; // flex-direction: column;
align-items: center; // align-items: center;
justify-content: center; // justify-content: center;
.info-item { .info-item {
display: flex; display: flex;
// align-items: center; // align-items: center;
@ -56,3 +56,82 @@
} }
} }
} }
//
.search {
display: flex;
align-items: center;
justify-content: space-between;
}
//
.book-main {
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
width: 100%;
li {
width: 19%;
height: 48.5%;
margin-right: calc(1% + (2% / 8));
margin-bottom: 1%;
list-style: none;
background: #fff;
box-shadow: 0px 3px 15px 0px rgba(184, 184, 184, 0.22);
border-radius: 10px;
position: relative;
overflow: hidden;
.integral-num {
position: absolute;
top: 6%;
right: 10%;
font-size: 18px;
font-weight: bold;
color: #2aa984;
z-index: 10;
font-family: "din-bold-2.ttf";
}
.operate {
height: 13%;
width: 100%;
display: flex;
justify-content: space-between;
align-content: center;
padding: 0 10px;
.integral {
flex: 1;
padding: 4px 0;
font-weight: 400;
font-family: "Alibaba-PuHuiTi-Regular";
color: #4d4949;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.exchange-btn {
padding: 4px 10px;
font-size: 14px;
cursor: pointer;
font-family: "Alibaba-PuHuiTi-Regular";
font-weight: 400;
color: $--color-primary;
background: rgba(249, 86, 95, 0.1);
border-radius: 4px;
}
}
}
li:nth-of-type(5n) {
margin-right: 0;
}
// li:nth-of-type(n + 2) {
// margin-bottom: 0;
// }
}
::v-deep .pagination-container {
height: 0 !important;
padding: 0 !important;
background: transparent !important;
.el-pagination {
top: 20px;
}
}

@ -14,7 +14,8 @@
-webkit-transition: width 0.28s; -webkit-transition: width 0.28s;
transition: width 0.28s; transition: width 0.28s;
width: $base-sidebar-width !important; width: $base-sidebar-width !important;
background-color: $base-menu-background; // background-color: $base-menu-background;
background-color: transparent;
height: 100%; height: 100%;
// position: fixed; // position: fixed;
font-size: 0px; font-size: 0px;

@ -34,6 +34,21 @@ export default {
computed: { computed: {
...mapGetters(["avatar", "name"]), ...mapGetters(["avatar", "name"]),
}, },
methods: {
async logout() {
this.$confirm("确定注销并退出系统吗?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$store.dispatch("LogOut").then(() => {
location.href = "/index";
});
})
.catch(() => {});
},
},
}; };
</script> </script>

@ -1,76 +1,86 @@
import Vue from 'vue' import Vue from "vue";
import Cookies from 'js-cookie' import Cookies from "js-cookie";
import Element from 'element-ui' import Element from "element-ui";
import './assets/styles/element-variables.scss' import "./assets/styles/element-variables.scss";
import "@/utils/rem.js"; //计算rem基准 import "@/utils/rem.js"; //计算rem基准
import API from "@/api/index.js"; import API from "@/api/index.js";
import '@/assets/styles/index.scss' // global css import "@/assets/styles/index.scss"; // global css
import '@/assets/styles/ruoyi.scss' // ruoyi css import "@/assets/styles/ruoyi.scss"; // ruoyi css
import App from './App' import App from "./App";
import store from './store' import store from "./store";
import router from './router' import router from "./router";
import directive from './directive' // directive import directive from "./directive"; // directive
import plugins from './plugins' // plugins import plugins from "./plugins"; // plugins
import { download } from '@/utils/request' import { download } from "@/utils/request";
import moment from "moment"; import moment from "moment";
import "moment/locale/zh-cn"; import "moment/locale/zh-cn";
moment.locale("zh-cn"); moment.locale("zh-cn");
Vue.prototype.$moment = moment; Vue.prototype.$moment = moment;
import './assets/icons' // icon import "./assets/icons"; // icon
import './permission' // permission control import "./permission"; // permission control
import { getDicts } from "@/api/system/dict/data"; import { getDicts } from "@/api/system/dict/data";
import { getConfigKey } from "@/api/system/config"; import { getConfigKey } from "@/api/system/config";
import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, handleTree } from "@/utils/ruoyi"; import {
parseTime,
resetForm,
addDateRange,
selectDictLabel,
selectDictLabels,
handleTree,
} from "@/utils/ruoyi";
// 分页组件 // 分页组件
import Pagination from "@/components/Pagination"; import Pagination from "@/components/Pagination";
// 自定义表格工具组件 // 自定义表格工具组件
import RightToolbar from "@/components/RightToolbar" import RightToolbar from "@/components/RightToolbar";
// 富文本组件 // 富文本组件
import Editor from "@/components/Editor" import Editor from "@/components/Editor";
// 文件上传组件 // 文件上传组件
import FileUpload from "@/components/FileUpload" import FileUpload from "@/components/FileUpload";
// 图片上传组件 // 图片上传组件
import ImageUpload from "@/components/ImageUpload" import ImageUpload from "@/components/ImageUpload";
// 图片预览组件 // 图片预览组件
import ImagePreview from "@/components/ImagePreview" import ImagePreview from "@/components/ImagePreview";
// 字典标签组件 // 字典标签组件
import DictTag from '@/components/DictTag' import DictTag from "@/components/DictTag";
// 头部标签组件 // 头部标签组件
import VueMeta from 'vue-meta' import VueMeta from "vue-meta";
// 字典数据组件 // 字典数据组件
import DictData from '@/components/DictData' import DictData from "@/components/DictData";
//列表搜索框
import MyInput from "@/views/components/myInput";
// 全局方法挂载 // 全局方法挂载
Vue.prototype.getDicts = getDicts Vue.prototype.getDicts = getDicts;
Vue.prototype.getConfigKey = getConfigKey Vue.prototype.getConfigKey = getConfigKey;
Vue.prototype.parseTime = parseTime Vue.prototype.parseTime = parseTime;
Vue.prototype.resetForm = resetForm Vue.prototype.resetForm = resetForm;
Vue.prototype.addDateRange = addDateRange Vue.prototype.addDateRange = addDateRange;
Vue.prototype.selectDictLabel = selectDictLabel Vue.prototype.selectDictLabel = selectDictLabel;
Vue.prototype.selectDictLabels = selectDictLabels Vue.prototype.selectDictLabels = selectDictLabels;
Vue.prototype.download = download Vue.prototype.download = download;
Vue.prototype.handleTree = handleTree Vue.prototype.handleTree = handleTree;
Vue.prototype.$api = API Vue.prototype.$api = API;
// 全局组件挂载 // 全局组件挂载
Vue.component('DictTag', DictTag) Vue.component("DictTag", DictTag);
Vue.component('Pagination', Pagination) Vue.component("Pagination", Pagination);
Vue.component('RightToolbar', RightToolbar) Vue.component("RightToolbar", RightToolbar);
Vue.component('Editor', Editor) Vue.component("Editor", Editor);
Vue.component('FileUpload', FileUpload) Vue.component("FileUpload", FileUpload);
Vue.component('ImageUpload', ImageUpload) Vue.component("ImageUpload", ImageUpload);
Vue.component('ImagePreview', ImagePreview) Vue.component("ImagePreview", ImagePreview);
Vue.component("MyInput", MyInput);
Vue.use(directive) Vue.use(directive);
Vue.use(plugins) Vue.use(plugins);
Vue.use(VueMeta) Vue.use(VueMeta);
DictData.install() DictData.install();
/** /**
* If you don't want to use mock-server * If you don't want to use mock-server
@ -82,14 +92,14 @@ DictData.install()
*/ */
Vue.use(Element, { Vue.use(Element, {
size: Cookies.get('size') || 'medium' // set element-ui default size size: Cookies.get("size") || "medium", // set element-ui default size
}) });
Vue.config.productionTip = false Vue.config.productionTip = false;
new Vue({ new Vue({
el: '#app', el: "#app",
router, router,
store, store,
render: h => h(App) render: (h) => h(App),
}) });

@ -1,9 +1,9 @@
import auth from '@/plugins/auth' import auth from "@/plugins/auth";
import router, { constantRoutes, dynamicRoutes } from '@/router' import router, { constantRoutes, dynamicRoutes } from "@/router";
import { getRouters } from '@/api/menu' import { getRouters } from "@/api/menu";
import Layout from '@/layout/index' import Layout from "@/layout/index";
import ParentView from '@/components/ParentView' import ParentView from "@/components/ParentView";
import InnerLink from '@/layout/components/InnerLink' import InnerLink from "@/layout/components/InnerLink";
const permission = { const permission = {
state: { state: {
@ -11,124 +11,124 @@ const permission = {
addRoutes: [], addRoutes: [],
defaultRoutes: [], defaultRoutes: [],
topbarRouters: [], topbarRouters: [],
sidebarRouters: [] sidebarRouters: [],
}, },
mutations: { mutations: {
SET_ROUTES: (state, routes) => { SET_ROUTES: (state, routes) => {
state.addRoutes = routes state.addRoutes = routes;
state.routes = constantRoutes.concat(routes) state.routes = constantRoutes.concat(routes);
}, },
SET_DEFAULT_ROUTES: (state, routes) => { SET_DEFAULT_ROUTES: (state, routes) => {
state.defaultRoutes = constantRoutes.concat(routes) state.defaultRoutes = constantRoutes.concat(routes);
}, },
SET_TOPBAR_ROUTES: (state, routes) => { SET_TOPBAR_ROUTES: (state, routes) => {
state.topbarRouters = routes state.topbarRouters = routes;
}, },
SET_SIDEBAR_ROUTERS: (state, routes) => { SET_SIDEBAR_ROUTERS: (state, routes) => {
// console.log(routes) // console.log(routes)
state.sidebarRouters = routes state.sidebarRouters = routes;
}, },
}, },
actions: { actions: {
// 生成路由 // 生成路由
GenerateRoutes({ commit }) { GenerateRoutes({ commit }) {
return new Promise(resolve => { return new Promise((resolve) => {
// 向后端请求路由数据 // 向后端请求路由数据
getRouters().then(res => { getRouters().then((res) => {
const sdata = JSON.parse(JSON.stringify(res.data)) const sdata = JSON.parse(JSON.stringify(res.data));
const rdata = JSON.parse(JSON.stringify(res.data)) const rdata = JSON.parse(JSON.stringify(res.data));
const sidebarRoutes = filterAsyncRouter(sdata) const sidebarRoutes = filterAsyncRouter(sdata);
const rewriteRoutes = filterAsyncRouter(rdata, false, true) const rewriteRoutes = filterAsyncRouter(rdata, false, true);
const asyncRoutes = filterDynamicRoutes(dynamicRoutes); const asyncRoutes = filterDynamicRoutes(dynamicRoutes);
rewriteRoutes.push({ path: '*', redirect: '/404', hidden: true }) rewriteRoutes.push({ path: "*", redirect: "/404", hidden: true });
router.addRoutes(asyncRoutes); router.addRoutes(asyncRoutes);
commit('SET_ROUTES', rewriteRoutes) commit("SET_ROUTES", rewriteRoutes);
commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes)) commit("SET_SIDEBAR_ROUTERS", constantRoutes.concat(sidebarRoutes));
commit('SET_DEFAULT_ROUTES', sidebarRoutes) commit("SET_DEFAULT_ROUTES", sidebarRoutes);
commit('SET_TOPBAR_ROUTES', sidebarRoutes) commit("SET_TOPBAR_ROUTES", sidebarRoutes);
resolve(rewriteRoutes) resolve(rewriteRoutes);
}) });
}) });
} },
} },
} };
// 遍历后台传来的路由字符串,转换为组件对象 // 遍历后台传来的路由字符串,转换为组件对象
function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) { function filterAsyncRouter(asyncRouterMap, lastRouter = false, type = false) {
return asyncRouterMap.filter(route => { return asyncRouterMap.filter((route) => {
if (type && route.children) { if (type && route.children) {
route.children = filterChildren(route.children) route.children = filterChildren(route.children);
} }
if (route.component) { if (route.component) {
// Layout ParentView 组件特殊处理 // Layout ParentView 组件特殊处理
if (route.component === 'Layout') { if (route.component === "Layout") {
route.component = Layout route.component = Layout;
} else if (route.component === 'ParentView') { } else if (route.component === "ParentView") {
route.component = ParentView route.component = ParentView;
} else if (route.component === 'InnerLink') { } else if (route.component === "InnerLink") {
route.component = InnerLink route.component = InnerLink;
} else { } else {
route.component = loadView(route.component) route.component = loadView(route.component);
} }
} }
if (route.children != null && route.children && route.children.length) { if (route.children != null && route.children && route.children.length) {
route.children = filterAsyncRouter(route.children, route, type) route.children = filterAsyncRouter(route.children, route, type);
} else { } else {
delete route['children'] delete route["children"];
delete route['redirect'] delete route["redirect"];
} }
return true return true;
}) });
} }
function filterChildren(childrenMap, lastRouter = false) { function filterChildren(childrenMap, lastRouter = false) {
var children = [] var children = [];
childrenMap.forEach((el, index) => { childrenMap.forEach((el, index) => {
if (el.children && el.children.length) { if (el.children && el.children.length) {
if (el.component === 'ParentView' && !lastRouter) { if (el.component === "ParentView" && !lastRouter) {
el.children.forEach(c => { el.children.forEach((c) => {
c.path = el.path + '/' + c.path c.path = el.path + "/" + c.path;
if (c.children && c.children.length) { if (c.children && c.children.length) {
children = children.concat(filterChildren(c.children, c)) children = children.concat(filterChildren(c.children, c));
return return;
} }
children.push(c) children.push(c);
}) });
return return;
} }
} }
if (lastRouter) { if (lastRouter) {
el.path = lastRouter.path + '/' + el.path el.path = lastRouter.path + "/" + el.path;
} }
children = children.concat(el) children = children.concat(el);
}) });
return children return children;
} }
// 动态路由遍历,验证是否具备权限 // 动态路由遍历,验证是否具备权限
export function filterDynamicRoutes(routes) { export function filterDynamicRoutes(routes) {
const res = [] const res = [];
routes.forEach(route => { routes.forEach((route) => {
if (route.permissions) { if (route.permissions) {
if (auth.hasPermiOr(route.permissions)) { if (auth.hasPermiOr(route.permissions)) {
res.push(route) res.push(route);
} }
} else if (route.roles) { } else if (route.roles) {
if (auth.hasRoleOr(route.roles)) { if (auth.hasRoleOr(route.roles)) {
res.push(route) res.push(route);
} }
} }
}) });
return res return res;
} }
export const loadView = (view) => { export const loadView = (view) => {
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === "development") {
return (resolve) => require([`@/views/${view}`], resolve) return (resolve) => require([`@/views/${view}`], resolve);
} else { } else {
// 使用 import 实现生产环境的路由懒加载 // 使用 import 实现生产环境的路由懒加载
return () => import(`@/views/${view}`) return () => import(`@/views/${view}`);
}
} }
};
export default permission export default permission;

@ -1,96 +1,106 @@
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: '', 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_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_AVATAR", avatar);
resolve(res) resolve(res);
}).catch(error => {
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;

@ -8,7 +8,7 @@
--> -->
<template> <template>
<div class="my-inputs"> <div class="my-inputs">
<el-input v-model="input" :placeholder="placeholder" clearable @change="changeValue"></el-input> <el-input v-model="input" :placeholder="placeholder" clearable></el-input>
<div class="btn" @click="inputValue"><i class="el-icon-search"></i></div> <div class="btn" @click="inputValue"><i class="el-icon-search"></i></div>
</div> </div>
</template> </template>
@ -16,37 +16,36 @@
export default { export default {
data() { data() {
return { return {
input:'', input: "",
} };
}, },
props: { props: {
placeholder: { placeholder: {
type: String, type: String,
default:'请输入内容' default: "请输入关键字",
} },
}, },
methods: { methods: {
inputValue() { inputValue() {
this.$emit('changeInput',this.input) this.$emit("clickSearch", this.input);
}, },
changeValue(){
this.$emit('changeValue',this.input)
}
}, },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.my-inputs { .my-inputs {
display: flex; display: flex;
height: 35px;
margin-bottom: 15px;
::v-deep .el-input { ::v-deep .el-input {
width: 515px; width: 515px;
height: 40px; height: 100%;
.el-input__inner { .el-input__inner {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-right: none; border-right: none;
border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px;
border: 1px solid #DBD7D7; // border: 1px solid #dbd7d7;
} }
} }
.btn { .btn {
@ -54,9 +53,9 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 52px; width: 52px;
height: 40px; height: 100%;
border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0;
background-color: #F8414D; background-color: #f8414d;
cursor: pointer; cursor: pointer;
color: #fff; color: #fff;
} }

@ -41,7 +41,7 @@
<el-col :sm="24" :lg="12" style="padding-left: 20px"> <el-col :sm="24" :lg="12" style="padding-left: 20px">
<h2>若依后台管理框架</h2> <h2>若依后台管理框架</h2>
<p> <p>
一直想做一款后台管理系统看了很多优秀的开源项目但是发现没有合适自己的于是利用空闲休息时间开始自己写一套后台系统如此有了若依管理系统她可以用于所有的Web应用程序如网站管理后台网站会员中心CMSCRMOA等等当然您也可以对她进行深度定制以做出更强系统所有前端后台代码封装过后十分精简易上手出错概率低同时支持移动客户端访问系统会陆续更新一些实用功能 一直想做一款后台管理系统看了很多优秀的开源项目但是发现没有合适自己的于是利用空闲休息时间开始自己写一套后台系统如此有了志愿者管理系统她可以用于所有的Web应用程序如网站管理后台网站会员中心CMSCRMOA等等当然您也可以对她进行深度定制以做出更强系统所有前端后台代码封装过后十分精简易上手出错概率低同时支持移动客户端访问系统会陆续更新一些实用功能
</p> </p>
<p> <p>
<b>当前版本:</b> <span>v{{ version }}</span> <b>当前版本:</b> <span>v{{ version }}</span>
@ -118,11 +118,17 @@
> >
</p> </p>
<p> <p>
<i class="el-icon-user-solid"></i> QQ群<s> 满937441 </s> <s> 满887144332 </s> <i class="el-icon-user-solid"></i> QQ群<s> 满937441 </s>
<s> 满180251782 </s> <s> 满104180207 </s> <s> 满186866453 </s> <s> 满201396349 </s> <s> 满887144332 </s> <s> 满180251782 </s> <s> 满104180207 </s>
<s> 满101456076 </s> <s> 满101539465 </s> <s> 满264312783 </s> <s> 满167385320 </s> <s> 满186866453 </s> <s> 满201396349 </s> <s> 满101456076 </s>
<s> 满104748341 </s> <s> 满160110482 </s> <s> 满170801498 </s> <s> 满108482800 </s> <s> 满101539465 </s> <s> 满264312783 </s> <s> 满167385320 </s>
<s> 满101046199 </s> <s> 满136919097 </s> <a href="http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=0vBbSb0ztbBgVtn3kJS-Q4HUNYwip89G&authKey=8irq5PhutrZmWIvsUsklBxhj57l%2F1nOZqjzigkXZVoZE451GG4JHPOqW7AW6cf0T&noverify=0&group_code=143961921" target="_blank">143961921</a> <s> 满104748341 </s> <s> 满160110482 </s> <s> 满170801498 </s>
<s> 满108482800 </s> <s> 满101046199 </s> <s> 满136919097 </s>
<a
href="http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=0vBbSb0ztbBgVtn3kJS-Q4HUNYwip89G&authKey=8irq5PhutrZmWIvsUsklBxhj57l%2F1nOZqjzigkXZVoZE451GG4JHPOqW7AW6cf0T&noverify=0&group_code=143961921"
target="_blank"
>143961921</a
>
</p> </p>
<p> <p>
<i class="el-icon-chat-dot-round"></i> 微信<a <i class="el-icon-chat-dot-round"></i> 微信<a
@ -218,7 +224,9 @@
<li>修复table中更多按钮切换主题色未生效修复问题</li> <li>修复table中更多按钮切换主题色未生效修复问题</li>
<li>修复某些特性的环境生成代码变乱码TXT文件问题</li> <li>修复某些特性的环境生成代码变乱码TXT文件问题</li>
<li>修复代码生成图片/文件/单选时选择必填无法校验问题</li> <li>修复代码生成图片/文件/单选时选择必填无法校验问题</li>
<li>修复某些特性的情况用户编辑对话框中角色和部门无法修改问题</li> <li>
修复某些特性的情况用户编辑对话框中角色和部门无法修改问题
</li>
<li>其他细节优化</li> <li>其他细节优化</li>
</ol> </ol>
</el-collapse-item> </el-collapse-item>
@ -279,7 +287,9 @@
<li>新增获取不带后缀文件名称方法</li> <li>新增获取不带后缀文件名称方法</li>
<li>新增获取配置文件中的属性值方法</li> <li>新增获取配置文件中的属性值方法</li>
<li>新增内容编码/解码方便插件集成使用</li> <li>新增内容编码/解码方便插件集成使用</li>
<li>字典类型必须以字母开头且只能为小写字母数字下滑线</li> <li>
字典类型必须以字母开头且只能为小写字母数字下滑线
</li>
<li>优化设置分页参数默认值</li> <li>优化设置分页参数默认值</li>
<li>优化对空字符串参数处理的过滤</li> <li>优化对空字符串参数处理的过滤</li>
<li>优化显示顺序orderNum类型为整型</li> <li>优化显示顺序orderNum类型为整型</li>
@ -483,8 +493,12 @@
<li>BLOB下载时清除URL对象引用</li> <li>BLOB下载时清除URL对象引用</li>
<li>代码生成导入表按创建时间排序</li> <li>代码生成导入表按创建时间排序</li>
<li>修复代码生成页面数据编辑保存之后总是跳转第一页的问题</li> <li>修复代码生成页面数据编辑保存之后总是跳转第一页的问题</li>
<li>修复带safari浏览器无法格式化utc日期格式yyyy-MM-dd'T'HH:mm:ss.SSS问题</li> <li>
<li>多图上传组件移除多余的api地址&验证失败导致图片删除问题&无法删除相应图片修复</li> 修复带safari浏览器无法格式化utc日期格式yyyy-MM-dd'T'HH:mm:ss.SSS问题
</li>
<li>
多图上传组件移除多余的api地址&验证失败导致图片删除问题&无法删除相应图片修复
</li>
<li>其他细节优化</li> <li>其他细节优化</li>
</ol> </ol>
</el-collapse-item> </el-collapse-item>
@ -529,7 +543,9 @@
</el-collapse-item> </el-collapse-item>
<el-collapse-item title="v3.5.0 - 2021-05-25"> <el-collapse-item title="v3.5.0 - 2021-05-25">
<ol> <ol>
<li>新增菜单导航显示风格TopNavfalse为左侧导航菜单true为顶部导航菜单</li> <li>
新增菜单导航显示风格TopNavfalse为左侧导航菜单true为顶部导航菜单
</li>
<li>布局设置支持保存&重置配置</li> <li>布局设置支持保存&重置配置</li>
<li>修复树表数据显示不全&加载慢问题</li> <li>修复树表数据显示不全&加载慢问题</li>
<li>新增IE浏览器版本过低提示页面</li> <li>新增IE浏览器版本过低提示页面</li>
@ -548,7 +564,9 @@
<li>升级druid到最新版本v1.2.6</li> <li>升级druid到最新版本v1.2.6</li>
<li>升级mybatis到最新版3.5.6 阻止远程代码执行漏洞</li> <li>升级mybatis到最新版3.5.6 阻止远程代码执行漏洞</li>
<li>升级oshi到最新版本v5.6.0</li> <li>升级oshi到最新版本v5.6.0</li>
<li>velocity剔除commons-collections版本防止3.2.1版本的反序列化漏洞</li> <li>
velocity剔除commons-collections版本防止3.2.1版本的反序列化漏洞
</li>
<li>数据监控页默认账户密码防止越权访问</li> <li>数据监控页默认账户密码防止越权访问</li>
<li>修复firefox下表单构建拖拽会新打卡一个选项卡</li> <li>修复firefox下表单构建拖拽会新打卡一个选项卡</li>
<li>修正后端导入表权限标识</li> <li>修正后端导入表权限标识</li>
@ -925,11 +943,7 @@
<span>捐赠支持</span> <span>捐赠支持</span>
</div> </div>
<div class="body"> <div class="body">
<img <img src="@/assets/images/pay.png" alt="donate" width="100%" />
src="@/assets/images/pay.png"
alt="donate"
width="100%"
/>
<span style="display: inline-block; height: 30px; line-height: 30px" <span style="display: inline-block; height: 30px; line-height: 30px"
>你可以请作者喝杯咖啡表示鼓励</span >你可以请作者喝杯咖啡表示鼓励</span
> >
@ -946,14 +960,14 @@ export default {
data() { data() {
return { return {
// //
version: "3.8.6" version: "3.8.6",
}; };
}, },
methods: { methods: {
goTarget(href) { goTarget(href) {
window.open(href, "_blank"); window.open(href, "_blank");
} },
} },
}; };
</script> </script>
@ -1020,4 +1034,3 @@ export default {
} }
} }
</style> </style>

@ -1,7 +1,12 @@
<template> <template>
<div class="login"> <div class="login">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form"> <el-form
<h3 class="title">若依后台管理系统</h3> ref="loginForm"
:model="loginForm"
:rules="loginRules"
class="login-form"
>
<h3 class="title">志愿者管理系统</h3>
<el-form-item prop="username"> <el-form-item prop="username">
<el-input <el-input
v-model="loginForm.username" v-model="loginForm.username"
@ -9,7 +14,11 @@
auto-complete="off" auto-complete="off"
placeholder="账号" placeholder="账号"
> >
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" /> <svg-icon
slot="prefix"
icon-class="user"
class="el-input__icon input-icon"
/>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item prop="password"> <el-form-item prop="password">
@ -20,7 +29,11 @@
placeholder="密码" placeholder="密码"
@keyup.enter.native="handleLogin" @keyup.enter.native="handleLogin"
> >
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> <svg-icon
slot="prefix"
icon-class="password"
class="el-input__icon input-icon"
/>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item prop="code" v-if="captchaEnabled"> <el-form-item prop="code" v-if="captchaEnabled">
@ -31,32 +44,42 @@
style="width: 63%" style="width: 63%"
@keyup.enter.native="handleLogin" @keyup.enter.native="handleLogin"
> >
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" /> <svg-icon
slot="prefix"
icon-class="validCode"
class="el-input__icon input-icon"
/>
</el-input> </el-input>
<div class="login-code"> <div class="login-code">
<img :src="codeUrl" @click="getCode" class="login-code-img" /> <img :src="codeUrl" @click="getCode" class="login-code-img" />
</div> </div>
</el-form-item> </el-form-item>
<el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;"></el-checkbox> <el-checkbox
<el-form-item style="width:100%;"> v-model="loginForm.rememberMe"
style="margin: 0px 0px 25px 0px"
>记住密码</el-checkbox
>
<el-form-item style="width: 100%">
<el-button <el-button
:loading="loading" :loading="loading"
size="medium" size="medium"
type="primary" type="primary"
style="width:100%;" style="width: 100%"
@click.native.prevent="handleLogin" @click.native.prevent="handleLogin"
> >
<span v-if="!loading"> </span> <span v-if="!loading"> </span>
<span v-else> ...</span> <span v-else> ...</span>
</el-button> </el-button>
<div style="float: right;" v-if="register"> <div style="float: right" v-if="register">
<router-link class="link-type" :to="'/register'">立即注册</router-link> <router-link class="link-type" :to="'/register'"
>立即注册</router-link
>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
<!-- 底部 --> <!-- 底部 -->
<div class="el-login-footer"> <div class="el-login-footer">
<span>Copyright © 2018-2023 ruoyi.vip All Rights Reserved.</span> <!-- <span>Copyright © 2018-2023 ruoyi.vip All Rights Reserved.</span> -->
</div> </div>
</div> </div>
</template> </template>
@ -64,7 +87,7 @@
<script> <script>
import { getCodeImg } from "@/api/login"; import { getCodeImg } from "@/api/login";
import Cookies from "js-cookie"; import Cookies from "js-cookie";
import { encrypt, decrypt } from '@/utils/jsencrypt' import { encrypt, decrypt } from "@/utils/jsencrypt";
export default { export default {
name: "Login", name: "Login",
@ -76,23 +99,23 @@ export default {
password: "admin123", password: "admin123",
rememberMe: false, rememberMe: false,
code: "", code: "",
uuid: "" uuid: "",
}, },
loginRules: { loginRules: {
username: [ username: [
{ required: true, trigger: "blur", message: "请输入您的账号" } { required: true, trigger: "blur", message: "请输入您的账号" },
], ],
password: [ password: [
{ required: true, trigger: "blur", message: "请输入您的密码" } { required: true, trigger: "blur", message: "请输入您的密码" },
], ],
code: [{ required: true, trigger: "change", message: "请输入验证码" }] code: [{ required: true, trigger: "change", message: "请输入验证码" }],
}, },
loading: false, loading: false,
// //
captchaEnabled: true, captchaEnabled: true,
// //
register: false, register: false,
redirect: undefined redirect: undefined,
}; };
}, },
watch: { watch: {
@ -100,8 +123,8 @@ export default {
handler: function (route) { handler: function (route) {
this.redirect = route.query && route.query.redirect; this.redirect = route.query && route.query.redirect;
}, },
immediate: true immediate: true,
} },
}, },
created() { created() {
this.getCode(); this.getCode();
@ -109,8 +132,9 @@ export default {
}, },
methods: { methods: {
getCode() { getCode() {
getCodeImg().then(res => { getCodeImg().then((res) => {
this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled; this.captchaEnabled =
res.captchaEnabled === undefined ? true : res.captchaEnabled;
if (this.captchaEnabled) { if (this.captchaEnabled) {
this.codeUrl = "data:image/gif;base64," + res.img; this.codeUrl = "data:image/gif;base64," + res.img;
this.loginForm.uuid = res.uuid; this.loginForm.uuid = res.uuid;
@ -120,29 +144,37 @@ export default {
getCookie() { getCookie() {
const username = Cookies.get("username"); const username = Cookies.get("username");
const password = Cookies.get("password"); const password = Cookies.get("password");
const rememberMe = Cookies.get('rememberMe') const rememberMe = Cookies.get("rememberMe");
this.loginForm = { this.loginForm = {
username: username === undefined ? this.loginForm.username : username, username: username === undefined ? this.loginForm.username : username,
password: password === undefined ? this.loginForm.password : decrypt(password), password:
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe) password === undefined ? this.loginForm.password : decrypt(password),
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
}; };
}, },
handleLogin() { handleLogin() {
this.$refs.loginForm.validate(valid => { this.$refs.loginForm.validate((valid) => {
if (valid) { if (valid) {
this.loading = true; this.loading = true;
if (this.loginForm.rememberMe) { if (this.loginForm.rememberMe) {
Cookies.set("username", this.loginForm.username, { expires: 30 }); Cookies.set("username", this.loginForm.username, { expires: 30 });
Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 }); Cookies.set("password", encrypt(this.loginForm.password), {
Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 }); expires: 30,
});
Cookies.set("rememberMe", this.loginForm.rememberMe, {
expires: 30,
});
} else { } else {
Cookies.remove("username"); Cookies.remove("username");
Cookies.remove("password"); Cookies.remove("password");
Cookies.remove('rememberMe'); Cookies.remove("rememberMe");
} }
this.$store.dispatch("Login", this.loginForm).then(() => { this.$store
.dispatch("Login", this.loginForm)
.then(() => {
this.$router.push({ path: this.redirect || "/" }).catch(() => {}); this.$router.push({ path: this.redirect || "/" }).catch(() => {});
}).catch(() => { })
.catch(() => {
this.loading = false; this.loading = false;
if (this.captchaEnabled) { if (this.captchaEnabled) {
this.getCode(); this.getCode();
@ -150,8 +182,8 @@ export default {
}); });
} }
}); });
} },
} },
}; };
</script> </script>

@ -0,0 +1,9 @@
<template>
<div class="app-container">地址管理</div>
</template>
<script>
export default {};
</script>
<style></style>

@ -9,7 +9,11 @@
<template> <template>
<div class="plan-management"> <div class="plan-management">
<div class="plan-topBox"> <div class="plan-topBox">
<my-input @changeInput="changeInput" placeholder="请输入活动内容" @changeValue="changeValue"></my-input> <my-input
@changeInput="changeInput"
placeholder="请输入活动内容"
@changeValue="changeValue"
></my-input>
</div> </div>
<div class="plan-bottomBox"> <div class="plan-bottomBox">
<div class="tables"> <div class="tables">
@ -26,17 +30,14 @@
label="序号" label="序号"
type="index" type="index"
header-align="center" header-align="center"
width="70"> width="70"
</el-table-column>
<el-table-column
prop="content"
label="参与活动"
width="280"
> >
</el-table-column>
<el-table-column prop="content" label="参与活动" width="280">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="activity"> <div class="activity">
<div>{{ scope.row.content.split(' ')[0] }}</div> <div>{{ scope.row.content.split(" ")[0] }}</div>
<div>{{ scope.row.content.split(' ')[1] }}</div> <div>{{ scope.row.content.split(" ")[1] }}</div>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@ -47,24 +48,13 @@
width="180" width="180"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="duration" label="状态"> </el-table-column>
prop="duration" <el-table-column prop="time" label="兑换时间"> </el-table-column>
label="状态" <el-table-column label="操作" width="250">
>
</el-table-column>
<el-table-column
prop="time"
label="兑换时间"
>
</el-table-column>
<el-table-column
label="操作"
width="250"
>
<template slot-scope="scope"> <template slot-scope="scope">
<div class="tabs-btns"> <div class="tabs-btns">
<div class="look" @click="look(scope.row)"> <div class="look" @click="look(scope.row)">
<img src="@/assets/images/look.png" alt=""> <img src="@/assets/images/look.png" alt="" />
<span>查看</span> <span>查看</span>
</div> </div>
</div> </div>
@ -73,14 +63,17 @@
</el-table> </el-table>
</div> </div>
<div class="pagination"> <div class="pagination">
<my-pagination :total="total" @pagesChange="pagesChange"></my-pagination> <my-pagination
:total="total"
@pagesChange="pagesChange"
></my-pagination>
</div> </div>
</div> </div>
<my-dialog ref="conversion"> <my-dialog ref="conversion">
<div class="conversionInfo"> <div class="conversionInfo">
<div class="basicInfo"> <div class="basicInfo">
<div class="title"> <div class="title">
<img src="@/assets/images/huodong.png" alt=""> <img src="@/assets/images/huodong.png" alt="" />
<span>活动详情</span> <span>活动详情</span>
</div> </div>
<div class="info"> <div class="info">
@ -114,17 +107,17 @@
</div> </div>
<div class="logisticsInfo"> <div class="logisticsInfo">
<div class="title"> <div class="title">
<img src="@/assets/images/huodong.png" alt=""> <img src="@/assets/images/huodong.png" alt="" />
<span>物流信息</span> <span>物流信息</span>
</div> </div>
<div class="info"> <div class="info">
<div class="lists"> <div class="lists">
<div class="list-left"> <div class="list-left">
<div>寄件人</div> <div>快递公司</div>
<div>XXXXXXXXX</div> <div>XXXXXXXXX</div>
</div> </div>
<div class="list-right"> <div class="list-right">
<div>寄件地址</div> <div>快递单号</div>
<div>XXXXXXXXXXX</div> <div>XXXXXXXXXXX</div>
</div> </div>
</div> </div>
@ -138,83 +131,92 @@
</div> </div>
</template> </template>
<script> <script>
import myPagination from "@/views/components/myPagination/index.vue" import myPagination from "@/views/components/myPagination/index.vue";
import myInput from "@/views/components/myInput/index.vue" import myInput from "@/views/components/myInput/index.vue";
import myDialog from "@/views/components/dialog/index.vue" import myDialog from "@/views/components/dialog/index.vue";
export default { export default {
components: { myPagination, myInput, myDialog }, components: { myPagination, myInput, myDialog },
data() { data() {
return { return {
tableData: [ tableData: [
{ {
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
person:'吴加好', person: "吴加好",
duration:'10', duration: "10",
time:'2023-08-14' time: "2023-08-14",
},{ },
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', {
person:'吴加好', content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
duration:'10', person: "吴加好",
time:'2023-08-14' duration: "10",
},{ time: "2023-08-14",
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', },
person:'吴加好', {
duration:'10', content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
time:'2023-08-14' person: "吴加好",
},{ duration: "10",
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', time: "2023-08-14",
person:'吴加好', },
duration:'10', {
time:'2023-08-14' content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
},{ person: "吴加好",
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', duration: "10",
person:'吴加好', time: "2023-08-14",
duration:'10', },
time:'2023-08-14' {
},{ content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', person: "吴加好",
person:'吴加好', duration: "10",
duration:'10', time: "2023-08-14",
time:'2023-08-14' },
},{ {
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
person:'吴加好', person: "吴加好",
duration:'10', duration: "10",
time:'2023-08-14' time: "2023-08-14",
},{ },
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', {
person:'吴加好', content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
duration:'10', person: "吴加好",
time:'2023-08-14' duration: "10",
},{ time: "2023-08-14",
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', },
person:'吴加好', {
duration:'10', content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
time:'2023-08-14' person: "吴加好",
},{ duration: "10",
content:'志愿活动协助指挥交通 我参加的志愿者活动,指挥交通', time: "2023-08-14",
person:'吴加好', },
duration:'10', {
time:'2023-08-14' content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
person: "吴加好",
duration: "10",
time: "2023-08-14",
},
{
content: "志愿活动协助指挥交通 我参加的志愿者活动,指挥交通",
person: "吴加好",
duration: "10",
time: "2023-08-14",
}, },
], ],
input: { input: {
name:'' name: "",
}, },
pages: { pages: {
pageSize: 10, pageSize: 10,
pageNum:1 pageNum: 1,
}, },
total: 0, total: 0,
loading: false, loading: false,
isClick: false, isClick: false,
} };
}, },
methods: { methods: {
// //
pagesChange(pages) { pagesChange(pages) {
// console.log(pages) // console.log(pages)
this.getList(pages) this.getList(pages);
}, },
// //
changeInput(value) { changeInput(value) {
@ -228,8 +230,8 @@ export default {
}, },
// //
changeValue(value) { changeValue(value) {
if(this.isClick && value == ''){ if (this.isClick && value == "") {
this.input.name = ''; this.input.name = "";
this.pages = { this.pages = {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
@ -250,25 +252,21 @@ export default {
if (columnIndex === 0) { if (columnIndex === 0) {
return `text-align:center`; return `text-align:center`;
} else { } else {
return ''; return "";
} }
}, },
getList(){ getList() {},
},
// //
look(item) { look(item) {
this.$refs.conversion.open() this.$refs.conversion.open();
}, },
// //
close() { close() {
this.$refs.conversion.Close() this.$refs.conversion.Close();
}
}, },
async created() {
}, },
} async created() {},
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.plan-management { .plan-management {
@ -294,14 +292,14 @@ export default {
line-height: 20px; line-height: 20px;
&:nth-child(1) { &:nth-child(1) {
font-size: 14px; font-size: 14px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: 400; font-weight: 400;
color: #4D4949; color: #4d4949;
} }
&:nth-child(2) { &:nth-child(2) {
width: 180px; width: 180px;
font-size: 14px; font-size: 14px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: 400; font-weight: 400;
color: #999191; color: #999191;
white-space: nowrap; white-space: nowrap;
@ -315,18 +313,18 @@ export default {
box-sizing: border-box; box-sizing: border-box;
// text-align: center; // text-align: center;
font-size: 14px; font-size: 14px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: 400; font-weight: 400;
color: #525966; color: #525966;
padding: 2px 0; padding: 2px 0;
} }
th { th {
height: 45px; height: 45px;
background-color: #F7F5F5; background-color: #f7f5f5;
font-size: 15px; font-size: 15px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: bold; font-weight: bold;
color: #4D4949; color: #4d4949;
.el-checkbox { .el-checkbox {
display: none; display: none;
} }
@ -352,7 +350,7 @@ export default {
font-size: 15px; font-size: 15px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
font-weight: 400; font-weight: 400;
color: #045FFD; color: #045ffd;
} }
} }
} }
@ -363,7 +361,8 @@ export default {
} }
} }
::v-deep .conversionInfo { ::v-deep .conversionInfo {
.basicInfo,.logisticsInfo { .basicInfo,
.logisticsInfo {
.title { .title {
display: flex; display: flex;
align-items: center; align-items: center;
@ -373,9 +372,9 @@ export default {
} }
span { span {
font-size: 16px; font-size: 16px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: bold; font-weight: bold;
color: #4C4949; color: #4c4949;
} }
} }
.info { .info {
@ -387,22 +386,23 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
.list-left,.list-right { .list-left,
.list-right {
flex: 1; flex: 1;
display: flex; display: flex;
align-items: center; align-items: center;
div { div {
&:nth-child(1) { &:nth-child(1) {
font-size: 14px; font-size: 14px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: 400; font-weight: 400;
color: #4C4949; color: #4c4949;
} }
&:nth-child(2) { &:nth-child(2) {
font-size: 14px; font-size: 14px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: 400; font-weight: 400;
color: #807A7A; color: #807a7a;
} }
} }
} }
@ -419,15 +419,15 @@ export default {
div { div {
width: 80px; width: 80px;
height: 36px; height: 36px;
border: 1px solid #F8414D; border: 1px solid #f8414d;
border-radius: 4px; border-radius: 4px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 14px; font-size: 14px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: 400; font-weight: 400;
color: #F8414D; color: #f8414d;
cursor: pointer; cursor: pointer;
} }
} }

@ -0,0 +1,136 @@
<template>
<div class="app-container" ref="main">
<div class="search" ref="search">
<MyInput v-model="queryParams.name" @clickSearch="handleSearch" />
</div>
<ul class="book-main" :style="listStyle">
<li
v-for="(item, index) in certificatesList"
:key="item.id"
:style="{ marginBottom: isLastRow(index) ? '0px' : '' }"
>
<div class="integral-num">积分50</div>
<el-image
style="width: 100%; height: 87%"
:src="baseUrl + item.cover"
fit="fill"
:preview-src-list="[`${baseUrl + item.cover}`]"
>
</el-image>
<div class="operate">
<div class="integral">
{{ item.name }}
</div>
<div class="operate-child">
<div class="exchange-btn" @click="conversion(item)"> </div>
</div>
</div>
</li>
</ul>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script>
import { listCertificates } from "@/api/volunteer/gxhzs/gxhzsgl/index.js";
export default {
data() {
return {
listStyle: {
height: 0,
overflowY: "auto",
},
baseUrl: process.env.VUE_APP_BASE_API,
certificatesList: [],
loading: false,
tableData: [],
total: 0,
queryParams: {
name: undefined,
pageNum: 1,
pageSize: 10,
},
form: {},
rules: {},
};
},
created() {
// //
this.$nextTick(() => {
this.listStyle.height =
this.$refs.main.offsetHeight -
40 -
this.$refs.search.offsetHeight -
42 +
"px";
this.getList();
});
},
methods: {
isLastRow(index) {
const rowCount = Math.ceil(this.certificatesList.length / 5);
const row = Math.floor(index / 5);
return row === rowCount - 1;
},
/**兑换 */
conversion(item) {
console.log(item);
},
/**搜索 */
handleSearch(keyWord) {
this.queryParams = {
name: keyWord,
pageNum: 1,
pageSize: 10,
};
this.getList();
},
/** 查询证书管理列表 */
getList() {
this.loading = true;
listCertificates(this.queryParams).then((response) => {
this.certificatesList = response.rows;
this.total = response.total;
this.loading = false;
});
},
//
reset() {
this.form = {
id: null,
name: null,
type: null,
cover: null,
content: null,
datetime: null,
serviceDuration: null,
createId: null,
createBy: null,
createTime: null,
updateId: null,
updateBy: null,
updateTime: null,
remark: null,
userId: null,
deptId: null,
};
this.resetForm("form");
},
//
cancel() {
this.open = false;
this.reset();
},
},
};
</script>
<style lang="scss" scoped>
@import "@/assets/styles/myTable.scss";
</style>

@ -34,35 +34,20 @@
prop="id" prop="id"
width="55" width="55"
/> />
<el-table-column label="参与活动" align="center" prop="activityId" /> <el-table-column label="证书" align="center" prop="certificateId" />
<el-table-column label="证书id" align="center" prop="certificateId" /> <el-table-column label="志愿者" align="center" prop="uid" />
<el-table-column label="用户" align="center" prop="uid" />
<el-table-column label="状态" align="center" prop="type"> <el-table-column label="状态" align="center" prop="type">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.type == 1 ? "已发放" : "未发放" }} {{ scope.row.type == 1 ? "已发放" : "未发放" }}
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column
label="发证时间"
align="center"
prop="datetime"
width="180"
>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.datetime, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column> -->
<el-table-column <el-table-column
label="操作" label="操作"
align="center" align="center"
class-name="small-padding fixed-width" class-name="small-padding fixed-width"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button size="mini" type="text" @click="handleFabu(scope.row)"
size="mini"
type="text"
@click="handleFabu(scope.row)"
v-hasPermi="['system:certificates:edit']"
>发布</el-button >发布</el-button
> >
</template> </template>
@ -85,15 +70,11 @@
<div class="info-box"> <div class="info-box">
<div> <div>
<div class="info-item"> <div class="info-item">
<div class="item-lable">参与活动:</div> <div class="item-lable">证书:</div>
<div class="item-value">{{ form.activityId }}</div>
</div>
<div class="info-item">
<div class="item-lable">证书id:</div>
<div class="item-value">{{ form.certificateId }}</div> <div class="item-value">{{ form.certificateId }}</div>
</div> </div>
<div class="info-item"> <div class="info-item">
<div class="item-lable">用户:</div> <div class="item-lable">志愿者:</div>
<div class="item-value">{{ form.uid }}</div> <div class="item-value">{{ form.uid }}</div>
</div> </div>
<div class="info-item"> <div class="info-item">
@ -102,6 +83,18 @@
{{ form.type == 1 ? "已发放" : "未发放" }} {{ form.type == 1 ? "已发放" : "未发放" }}
</div> </div>
</div> </div>
<div class="info-item">
<div class="item-lable">姓名:</div>
<div class="item-value"></div>
</div>
<div class="info-item">
<div class="item-lable">手机号:</div>
<div class="item-value"></div>
</div>
<div class="info-item">
<div class="item-lable">详细地址:</div>
<div class="item-value"></div>
</div>
</div> </div>
</div> </div>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
@ -118,7 +111,18 @@
<span class="title-line"></span> <span class="title-line"></span>
邮政信息 邮政信息
</div> </div>
<Editor v-model="form.content" :min-height="192" /> <!-- <Editor v-model="form.content" :min-height="192" /> -->
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="快递公司" prop="name">
<el-input v-model="form.name" placeholder="请输入快递公司" />
</el-form-item>
<el-form-item label="快递单号" prop="serviceDuration">
<el-input
v-model="form.serviceDuration"
placeholder="请输入快递公司"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button> <el-button type="primary" @click="submitForm"> </el-button>
</div> </div>
@ -138,6 +142,7 @@ export default {
return { return {
infoOpen: false, infoOpen: false,
form: {}, form: {},
rules: {},
open: false, open: false,
title: "", title: "",
tableHeigth: 0, tableHeigth: 0,

@ -1,49 +1,29 @@
<template> <template>
<div class="app-container" ref="main"> <div class="app-container" ref="main">
<div ref="search" class="search"> <div ref="search" class="search">
<el-form <MyInput v-model="queryParams.name" @clickSearch="handleSearch" />
:model="queryParams" <el-button type="primary" size="small" @click="handleAdd"></el-button>
ref="queryForm"
size="small"
:inline="true"
class="search-container"
>
<el-form-item prop="name">
<el-input
v-model="queryParams.input"
placeholder="请输入关键字"
clearable
>
<div class="search-btn" slot="append">
<i class="el-icon-search"></i>
</div>
</el-input>
</el-form-item>
</el-form>
<el-button
v-hasPermi="['system:certificates:add']"
type="primary"
size="small"
@click="handleAdd"
>新增</el-button
>
</div> </div>
<div class="book-main" :style="{ height: tableHeigth + 'px' }"> <ul class="book-main" :style="listStyle">
<div class="child-box" v-for="item in certificatesList" :key="item.id"> <li
<div> v-for="(item, index) in certificatesList"
:key="item.id"
:style="{ marginBottom: isLastRow(index) ? '0px' : '' }"
>
<div class="integral-num">积分50</div>
<el-image <el-image
style="width: 100%; height: 87%" style="width: 100%; height: 87%"
:src="baseUrl + item.cover" :src="baseUrl + item.cover"
fit="cover" fit="fill"
></el-image> :preview-src-list="[`${baseUrl + item.cover}`]"
<div
class="operate"
style="font-size: 14px; color: #4d4949; font-weight: bold"
> >
<div>高级</div> </el-image>
<div class="right-operate"> <div class="operate">
<div class="operate-item"> <div class="integral">
{{ item.name }}
</div>
<div class="operate-child">
<el-button <el-button
type="text" type="text"
size="mini" size="mini"
@ -51,32 +31,24 @@
@click="handleInfo(item)" @click="handleInfo(item)"
>查看</el-button >查看</el-button
> >
</div>
<div class="operate-item">
<el-button <el-button
type="text" type="text"
size="mini" size="mini"
style="color: #e6a23c; margin: 0 10px" style="color: #e6a23c; margin: 0 10px"
@click="handleUpdate(item)" @click="handleUpdate(item)"
v-hasPermi="['system:certificates:edit']"
>修改</el-button >修改</el-button
> >
</div>
<div class="operate-item">
<el-button <el-button
v-hasPermi="['system:certificates:remove']"
type="text" type="text"
size="mini" size="mini"
style="color: #f56c6c" style="color: #f56c6c; margin: 0"
@click="handleDelete(item)" @click="handleDelete(item)"
>删除</el-button >删除</el-button
> >
</div> </div>
</div> </div>
</div> </li>
</div> </ul>
</div>
</div>
<pagination <pagination
v-show="total > 0" v-show="total > 0"
:total="total" :total="total"
@ -94,29 +66,8 @@
<el-form-item label="证书名称" prop="name"> <el-form-item label="证书名称" prop="name">
<el-input v-model="form.name" placeholder="请输入证书名称" /> <el-input v-model="form.name" placeholder="请输入证书名称" />
</el-form-item> </el-form-item>
<el-form-item label="证书时间" prop="datetime"> <el-form-item label="积分" prop="serviceDuration">
<el-date-picker <el-input v-model="form.serviceDuration" placeholder="请输入积分" />
clearable
v-model="form.datetime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择证书时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="服务时长" prop="serviceDuration">
<el-input
v-model="form.serviceDuration"
placeholder="请输入服务时长"
/>
</el-form-item>
<el-form-item label="证书内容">
<el-input
type="textarea"
:rows="3"
v-model="form.content"
placeholder="请输入证书内容"
/>
</el-form-item> </el-form-item>
<el-form-item label="证书封面" prop="cover"> <el-form-item label="证书封面" prop="cover">
<ImageUpload :limit="1" v-model="form.cover" /> <ImageUpload :limit="1" v-model="form.cover" />
@ -140,17 +91,9 @@
<div class="item-value">{{ form.name }}</div> <div class="item-value">{{ form.name }}</div>
</div> </div>
<div class="info-item"> <div class="info-item">
<div class="item-lable">证书时间:</div> <div class="item-lable">积分:</div>
<div class="item-value">{{ form.datetime }}</div>
</div>
<div class="info-item">
<div class="item-lable">服务时长:</div>
<div class="item-value">{{ form.serviceDuration }}</div> <div class="item-value">{{ form.serviceDuration }}</div>
</div> </div>
<div class="info-item">
<div class="item-lable">证书内容:</div>
<div class="item-value">{{ form.content }}</div>
</div>
<div class="info-item"> <div class="info-item">
<div class="item-lable">证书封面:</div> <div class="item-lable">证书封面:</div>
<div class="item-value"> <div class="item-value">
@ -174,34 +117,54 @@ import {
export default { export default {
data() { data() {
return { return {
listStyle: {
height: 0,
overflowY: "auto",
},
baseUrl: process.env.VUE_APP_BASE_API, baseUrl: process.env.VUE_APP_BASE_API,
certificatesList: [], certificatesList: [],
tableHeigth: 0,
queryParams: {},
loading: false, loading: false,
tableData: [], tableData: [],
total: 0, total: 0,
queryParams: { queryParams: {
name: undefined,
pageNum: 1, pageNum: 1,
pageSize: 20, pageSize: 10,
}, },
form: {}, form: {},
rules: {}, rules: {},
open: false, open: false,
openInfo: false, openInfo: false,
title: "", title: "",
fileList: [],
}; };
}, },
created() { created() {
// // // //
this.$nextTick(() => { this.$nextTick(() => {
this.tableHeigth = this.listStyle.height =
this.$refs.main.offsetHeight - this.$refs.search.offsetHeight - 80; this.$refs.main.offsetHeight -
40 -
this.$refs.search.offsetHeight -
42 +
"px";
this.getList(); this.getList();
}); });
}, },
methods: { methods: {
isLastRow(index) {
const rowCount = Math.ceil(this.certificatesList.length / 5);
const row = Math.floor(index / 5);
return row === rowCount - 1;
},
/**搜索 */
handleSearch(keyWord) {
this.queryParams = {
name: keyWord,
pageNum: 1,
pageSize: 10,
};
this.getList();
},
/** 查询证书管理列表 */ /** 查询证书管理列表 */
getList() { getList() {
this.loading = true; this.loading = true;
@ -302,48 +265,4 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "@/assets/styles/myTable.scss"; @import "@/assets/styles/myTable.scss";
// @import "@/assets/styles/element-variables.scss";
.search {
display: flex;
align-items: center;
justify-content: space-between;
}
.book-main {
display: flex;
flex-wrap: wrap;
.child-box {
height: 50%;
width: 20%;
box-sizing: border-box;
padding: 10px;
& > div {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
box-shadow: 0px 3px 15px 0px rgba(184, 184, 184, 0.22);
border-radius: 10px;
overflow: hidden;
.operate {
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 10px;
.right-operate {
display: flex;
align-items: center;
justify-content: center;
}
.operate-item {
text-align: center;
font-size: 14px;
color: #8a8585;
cursor: pointer;
}
}
}
}
}
</style> </style>

@ -0,0 +1,233 @@
<template>
<div class="app-container" ref="main">
<div ref="search">
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
class="search-container"
>
<el-form-item prop="name">
<el-input
v-model="queryParams.input"
placeholder="请输入关键字"
clearable
>
<div class="search-btn" slot="append">
<i class="el-icon-search"></i>
</div>
</el-input>
</el-form-item>
</el-form>
</div>
<el-table
v-loading="loading"
:data="tableData"
:height="tableHeigth + 'px'"
>
<el-table-column
label="序号"
align="center"
type="index"
prop="id"
width="55"
/>
<el-table-column label="证书名称" align="center" prop="certificateId" />
<el-table-column label="兑换人员" align="center" prop="type" />
<el-table-column label="状态" align="center" prop="duration" />
<el-table-column label="兑换时间" align="center" prop="time" />
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
icon="el-icon-view"
type="text"
@click="handleInfo(scope.row)"
>查看</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 :visible.sync="open" width="900px" append-to-body>
<div slot="title" class="dialog-title">
<span class="title-line"></span>
{{ title }}
</div>
<div class="conversionInfo">
<div class="basicInfo">
<div class="title">
<img src="@/assets/images/huodong.png" alt="" />
<span>证书详情</span>
</div>
<div class="info">
<div class="lists">
<div class="list-left">
<div>证书名称</div>
<div>xxx证书</div>
</div>
<div class="list-right">
<div>兑换人员</div>
<div>xxxx</div>
</div>
</div>
<div class="lists">
<div class="list-left">
<div>兑换时间</div>
<div>xxxx</div>
</div>
<div class="list-left">
<div>兑换积分</div>
<div>xx</div>
</div>
</div>
<div class="lists">
<div class="list-left">
<div>证书状态</div>
<div>已发放</div>
</div>
</div>
</div>
</div>
<div class="logisticsInfo">
<div class="title">
<img src="@/assets/images/huodong.png" alt="" />
<span>物流信息</span>
</div>
<div class="info">
<div class="lists">
<div class="list-left">
<div>快递公司</div>
<div>XXXXXXXXX</div>
</div>
<div class="list-right">
<div>快递单号</div>
<div>XXXXXXXXXXX</div>
</div>
</div>
</div>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
getSellectall,
postElectron,
getInfo,
editData,
} from "@/api/volunteer/gxhzs/hdzsff/index.js";
export default {
data() {
return {
infoOpen: false,
form: {},
open: false,
title: "",
tableHeigth: 0,
queryParams: {},
loading: false,
tableData: [{}],
total: 1,
queryParams: {
creType: 2,
pageNum: 1,
pageSize: 20,
},
};
},
created() {
// //
this.$nextTick(() => {
this.tableHeigth =
this.$refs.main.offsetHeight - this.$refs.search.offsetHeight - 80;
this.getList();
});
},
methods: {
handleInfo() {
this.title = "查看";
this.open = true;
},
cancel() {
this.open = false;
},
},
};
</script>
<style lang="scss" scoped>
@import "@/assets/styles/myTable.scss";
::v-deep .conversionInfo {
.basicInfo,
.logisticsInfo {
.title {
display: flex;
align-items: center;
img {
width: 14px;
margin-right: 10px;
}
span {
font-size: 16px;
font-family: "Alibaba PuHuiTi";
font-weight: bold;
color: #4c4949;
}
}
.info {
margin-top: 20px;
display: grid;
grid-column: 1fr;
grid-row-gap: 20px;
.lists {
display: flex;
align-items: center;
justify-content: space-between;
.list-left,
.list-right {
flex: 1;
display: flex;
align-items: center;
div {
&:nth-child(1) {
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #4c4949;
}
&:nth-child(2) {
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #807a7a;
}
}
}
}
}
}
.logisticsInfo {
margin-top: 30px;
}
}
</style>

@ -0,0 +1,9 @@
<template>
<div class="app-container">活动管理</div>
</template>
<script>
export default {};
</script>
<style></style>

@ -0,0 +1,9 @@
<template>
<div class="app-container">活动推荐</div>
</template>
<script>
export default {};
</script>
<style></style>

@ -0,0 +1,9 @@
<template>
<div class="app-container">活动邀请</div>
</template>
<script>
export default {};
</script>
<style></style>

@ -1,172 +1,136 @@
<!--
* @Descripttion:
* @version:
* @Author: JC9527
* @Date: 2023-09-18 10:08:30
* @LastEditors: JC9527
* @LastEditTime: 2023-09-24 10:33:30
-->
<template> <template>
<div class="mainBox"> <div class="app-container" ref="main">
<div class="convert-topBox"> <div class="search" ref="search">
<my-input @changeInput="changeInput" placeholder="请输入证书名称" @changeValue="changeValue"></my-input> <MyInput v-model="queryParams.name" @clickSearch="handleSearch" />
</div> </div>
<div class="convert-content" v-loading="loading">
<div class="integral-lists"> <ul class="book-main" :style="listStyle">
<div class="list" v-for="item in certificateList"> <li
<div class="list-top" :style="{'background-image': 'url(' + basicUrl + item.cover + ')'}"></div> v-for="(item, index) in certificatesList"
<div class="list-bottom"> :key="item.id"
<span class="bottom-left">{{ item.name }}</span> :style="{ marginBottom: isLastRow(index) ? '0px' : '' }"
<span class="bottom-right" @click="conversion(item)"></span> >
<div class="integral-num">积分50</div>
<el-image
style="width: 100%; height: 87%"
:src="baseUrl + item.cover"
fit="fill"
:preview-src-list="[`${baseUrl + item.cover}`]"
>
</el-image>
<div class="operate">
<div class="integral">
{{ item.name }}
</div> </div>
<div class="operate-child">
<div class="exchange-btn" @click="conversion(item)"> </div>
</div> </div>
</div> </div>
<div class="pagination"> </li>
<my-pagination :total="total" @pagesChange="pagesChange"></my-pagination> </ul>
</div> <pagination
</div> v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</div> </div>
</template> </template>
<script> <script>
import myInput from "@/views/components/myInput/index.vue"
import myPagination from "@/views/components/myPagination/index.vue"
import { listCertificates } from "@/api/volunteer/gxhzs/gxhzsgl/index.js"; import { listCertificates } from "@/api/volunteer/gxhzs/gxhzsgl/index.js";
export default { export default {
data() { data() {
return { return {
listStyle: {
height: 0,
overflowY: "auto",
},
baseUrl: process.env.VUE_APP_BASE_API,
certificatesList: [],
loading: false,
tableData: [],
total: 0, total: 0,
certificateList:[],
basicUrl:process.env.VUE_APP_BASE_API,
queryParams: { queryParams: {
name: undefined,
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
}, },
loading:false, form: {},
value:{ rules: {},
name:''
},
isClick:false,
}; };
}, },
components: { created() {
myInput,myPagination // //
}, this.$nextTick(() => {
mounted() { this.listStyle.height =
this.getList() this.$refs.main.offsetHeight -
40 -
this.$refs.search.offsetHeight -
42 +
"px";
this.getList();
});
}, },
methods: { methods: {
// isLastRow(index) {
pagesChange(pages){ const rowCount = Math.ceil(this.certificatesList.length / 5);
this.queryParams = pages; const row = Math.floor(index / 5);
this.getList() return row === rowCount - 1;
}, },
// /**兑换 */
changeInput(e){ conversion(item) {
this.isClick = true; console.log(item);
this.queryParams= {
pageNum: 1,
pageSize: 10,
};
this.value.name = e;
this.getList()
}, },
// /**搜索 */
changeValue(value){ handleSearch(keyWord) {
if(this.isClick && value == ''){ this.queryParams = {
this.value.name = ''; name: keyWord,
this.pages= {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
}; };
this.getList(); this.getList();
this.isClick = false;
}
},
//
conversion(item){
console.log(item)
}, },
/** 查询证书管理列表 */
getList() { getList() {
this.loading = true; this.loading = true;
let obj = { ...this.queryParams,...this.value } listCertificates(this.queryParams).then((response) => {
listCertificates(obj).then((response) => { this.certificatesList = response.rows;
this.certificateList = response.rows;
this.total = response.total; this.total = response.total;
this.loading = false; this.loading = false;
}); });
} },
//
reset() {
this.form = {
id: null,
name: null,
type: null,
cover: null,
content: null,
datetime: null,
serviceDuration: null,
createId: null,
createBy: null,
createTime: null,
updateId: null,
updateBy: null,
updateTime: null,
remark: null,
userId: null,
deptId: null,
};
this.resetForm("form");
},
//
cancel() {
this.open = false;
this.reset();
},
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.mainBox { @import "@/assets/styles/myTable.scss";
height: 100%;
width: 100%;
border-radius: 10px 10px 0 0;
background-color: #fff;
padding: 0 20px 10px 20px;
box-shadow: 0px 0px 15px 0px rgba(229,212,212,0.58);
.convert-topBox {
padding: 20px 0 0 0;
}
.convert-content {
height: 100%;
.integral-lists {
// display: flex;
// flex-wrap: wrap;
margin-top: 30px;
display: grid;
grid-template-columns: repeat(5, 19%);
grid-column-gap: 25px;
grid-row-gap: 25px;
height: 80%;
.list {
width: 100%;
height: 100%;
// background: linear-gradient(0deg, #EFE6D9, #DDC9AC);
box-shadow: 0px 3px 15px 0px rgba(184,184,184,0.22);
border-radius: 10px;
.list-top {
// background: url('../../../assets/images/icon1.png') no-repeat center center;
background-size: 100% 100%;
height: 80%;
width: 100%;
}
// .top-two {
// background: url('../../../assets/images/icon2.png') no-repeat center center;
// background-size: 100% 100%;
// }
// .top-three {
// background: url('../../../assets/images/icon3.png') no-repeat center center;
// background-size: 100% 100%;
// }
.list-bottom {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 20px;
.bottom-left {
font-size: 16px;
font-family: FZDaBiaoSong-B06S;
font-weight: 400;
color: #4D4949;
}
.bottom-right {
padding: 3px 15px;
border-radius: 4px;
background-color: rgba(249,86,95,0.1);
font-size: 14px;
font-family: 'Alibaba PuHuiTi';
font-weight: 400;
color: #F8414D;
cursor: pointer;
}
}
}
}
.pagination {
margin-top: 10px;
}
}
}
</style> </style>

@ -0,0 +1,9 @@
<template>
<div class="app-container">用户标签化数据</div>
</template>
<script>
export default {};
</script>
<style></style>

@ -0,0 +1,9 @@
<template>
<div class="app-container">标签字典管理</div>
</template>
<script>
export default {};
</script>
<style></style>

@ -0,0 +1,233 @@
<template>
<div class="app-container" ref="main">
<div ref="search">
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
class="search-container"
>
<el-form-item prop="name">
<el-input
v-model="queryParams.input"
placeholder="请输入关键字"
clearable
>
<div class="search-btn" slot="append">
<i class="el-icon-search"></i>
</div>
</el-input>
</el-form-item>
</el-form>
</div>
<el-table
v-loading="loading"
:data="tableData"
:height="tableHeigth + 'px'"
>
<el-table-column
label="序号"
align="center"
type="index"
prop="id"
width="55"
/>
<el-table-column label="证书名称" align="center" prop="certificateId" />
<el-table-column label="兑换人员" align="center" prop="type" />
<el-table-column label="状态" align="center" prop="duration" />
<el-table-column label="兑换时间" align="center" prop="time" />
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
icon="el-icon-view"
type="text"
@click="handleInfo(scope.row)"
>查看</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 :visible.sync="open" width="900px" append-to-body>
<div slot="title" class="dialog-title">
<span class="title-line"></span>
{{ title }}
</div>
<div class="conversionInfo">
<div class="basicInfo">
<div class="title">
<img src="@/assets/images/huodong.png" alt="" />
<span>证书详情</span>
</div>
<div class="info">
<div class="lists">
<div class="list-left">
<div>证书名称</div>
<div>xxx证书</div>
</div>
<div class="list-right">
<div>兑换人员</div>
<div>xxxx</div>
</div>
</div>
<div class="lists">
<div class="list-left">
<div>兑换时间</div>
<div>xxxx</div>
</div>
<div class="list-left">
<div>兑换积分</div>
<div>xx</div>
</div>
</div>
<div class="lists">
<div class="list-left">
<div>证书状态</div>
<div>已发放</div>
</div>
</div>
</div>
</div>
<div class="logisticsInfo">
<div class="title">
<img src="@/assets/images/huodong.png" alt="" />
<span>物流信息</span>
</div>
<div class="info">
<div class="lists">
<div class="list-left">
<div>快递公司</div>
<div>XXXXXXXXX</div>
</div>
<div class="list-right">
<div>快递单号</div>
<div>XXXXXXXXXXX</div>
</div>
</div>
</div>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
getSellectall,
postElectron,
getInfo,
editData,
} from "@/api/volunteer/gxhzs/hdzsff/index.js";
export default {
data() {
return {
infoOpen: false,
form: {},
open: false,
title: "",
tableHeigth: 0,
queryParams: {},
loading: false,
tableData: [{}],
total: 1,
queryParams: {
creType: 2,
pageNum: 1,
pageSize: 20,
},
};
},
created() {
// //
this.$nextTick(() => {
this.tableHeigth =
this.$refs.main.offsetHeight - this.$refs.search.offsetHeight - 80;
this.getList();
});
},
methods: {
handleInfo() {
this.title = "查看";
this.open = true;
},
cancel() {
this.open = false;
},
},
};
</script>
<style lang="scss" scoped>
@import "@/assets/styles/myTable.scss";
::v-deep .conversionInfo {
.basicInfo,
.logisticsInfo {
.title {
display: flex;
align-items: center;
img {
width: 14px;
margin-right: 10px;
}
span {
font-size: 16px;
font-family: "Alibaba PuHuiTi";
font-weight: bold;
color: #4c4949;
}
}
.info {
margin-top: 20px;
display: grid;
grid-column: 1fr;
grid-row-gap: 20px;
.lists {
display: flex;
align-items: center;
justify-content: space-between;
.list-left,
.list-right {
flex: 1;
display: flex;
align-items: center;
div {
&:nth-child(1) {
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #4c4949;
}
&:nth-child(2) {
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #807a7a;
}
}
}
}
}
}
.logisticsInfo {
margin-top: 30px;
}
}
</style>

@ -0,0 +1,136 @@
<template>
<div class="app-container" ref="main">
<div class="search" ref="search">
<MyInput v-model="queryParams.name" @clickSearch="handleSearch" />
</div>
<ul class="book-main" :style="listStyle">
<li
v-for="(item, index) in certificatesList"
:key="item.id"
:style="{ marginBottom: isLastRow(index) ? '0px' : '' }"
>
<div class="integral-num">积分50</div>
<el-image
style="width: 100%; height: 87%"
:src="baseUrl + item.cover"
fit="fill"
:preview-src-list="[`${baseUrl + item.cover}`]"
>
</el-image>
<div class="operate">
<div class="integral">
{{ item.name }}
</div>
<div class="operate-child">
<div class="exchange-btn" @click="conversion(item)"> </div>
</div>
</div>
</li>
</ul>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script>
import { listCertificates } from "@/api/volunteer/gxhzs/gxhzsgl/index.js";
export default {
data() {
return {
listStyle: {
height: 0,
overflowY: "auto",
},
baseUrl: process.env.VUE_APP_BASE_API,
certificatesList: [],
loading: false,
tableData: [],
total: 0,
queryParams: {
name: undefined,
pageNum: 1,
pageSize: 10,
},
form: {},
rules: {},
};
},
created() {
// //
this.$nextTick(() => {
this.listStyle.height =
this.$refs.main.offsetHeight -
40 -
this.$refs.search.offsetHeight -
42 +
"px";
this.getList();
});
},
methods: {
isLastRow(index) {
const rowCount = Math.ceil(this.certificatesList.length / 5);
const row = Math.floor(index / 5);
return row === rowCount - 1;
},
/**兑换 */
conversion(item) {
console.log(item);
},
/**搜索 */
handleSearch(keyWord) {
this.queryParams = {
name: keyWord,
pageNum: 1,
pageSize: 10,
};
this.getList();
},
/** 查询证书管理列表 */
getList() {
this.loading = true;
listCertificates(this.queryParams).then((response) => {
this.certificatesList = response.rows;
this.total = response.total;
this.loading = false;
});
},
//
reset() {
this.form = {
id: null,
name: null,
type: null,
cover: null,
content: null,
datetime: null,
serviceDuration: null,
createId: null,
createBy: null,
createTime: null,
updateId: null,
updateBy: null,
updateTime: null,
remark: null,
userId: null,
deptId: null,
};
this.resetForm("form");
},
//
cancel() {
this.open = false;
this.reset();
},
},
};
</script>
<style lang="scss" scoped>
@import "@/assets/styles/myTable.scss";
</style>

@ -7,7 +7,7 @@ function resolve(dir) {
const CompressionPlugin = require("compression-webpack-plugin"); const CompressionPlugin = require("compression-webpack-plugin");
const name = process.env.VUE_APP_TITLE || "若依管理系统"; // 网页标题 const name = process.env.VUE_APP_TITLE || "志愿者管理系统"; // 网页标题
const port = process.env.port || process.env.npm_config_port || 80; // 端口 const port = process.env.port || process.env.npm_config_port || 80; // 端口
@ -57,9 +57,9 @@ module.exports = {
sassOptions: { outputStyle: "expanded" }, sassOptions: { outputStyle: "expanded" },
}, },
// px to rem // px to rem
// postcss: { postcss: {
// plugins: [postcss], plugins: [postcss],
// }, },
}, },
}, },
configureWebpack: { configureWebpack: {

Loading…
Cancel
Save