李劲龙 2 years ago
commit 287509f12e

@ -7,6 +7,7 @@
trigger="click" trigger="click"
> >
<div class="avatar-wrapper"> <div class="avatar-wrapper">
<div class="my-jifen">我的积分余额: 200</div>
<img :src="avatar" class="user-avatar" /> <img :src="avatar" class="user-avatar" />
<!-- <i class="el-icon-caret-bottom" /> --> <!-- <i class="el-icon-caret-bottom" /> -->
<div class="user-name">{{ name }}</div> <div class="user-name">{{ name }}</div>
@ -62,6 +63,7 @@ export default {
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 0 20px; padding: 0 20px;
.system-log { .system-log {
font-size: 23px; font-size: 23px;
font-family: "Alibaba-PuHuiTi-Bold"; font-family: "Alibaba-PuHuiTi-Bold";
@ -70,6 +72,13 @@ export default {
line-height: 60px; line-height: 60px;
letter-spacing: 2px; letter-spacing: 2px;
} }
.my-jifen {
font-size: 18px;
font-weight: 400;
color: #ffffff;
font-family: "Alibaba-PuHuiTi-Regular";
margin-right: 30px;
}
.avatar-container { .avatar-container {
.avatar-wrapper { .avatar-wrapper {
display: flex; display: flex;

@ -97,8 +97,13 @@ export const constantRoutes = [
path: "/volunteer/zyzsjgl/zdgl/:dictId(\\d+)", path: "/volunteer/zyzsjgl/zdgl/:dictId(\\d+)",
component: () => import("@/views/volunteer/userbq/dictGl/data"), component: () => import("@/views/volunteer/userbq/dictGl/data"),
hidden: true, hidden: true,
name:"dictGl", name: "dictGl",
meta: { title: "字典详情", icon: "dashboard", affix: true , activeMenu: "/volunteer/userbq/dictGl"}, meta: {
title: "字典详情",
icon: "dashboard",
affix: true,
activeMenu: "/volunteer/userbq/dictGl",
},
}, },
], ],
}, },

@ -15,7 +15,6 @@
style="width: 100%; height: 87%" style="width: 100%; height: 87%"
:src="baseUrl + item.cover" :src="baseUrl + item.cover"
fit="fill" fit="fill"
:preview-src-list="[`${baseUrl + item.cover}`]"
> >
</el-image> </el-image>
<div class="operate"> <div class="operate">

@ -36,6 +36,7 @@
/> />
<el-table-column label="证书" align="center" prop="certificateId" /> <el-table-column label="证书" 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="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 ? "已发放" : "未发放" }}
@ -77,6 +78,10 @@
<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="item-lable">兑换时间:</div>
<div class="item-value">{{ form.uid }}</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">

@ -16,7 +16,6 @@
style="width: 100%; height: 87%" style="width: 100%; height: 87%"
:src="baseUrl + item.cover" :src="baseUrl + item.cover"
fit="fill" fit="fill"
:preview-src-list="[`${baseUrl + item.cover}`]"
> >
</el-image> </el-image>
<div class="operate"> <div class="operate">

@ -35,7 +35,7 @@
width="55" width="55"
/> />
<el-table-column label="证书名称" align="center" prop="certificateId" /> <el-table-column label="证书名称" align="center" prop="certificateId" />
<el-table-column label="兑换人员" align="center" prop="type" /> <el-table-column label="志愿者" align="center" prop="type" />
<el-table-column label="状态" align="center" prop="duration" /> <el-table-column label="状态" align="center" prop="duration" />
<el-table-column label="兑换时间" align="center" prop="time" /> <el-table-column label="兑换时间" align="center" prop="time" />
<el-table-column <el-table-column
@ -81,7 +81,7 @@
<div>xxx证书</div> <div>xxx证书</div>
</div> </div>
<div class="list-right"> <div class="list-right">
<div>兑换人员</div> <div>志愿者</div>
<div>xxxx</div> <div>xxxx</div>
</div> </div>
</div> </div>

@ -15,7 +15,6 @@
style="width: 100%; height: 87%" style="width: 100%; height: 87%"
:src="baseUrl + item.cover" :src="baseUrl + item.cover"
fit="fill" fit="fill"
:preview-src-list="[`${baseUrl + item.cover}`]"
> >
</el-image> </el-image>
<div class="operate"> <div class="operate">

@ -0,0 +1,228 @@
<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="time" />
<el-table-column label="活动地址" align="center" prop="duration" />
<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>xxxx</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>

@ -35,7 +35,7 @@
width="55" width="55"
/> />
<el-table-column label="证书名称" align="center" prop="certificateId" /> <el-table-column label="证书名称" align="center" prop="certificateId" />
<el-table-column label="兑换人员" align="center" prop="type" /> <el-table-column label="志愿者" align="center" prop="type" />
<el-table-column label="状态" align="center" prop="duration" /> <el-table-column label="状态" align="center" prop="duration" />
<el-table-column label="兑换时间" align="center" prop="time" /> <el-table-column label="兑换时间" align="center" prop="time" />
<el-table-column <el-table-column
@ -81,7 +81,7 @@
<div>xxx证书</div> <div>xxx证书</div>
</div> </div>
<div class="list-right"> <div class="list-right">
<div>兑换人员</div> <div>志愿者</div>
<div>xxxx</div> <div>xxxx</div>
</div> </div>
</div> </div>

@ -1,33 +1,59 @@
<template> <template>
<div class="app-container" ref="main"> <div class="app-container" ref="main">
<div class="search" ref="search"> <div ref="search">
<MyInput v-model="queryParams.name" @clickSearch="handleSearch" /> <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> </div>
<ul class="book-main" :style="listStyle"> <el-table
<li v-loading="loading"
v-for="(item, index) in certificatesList" :data="tableData"
:key="item.id" :height="tableHeigth + 'px'"
:style="{ marginBottom: isLastRow(index) ? '0px' : '' }" >
<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="uid" />
<el-table-column label="兑换时间" align="center" prop="uid" />
<el-table-column label="状态" align="center" prop="type">
<template slot-scope="scope">
{{ scope.row.type == 1 ? "已发放" : "未发放" }}
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
> >
<div class="integral-num">积分50</div> <template slot-scope="scope">
<el-image <el-button size="mini" type="text" @click="handleFabu(scope.row)"
style="width: 100%; height: 87%" >发布</el-button
:src="baseUrl + item.cover" >
fit="fill" </template>
:preview-src-list="[`${baseUrl + item.cover}`]" </el-table-column>
> </el-table>
</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 <pagination
v-show="total > 0" v-show="total > 0"
:total="total" :total="total"
@ -35,82 +61,152 @@
:limit.sync="queryParams.pageSize" :limit.sync="queryParams.pageSize"
@pagination="getList" @pagination="getList"
/> />
<!-- 发布对话框 -->
<el-dialog :visible.sync="open" width="500px" append-to-body>
<div slot="title" class="dialog-title">
<span class="title-line"></span>
{{ title }}
</div>
<div class="info-box">
<div>
<div class="info-item">
<div class="item-lable">证书:</div>
<div class="item-value">{{ form.certificateId }}</div>
</div>
<div class="info-item">
<div class="item-lable">志愿者:</div>
<div class="item-value">{{ form.uid }}</div>
</div>
<div class="info-item">
<div class="item-lable">兑换时间:</div>
<div class="item-value">{{ form.uid }}</div>
</div>
<div class="info-item">
<div class="item-lable">状态:</div>
<div class="item-value">
{{ form.type == 1 ? "已发放" : "未发放" }}
</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 slot="footer" class="dialog-footer">
<el-button @click="cancel"> </el-button>
<el-button type="warning" @click="submitPaper"></el-button>
<el-button type="primary" @click="submitElectron"
>发放电子证书</el-button
>
</div>
</el-dialog>
<!-- 纸质证书 -->
<el-dialog :visible.sync="infoOpen" width="500px" append-to-body>
<div slot="title" class="dialog-title">
<span class="title-line"></span>
邮政信息
</div>
<!-- <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">
<el-button type="primary" @click="submitForm"> </el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { listCertificates } from "@/api/volunteer/gxhzs/gxhzsgl/index.js"; import {
getSellectall,
postElectron,
getInfo,
editData,
} from "@/api/volunteer/gxhzs/hdzsff/index.js";
export default { export default {
data() { data() {
return { return {
listStyle: { infoOpen: false,
height: 0, form: {},
overflowY: "auto", rules: {},
}, open: false,
baseUrl: process.env.VUE_APP_BASE_API, title: "",
certificatesList: [], tableHeigth: 0,
queryParams: {},
loading: false, loading: false,
tableData: [], tableData: [],
total: 0, total: 1,
queryParams: { queryParams: {
name: undefined, creType: 2,
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 20,
}, },
form: {},
rules: {},
}; };
}, },
created() { created() {
// // // //
this.$nextTick(() => { this.$nextTick(() => {
this.listStyle.height = this.tableHeigth =
this.$refs.main.offsetHeight - this.$refs.main.offsetHeight - this.$refs.search.offsetHeight - 75;
40 -
this.$refs.search.offsetHeight -
42 +
"px";
this.getList(); this.getList();
}); });
}, },
methods: { methods: {
isLastRow(index) { /**纸质提交 */
const rowCount = Math.ceil(this.certificatesList.length / 5); submitForm() {
const row = Math.floor(index / 5); editData(this.form).then((res) => {
return row === rowCount - 1; this.submitElectron();
});
}, },
/**兑换 */ /**纸质 */
conversion(item) { submitPaper() {
console.log(item); this.infoOpen = true;
}, },
/**搜索 */ /**电子 */
handleSearch(keyWord) { submitElectron() {
this.queryParams = { let data = {
name: keyWord, activityId: this.form.activityId,
pageNum: 1, uid: this.form.uid,
pageSize: 10,
}; };
this.getList(); postElectron(data).then((res) => {
}, this.infoOpen = false;
/** 查询证书管理列表 */ this.open = false;
getList() { this.$modal.msgSuccess("发放成功");
this.loading = true; this.getList();
listCertificates(this.queryParams).then((response) => {
this.certificatesList = response.rows;
this.total = response.total;
this.loading = false;
}); });
}, },
// /**关闭 */
cancel() {
this.open = false;
this.reset();
},
/**重置 */
reset() { reset() {
this.form = { this.form = {
id: null, id: null,
name: null, activityId: null,
type: null, certificateId: null,
cover: null, uId: null,
content: null, content: null,
datetime: null,
serviceDuration: null,
createId: null, createId: null,
createBy: null, createBy: null,
createTime: null, createTime: null,
@ -120,17 +216,45 @@ export default {
remark: null, remark: null,
userId: null, userId: null,
deptId: null, deptId: null,
type: null,
}; };
this.resetForm("form");
}, },
// /** 查询发放记录列表 */
cancel() { getList() {
this.open = false; this.loading = true;
getSellectall(this.queryParams).then((response) => {
this.tableData = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
handleFabu(row) {
this.reset(); this.reset();
let id = row.id;
getInfo(id).then((res) => {
this.form = res.data;
this.title = "发放查看";
this.open = true;
});
}, },
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "@/assets/styles/myTable.scss"; @import "@/assets/styles/myTable.scss";
// ::v-deep .search-container {
// .el-form-item__content {
// width: 550px;
// }
// .el-input-group__append {
// padding-left: 15px !important;
// padding-right: 15px !important;
// background: #f8414d !important;
// border-color: #f8414d !important;
// .search-btn {
// color: #fff !important;
// }
// }
// }
</style> </style>

Loading…
Cancel
Save