<template>
|
<div class="page_clap">
|
<h1 class="h1">随手拍管理</h1>
|
|
<Statistics :list="list"></Statistics>
|
|
<div class="header">
|
<el-form :inline="true" class="demo-form-inline">
|
<el-form-item label="关键词搜索" style="">
|
<el-input
|
style="width:385px"
|
size="small"
|
v-model="bar.keyWord"
|
placeholder="请输入发起人、事件发生地、处理人等关键词进行查找"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="治理状态">
|
<el-select v-model="bar.status" placeholder="请选择">
|
<el-option
|
v-for="item in statusList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="内容质量">
|
<el-select v-model="bar.activityType" placeholder="请选择">
|
<el-option
|
v-for="item in activityTypeList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="事件类型">
|
<el-select v-model="bar.classifyId" placeholder="请选择">
|
<el-option
|
v-for="item in easyTypeList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="公示">
|
<el-radio-group v-model="bar.isPublicity" size="medium">
|
<el-radio-button label="1">公示</el-radio-button>
|
<el-radio-button label="2">未公示</el-radio-button>
|
</el-radio-group>
|
</el-form-item>
|
|
<!-- <el-form-item label="是否上报城管">
|
<el-radio-group v-model="bar.isReportUrban" size="medium">
|
<el-radio-button label="1">是</el-radio-button>
|
<el-radio-button label="0">否</el-radio-button>
|
</el-radio-group>
|
</el-form-item> -->
|
|
<el-form-item label="事件上报">
|
<el-select
|
v-model="isEscalation"
|
placeholder="请选择"
|
@change="escalationClick"
|
>
|
<el-option
|
v-for="item in escalationList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<div class="block">
|
<span class="demonstration">创建时间</span>
|
<el-date-picker
|
v-model="bar.time"
|
type="daterange"
|
range-separator="至"
|
format="yyyy-MM-dd HH:mm:ss"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
:default-time="['00:00:00', '23:59:59']"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
>
|
</el-date-picker>
|
</div>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
size="small"
|
type="primary"
|
plain
|
@click="batchHandle(item)"
|
>去处理</el-button
|
>
|
<el-button size="small" type="primary" @click="onSearch"
|
>查询</el-button
|
>
|
<el-button @click="Reset" size="small">重置</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
|
<div class="tab">
|
<v-table :trs="trs" :tds="tds" ref="table">
|
<template v-slot:btn="item">
|
<div class="table_flex">
|
<!-- {{item.scope.id}} -->
|
<el-button
|
type="text"
|
class="col_primary"
|
v-for="(i, j) in is_btn(
|
item.scope.status,
|
item.scope.activityId,
|
item.scope.activityAmount
|
)"
|
:key="j + '-btn'"
|
@click="onEvent(i, item.scope)"
|
>{{ i.t }}</el-button
|
>
|
</div>
|
</template>
|
<template v-slot:status="item">
|
<b>{{ is_level(+item.scope.status) }}</b>
|
</template>
|
<template v-slot:isReport="{ scope }">
|
<span v-if="!scope.isReportDpc && !scope.isReportUrban"
|
>暂不上报</span
|
>
|
<span v-if="scope.isReportDpc && !scope.isReportUrban">人大代表</span>
|
<span v-if="!scope.isReportDpc && scope.isReportUrban">城管</span>
|
</template>
|
<template v-slot:isReportUrban="{ scope }">
|
<span v-if="scope.isReportUrban == '1'">是</span>
|
<span v-else>否</span>
|
</template>
|
<!-- <template v-slot:easyType="{scope}">
|
<span v-if="scope.easyType == '1'">是</span>
|
<span v-if="scope.easyType == '1'">是</span>
|
<span v-if="scope.easyType == '1'">是</span>
|
</template> -->
|
<template v-slot:openstatus="{ scope }">
|
<el-switch
|
v-model="scope.isPublicity"
|
@change="openstatusbtn($event, scope)"
|
active-color="#13ce66"
|
inactive-color="#ff4949"
|
:active-value="1"
|
:inactive-value="2"
|
>
|
</el-switch>
|
</template>
|
|
<template v-slot:feed="item">
|
<b>{{ checkFeed(item.scope) }}</b>
|
</template>
|
<template v-slot:amount="{ scope }" style="text-align:center">
|
<span class="amount-text">
|
{{ scope.activityAmount || 0 }}
|
</span>
|
</template>
|
<template v-slot:types="item">
|
<b>{{
|
["", "优秀", "良好", "普通", "合格"][item.scope.activityType] ||
|
"无"
|
}}</b>
|
</template>
|
</v-table>
|
</div>
|
<v-tool-page :item="paged" @on-page="onPage"></v-tool-page>
|
<el-dialog
|
title="发放奖励"
|
:modal="false"
|
:visible.sync="dialogVisible"
|
width="300px"
|
:close-on-click-modal="false"
|
>
|
<span>
|
<div class="item">
|
<div class="label">奖励金额：</div>
|
<el-input-number
|
v-model="reward"
|
size="small"
|
:precision="2"
|
:min="0"
|
label="默认审核时的奖励金额，可修改"
|
></el-input-number>
|
</div>
|
</span>
|
<span slot="footer" class="dialog-footer">
|
<el-button size="small" @click="dialogVisible = false">取 消</el-button>
|
<el-button size="small" type="primary" @click="grantReward"
|
>确 定</el-button
|
>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { mapState } from "vuex";
|
export default {
|
props: {},
|
components: {},
|
data() {
|
return {
|
activeValue: 1,
|
inactiveValue: 0,
|
isPublicity: "",
|
istUrban: "",
|
bar: {
|
keyWord: "",
|
status: "",
|
activityType: "",
|
classifyId: "",
|
isReportUrban: "",
|
isPublicity: "",
|
isReportDpc: "",
|
time: ""
|
},
|
statusList: [
|
{
|
label: "待处理",
|
value: 1
|
},
|
{
|
label: "进行中",
|
value: 2
|
},
|
{
|
label: "待评价",
|
value: 4
|
},
|
{
|
label: "已完成",
|
value: 5
|
}
|
],
|
isEscalation: "",
|
escalationList: [
|
{
|
label: "全部",
|
value: ""
|
},
|
{
|
label: "城管",
|
value: 1
|
},
|
{
|
label: "人大代表",
|
value: 2
|
},
|
{
|
label: "暂不上报",
|
value: 3
|
}
|
],
|
activityTypeList: [
|
{
|
label: "优秀",
|
value: 1
|
},
|
{
|
label: "良好",
|
value: 2
|
},
|
{
|
label: "普通",
|
value: 3
|
},
|
{
|
label: "合格",
|
value: 4
|
},
|
{
|
label: "无",
|
value: 5
|
}
|
],
|
easyTypeList: [],
|
trs: [
|
{ text: "序号", val: "index", width: "100px" },
|
{ text: "发起人", val: "sponsorName", width: "100px" },
|
{ text: "发起人手机号", val: "phone", width: "150px" },
|
{ text: "事件发生地", val: "happenAddr", width: "150px" },
|
{ text: "事件类型", val: "classifyName", width: "150px" },
|
// { text: "移交城管", val: "btn",slot:"isReportUrban" },
|
{ text: "公示状态", val: "btn", slot: "openstatus" },
|
{ text: "处理人", val: "handlerName", width: "100px" },
|
{ text: "事件上报", val: "btn", width: "100px", slot: "isReport" },
|
{ text: "奖励金额", val: "btn", width: "100px", slot: "amount" },
|
{ text: "状态", val: "btn", slot: "status", width: "100px" },
|
{ text: "内容质量", val: "btn", slot: "types", width: "100px" },
|
{ text: "创建时间", val: "createAt", width: "200px" },
|
{ text: "审核时间", val: "examineAt", width: "200px" },
|
{ text: "操作", val: "btn", width: "200px", fixed: "right" }
|
],
|
list: [
|
{
|
key: "examineNum",
|
name: "待处理随手拍",
|
num: 0,
|
Company: "个"
|
},
|
{
|
key: "verificationNum",
|
name: "进行中随手拍",
|
num: 0,
|
Company: "个"
|
},
|
{
|
key: "completeNum",
|
name: "已完成随手拍",
|
num: 0,
|
Company: "个"
|
},
|
{
|
key: "rejectNum",
|
name: "已公示随手拍",
|
num: 0,
|
Company: "个"
|
},
|
{
|
key: "ptAllTotal",
|
keyTwo: "ptDayTotal",
|
name: "普通",
|
num: 0,
|
Company: "",
|
day: 0
|
},
|
{
|
key: "ybAllTotal",
|
keyTwo: "ybDayTotal",
|
name: "合格",
|
num: 0,
|
Company: "",
|
day: 0
|
},
|
{
|
key: "jlAllTotal",
|
keyTwo: "jlDayTotal",
|
name: "良好",
|
num: 0,
|
Company: "",
|
day: 0
|
},
|
{
|
key: "yzAllTotal",
|
keyTwo: "yzDayTotal",
|
name: "优秀",
|
num: 0,
|
Company: "",
|
day: 0
|
},
|
{
|
key: "allRewardAmount",
|
keyTwo: "dayRewardAmount",
|
name: "奖励金额",
|
num: 0,
|
Company: "",
|
day: 0
|
}
|
],
|
tds: [],
|
paged: { page: 0, total: 0, r: 0, limit: 10 },
|
os: {},
|
search: {},
|
dialogVisible: false,
|
reward: 0,
|
ids: [],
|
addType: 1
|
};
|
},
|
|
computed: {
|
...mapState({ vuex_page: "pageReset" })
|
},
|
|
watch: {
|
vuex_page: {
|
handler(n) {
|
if (n.page === this.$route.path) {
|
// this.paged.page = 1;
|
this.init();
|
this.getStatistics();
|
}
|
},
|
deep: true
|
}
|
},
|
|
methods: {
|
escalationClick(e) {
|
//isEscalation 1,城管 2.大人 3暂不上报
|
if (this.isEscalation == "1") {
|
this.bar.isReportUrban = 1; //城管
|
this.bar.isReportDpc = 0; //城管
|
} else if (this.isEscalation == "2") {
|
this.bar.isReportUrban = 0; //城管
|
this.bar.isReportDpc = 1; //城管
|
} else {
|
this.bar.isReportUrban = 0; //城管
|
this.bar.isReportDpc = 0; //城管
|
}
|
|
console.log(this.isEscalation);
|
},
|
|
//事件类型
|
typeList() {
|
this.$api.get(
|
"communityactivity/easyphoto/classify/list",
|
{ addType: this.addType },
|
e => {
|
this.easyTypeList = e.map(d => {
|
return {
|
label: d.name,
|
value: d.id
|
};
|
});
|
}
|
);
|
},
|
|
//公示状态
|
openstatusbtn($event, val) {
|
val.isPublicity = $event;
|
let params = {
|
id: val.id,
|
isPublicity: val.isPublicity
|
};
|
|
this.$api.post(
|
"communityactivity/easyphoto/switch/publicity",
|
params,
|
e => {
|
demo.toast("修改成功");
|
this.getStatistics();
|
}
|
);
|
},
|
|
// 类型
|
checkFeed(v) {
|
let index = +v.isNeedFeedBack;
|
let status = +v.status;
|
return status >= 1 ? (index === 1 ? "治理类" : "心情类") : "";
|
},
|
|
// 状态
|
is_level(id) {
|
// 1待处理 2进行中 3已驳回 4待评价 5.已完成
|
let status = ["待处理", "进行中", "已驳回", "待评价", "已完成"].map(
|
(k, v) => {
|
return {
|
value: v + 1,
|
label: k
|
};
|
}
|
);
|
if (id < 0) {
|
return status;
|
}
|
let vs = status.filter(k => {
|
return k.value === id;
|
});
|
return vs.length ? vs[0].label : id;
|
},
|
|
//
|
is_btn(id, activityId, activityAmount) {
|
/**
|
* 待审核：审核，查看
|
进行中：反馈，查看
|
已驳回：查看
|
已完成：查看
|
*/
|
// activityAmount 活动奖励
|
//activityId 活动id
|
let t = [
|
{ t: "去处理", v: "send" },
|
{ t: "查看", v: "show" },
|
{ t: "反馈", v: "kui" },
|
{ t: "删除", v: "del" }
|
// { t: "发放奖励", v: "sub" },
|
];
|
switch (+id) {
|
case 1:
|
return [t[0], t[1], t[3]];
|
break;
|
case 2:
|
return [t[2], t[1], t[3]];
|
break;
|
case 4:
|
let list = [];
|
if (activityId && activityAmount == null) list = [t[1], t[3]];
|
else list = [t[1], t[3]];
|
return list;
|
break;
|
default:
|
return [t[1], t[3]];
|
}
|
},
|
|
onEvent(i, item) {
|
// console.log(i);
|
switch (i.v) {
|
case "send":
|
this.$store.dispatch("setFixed", {
|
event: "add",
|
data: {
|
type: "clap-examine",
|
data: {
|
id: item.id,
|
next: "1"
|
}
|
},
|
time: Date.now()
|
});
|
break;
|
case "kui":
|
this.$store.dispatch("setFixed", {
|
event: "add",
|
data: {
|
type: "clap-feedback",
|
data: item,
|
// addType:this.addType
|
},
|
time: Date.now()
|
});
|
break;
|
case "sub":
|
// activityAmount
|
this.dialogVisible = true;
|
this.reward = item.activityMoney;
|
this.ids = [item.id];
|
break;
|
case "del":
|
this.$js.model("删除", "是否删除随手拍？", res => {
|
if (res) {
|
this.$api.del(
|
"communityactivity/easyphoto/" + item.id,
|
{ id: item.id },
|
() => {
|
demo.toast("删除成功");
|
this.init();
|
this.getStatistics();
|
}
|
);
|
}
|
});
|
break;
|
default:
|
this.$router.push(this.$nav.url("/act_clap_detail/" + item.id));
|
}
|
},
|
|
batchHandle(item) {
|
this.$api.get("communityactivity/easyphoto/noHandle/list", {}, e => {
|
if (!e.length) {
|
return demo.toast("没有待处理的事项");
|
} else {
|
this.$store.dispatch("setFixed", {
|
event: "add",
|
data: {
|
type: "clap-examinemore",
|
data: {
|
// id: 1,
|
// next:"1"
|
}
|
},
|
time: Date.now()
|
});
|
}
|
});
|
},
|
|
grantReward() {
|
//随手拍发放奖励
|
let data = {
|
amount: this.reward,
|
ids: this.ids
|
};
|
this.$api.post("communityactivity/grantReward", data, e => {
|
if (e) {
|
return demo.toast(e.msg);
|
}
|
this.dialogVisible = false;
|
this.reward = 0;
|
this.init();
|
});
|
},
|
|
Reset() {
|
this.bar.keyWord = "";
|
this.bar.status = "";
|
this.bar.activityType = "";
|
this.bar.classifyId = "";
|
this.bar.isReportUrban = "";
|
this.bar.isPublicity = "";
|
this.bar.time = "";
|
this.isEscalation = "";
|
},
|
|
onSearch() {
|
console.log(this.bar);
|
this.paged.page = 1;
|
this.init();
|
},
|
|
// 分页点击
|
onPage(v) {
|
if (v.page === this.paged.page && v.page && !v.reset) {
|
return 0;
|
}
|
this.paged.page = v.page;
|
this.paged.limit = v.limit;
|
this.init();
|
},
|
|
// 获取数据
|
init() {
|
let params = {
|
keyWord: this.bar.keyWord,
|
status: this.bar.status,
|
activityType: this.bar.activityType,
|
classifyId: this.bar.classifyId,
|
isReportUrban: this.bar.isReportUrban,
|
isPublicity: this.bar.isPublicity,
|
createBegin: this.bar.time[0],
|
createEnd: this.bar.time[1],
|
pageNum: this.paged.page,
|
pageSize: this.paged.limit,
|
isReportDpc: this.bar.isReportDpc,
|
addType:this.addType
|
};
|
|
this.$api.post("communityactivity/pageeasyphoto", params, e => {
|
this.paged.total = e.total;
|
this.paged.r++;
|
this.tds = e.records || [];
|
this.tds.map(item => {
|
let disabled = true;
|
if (
|
item.status === 4 &&
|
item.activityId &&
|
item.activityAmount == null
|
) {
|
disabled = false;
|
}
|
this.$set(item, "che", false);
|
this.$set(item, "disabled", disabled);
|
});
|
e.records.map((item, index) => {
|
item.index = (this.paged.page - 1) * this.paged.limit + index + 1;
|
});
|
});
|
},
|
|
getStatistics() {
|
this.$api.get("communityactivity/pageeasyphoto/statistics", {addType:this.addType}, e => {
|
for (let key in e) {
|
this.list.map(item => {
|
if (key === item.key) {
|
item.num = e[key];
|
}
|
if (key === item.keyTwo) {
|
item.day = e[key];
|
}
|
});
|
}
|
});
|
}
|
},
|
mounted() {
|
// this.bar[2].list = this.is_level(-1);
|
this.getStatistics();
|
this.typeList();
|
}
|
};
|
</script>
|
<style lang="less" scoped>
|
.h1 {
|
font-size: 18px;
|
height: 40px;
|
line-height: 40px;
|
}
|
.item {
|
width: 200px;
|
display: flex;
|
align-items: center;
|
.label {
|
}
|
}
|
.amount-text {
|
width: 100%;
|
text-align: center;
|
display: block;
|
}
|
.page_clap {
|
overflow-y: auto;
|
.tab {
|
margin-bottom: 10px;
|
}
|
.header {
|
padding-top: 25px;
|
}
|
}
|
</style>
|
