jiangyy
3 years ago
11 changed files with 4105 additions and 119 deletions
@ -1,151 +1,249 @@ |
|||
<template> |
|||
<div> |
|||
<el-row> |
|||
<el-col> |
|||
<div class="top-con"> |
|||
<div class="top" v-for="item in top" :key="item">{{ item }}</div> |
|||
</div> |
|||
<!-- 日历号 --> |
|||
<div class="date-con"> |
|||
<div |
|||
class="date" |
|||
:class="[item.thisMonth, item.isToday, item.afterToday]" |
|||
v-for="(item, index) in visibleCalendar" |
|||
:key="index" |
|||
> |
|||
<div>{{ item.day }}</div> |
|||
<div class="morning">张三，李四</div> |
|||
<div class="evening">王五，赵六</div> |
|||
</div> |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
<div class="m-calendar"> |
|||
<div class="top-list"> |
|||
<div class="top" |
|||
v-for="(item, index) in top" |
|||
:class="{ 'z-weekend': index > 4 }" |
|||
:key="item"> |
|||
{{ item }} |
|||
</div> |
|||
</div> |
|||
<!-- 日历号 --> |
|||
<div class="date-list"> |
|||
<div class="date-item" |
|||
:class="{ |
|||
'z-on': item.format == currentDate, |
|||
'z-this-month': item.thisMonth, |
|||
'z-today': item.isToday, |
|||
'z-after-today': item.afterToday, |
|||
'z-weekend': item.day == 6 || item.day == 0, |
|||
}" |
|||
v-for="(item, index) in visibleCalendar" |
|||
:key="index" |
|||
@click="handleClickDate(item)"> |
|||
<div class="date">{{ item.date }}</div> |
|||
<slot name="date-item" |
|||
v-bind:item="item" |
|||
v-bind:index="index"></slot> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props: { |
|||
time: { |
|||
type: Object, |
|||
default: () => { |
|||
return { |
|||
year: new Date().getFullYear(), |
|||
month: new Date().getMonth(), |
|||
}; |
|||
}, |
|||
currentYear: { |
|||
type: Number, |
|||
default: new Date().getFullYear(), |
|||
}, |
|||
currentMonth: { |
|||
type: Number, |
|||
default: new Date().getMonth(), |
|||
}, |
|||
}, |
|||
data() { |
|||
data () { |
|||
return { |
|||
top: ["一", "二", "三", "四", "五", "六", "日"], |
|||
currentDate: "", |
|||
}; |
|||
}, |
|||
created() { |
|||
console.log("123", this.time); |
|||
}, |
|||
methods: { |
|||
// 获取 |
|||
}, |
|||
computed: { |
|||
// 获取当前月份显示日历,共42天 |
|||
visibleCalendar() { |
|||
visibleCalendar () { |
|||
// 获取今天的年月日 |
|||
const { currentYear, currentMonth } = this; |
|||
const today = new Date(); |
|||
today.setHours(0); |
|||
today.setMinutes(0); |
|||
today.setSeconds(0); |
|||
today.setMilliseconds(0); |
|||
|
|||
const calendarArr = []; |
|||
// 获取当前月份第一天 |
|||
const currentFirstDay = new Date(this.time.year, this.time.month, 1); |
|||
const currentFirstDay = new Date(currentYear, currentMonth, 1); |
|||
// 获取第一天是周几 |
|||
const weekDay = currentFirstDay.getDay(); |
|||
// 用当前月份第一天减去周几前面几天，就是看见的日历的第一天 |
|||
const startDay = currentFirstDay - (weekDay - 1) * 24 * 3600 * 1000; |
|||
const startDay = |
|||
currentFirstDay - ((weekDay == 0 ? 7 : weekDay) - 1) * 24 * 3600 * 1000; |
|||
|
|||
// 我们统一用42天来显示当前显示日历 |
|||
let calendarArr = []; |
|||
for (let i = 0; i < 42; i++) { |
|||
const date = new Date(startDay + i * 24 * 3600 * 1000); |
|||
const dateObj = new Date(startDay + i * 24 * 3600 * 1000); |
|||
const year = dateObj.getFullYear(); |
|||
const month = dateObj.getMonth(); |
|||
const monthShow = ("0" + (month + 1)).substr(-2); |
|||
const date = dateObj.getDate(); |
|||
const dateShow = ("0" + date).substr(-2); |
|||
const day = dateObj.getDay(); |
|||
|
|||
calendarArr.push({ |
|||
date: new Date(startDay + i * 24 * 3600 * 1000), |
|||
year: date.getFullYear(), |
|||
month: date.getMonth(), |
|||
day: date.getDate(), |
|||
date, |
|||
year, |
|||
month, |
|||
day, |
|||
dayFormat: [ |
|||
"星期日", |
|||
"星期一", |
|||
"星期二", |
|||
"星期三", |
|||
"星期四", |
|||
"星期五", |
|||
"星期六", |
|||
][day], |
|||
format: `${year}-${monthShow}-${dateShow}`, |
|||
dateId: `${year}${monthShow}${dateShow}`, |
|||
// 是否在当月 |
|||
thisMonth: |
|||
date.getFullYear() === today.getFullYear() && |
|||
date.getMonth() === today.getMonth() |
|||
? "thisMonth" |
|||
: "", |
|||
thisMonth: year == currentYear && month == currentMonth, |
|||
// 是否是今天 |
|||
isToday: |
|||
date.getFullYear() === today.getFullYear() && |
|||
date.getMonth() === today.getMonth() && |
|||
date.getDate() === today.getDate() |
|||
? "isToday" |
|||
: "", |
|||
year === today.getFullYear() && |
|||
month === today.getMonth() && |
|||
date === today.getDate(), |
|||
// 是否在今天之后 |
|||
afterToday: date.getTime() >= today.getTime() ? "afterToday" : "", |
|||
afterToday: dateObj.getTime() >= today.getTime(), |
|||
}); |
|||
} |
|||
|
|||
this.$emit("rangeChange", calendarArr); |
|||
return calendarArr; |
|||
}, |
|||
}, |
|||
watch: { |
|||
visibleCalendar () { |
|||
this.init(); |
|||
}, |
|||
}, |
|||
mounted () { |
|||
console.log("123", this.time); |
|||
this.init(); |
|||
}, |
|||
methods: { |
|||
init () { |
|||
if (!this.currentDate) { |
|||
this.handleClickDate( |
|||
this.visibleCalendar.find((item) => item.isToday) || |
|||
this.visibleCalendar.filter((item) => item.thisMonth)[0] |
|||
); |
|||
} |
|||
}, |
|||
|
|||
handleClickDate (item) { |
|||
console.log("点击日历日期", item); |
|||
this.currentDate = item.format; |
|||
|
|||
this.$emit("clickDate", item); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.top-con { |
|||
display: flex; |
|||
align-items: center; |
|||
.top { |
|||
width: 14.285%; |
|||
background-color: rgb(242, 242, 242); |
|||
padding: 10px 0; |
|||
margin: 5px; |
|||
text-align: center; |
|||
.m-calendar { |
|||
position: relative; |
|||
color: #333333; |
|||
|
|||
&::after { |
|||
content: ""; |
|||
z-index: 1; |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
border-left: 1px solid #eee; |
|||
border-top: 1px solid #eee; |
|||
pointer-events: none; |
|||
} |
|||
} |
|||
.date-con { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
.date { |
|||
width: 14.285%; |
|||
text-align: center; |
|||
padding: 5px; |
|||
.morning { |
|||
padding: 10px 0; |
|||
background-color: rgba(220, 245, 253, 0.3); |
|||
} |
|||
.evening { |
|||
|
|||
.top-list { |
|||
display: flex; |
|||
align-items: center; |
|||
.top { |
|||
position: relative; |
|||
width: 14.285%; |
|||
padding: 10px 0; |
|||
background-color: rgba(220, 244, 209, 0.3); |
|||
} |
|||
} |
|||
.thisMonth { |
|||
.morning { |
|||
background-color: rgb(220, 245, 253); |
|||
} |
|||
.evening { |
|||
background-color: rgb(220, 244, 209); |
|||
text-align: center; |
|||
background-color: #ffffff; |
|||
|
|||
&::after { |
|||
content: ""; |
|||
z-index: 1; |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
border-right: 1px solid #eee; |
|||
pointer-events: none; |
|||
border-bottom: 1px solid #eee; |
|||
} |
|||
|
|||
&.z-weekend { |
|||
color: #ff3333; |
|||
} |
|||
} |
|||
} |
|||
.isToday { |
|||
font-weight: 700; |
|||
.morning { |
|||
background-color: rgb(169, 225, 243); |
|||
} |
|||
.evening { |
|||
background-color: rgb(193, 233, 175); |
|||
.date-list { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
align-items: center; |
|||
|
|||
.date-item { |
|||
position: relative; |
|||
width: 14.285%; |
|||
text-align: center; |
|||
box-sizing: border-box; |
|||
padding: 8px 0; |
|||
height: 90px; |
|||
background-color: #ffffff; |
|||
opacity: 0.4; |
|||
|
|||
&::after { |
|||
content: ""; |
|||
position: absolute; |
|||
z-index: 1; |
|||
top: 0; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
border-right: 1px solid #eee; |
|||
border-bottom: 1px solid #eee; |
|||
pointer-events: none; |
|||
} |
|||
|
|||
.date { |
|||
margin-bottom: 5px; |
|||
line-height: 30px; |
|||
font-size: 16px; |
|||
} |
|||
|
|||
&.z-on { |
|||
z-index: 21; |
|||
box-shadow: 0 0 15px 5px #a8cee0; |
|||
.date { |
|||
font-size: 20px; |
|||
font-weight: bold; |
|||
} |
|||
} |
|||
|
|||
&.z-this-month { |
|||
opacity: 1; |
|||
} |
|||
|
|||
&.z-today { |
|||
.date { |
|||
font-weight: 700; |
|||
} |
|||
} |
|||
|
|||
&.z-weekend { |
|||
.date { |
|||
color: #ff3333; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
.tip-con { |
|||
margin-top: 51px; |
|||
.tip { |
|||
margin-top: 21px; |
|||
width: 100%; |
|||
} |
|||
} |
|||
</style> |
|||
|
|||
@ -0,0 +1,932 @@ |
|||
<template> |
|||
<div> |
|||
<div v-if="showType === 'list'" |
|||
class="g-cnt"> |
|||
<el-row :gutter="15"> |
|||
<el-col :span="6"> |
|||
<div class="m-sizer"> |
|||
<div class="item"> |
|||
<el-cascader class="customer_cascader" |
|||
ref="myCascader" |
|||
size="small" |
|||
v-model="fmData.orgId" |
|||
:options="partyOptions" |
|||
:props="partyOptionsProps" |
|||
:show-all-levels="false" |
|||
@change="handleChangeParty"></el-cascader> |
|||
</div> |
|||
<div class="item"> |
|||
<el-radio v-model="fmData.isSelf" |
|||
label="1">本人创建的活动</el-radio> |
|||
<el-radio v-model="fmData.isSelf" |
|||
label="0">本组织所有活动</el-radio> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="m-date"> |
|||
<div class="date-top"> |
|||
{{ currentDate.year }}年{{ currentDate.month + 1 }}月 |
|||
</div> |
|||
<div class="date-big">{{ currentDate.date }}</div> |
|||
<div class="date-week">{{ currentDate.dayFormat }}</div> |
|||
</div> |
|||
|
|||
<div class="m-list" |
|||
v-if=" |
|||
currentDateData.activityList.length > 0 || |
|||
currentDateData.scheduleList.length > 0 |
|||
"> |
|||
<div class="list-title">今日活动/日程</div> |
|||
<div class="list"> |
|||
<div class="item" |
|||
:key="item.activityId" |
|||
v-for="item in currentDateData.activityList"> |
|||
<div class="item-title"> |
|||
{{ item.theme }} |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>活动类型：</span> |
|||
<span>{{ item.actTypeName }}</span> |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>开始时间：</span> |
|||
<span>{{ item.holdTime }}</span> |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>活动地点：</span> |
|||
<span>{{ item.address }}</span> |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>参加组织：</span> |
|||
<span>{{ item.joinOrgs.join("、") }}</span> |
|||
</div> |
|||
<div v-if="item.isMe" |
|||
class="item-ope"> |
|||
<el-button type="primary" |
|||
size="mini" |
|||
@click="handleClickHuodong('publish', item)">发布</el-button> |
|||
<el-button type="success" |
|||
size="mini" |
|||
@click="handleClickHuodong('edit', item)">编辑</el-button> |
|||
<el-button size="mini" |
|||
@click="handleClickHuodong('del', item)">删除</el-button> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="item" |
|||
:key="item.scheduleId" |
|||
v-for="item in currentDateData.scheduleList"> |
|||
<div class="item-title"> |
|||
{{ item.title }} |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>提醒时间：</span> |
|||
<span>{{ item.remindTime }}</span> |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>备注说明：</span> |
|||
<span>{{ item.remark }}</span> |
|||
</div> |
|||
<div class="item-ope"> |
|||
<el-button type="success" |
|||
size="mini" |
|||
@click="handleClickRicheng('edit', item)">编辑</el-button> |
|||
<el-button size="mini" |
|||
@click="handleClickRicheng('del', item)">删除</el-button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="m-ope"> |
|||
<el-button type="warning" |
|||
style="width: 48%" |
|||
@click="addHudong">添加活动计划</el-button> |
|||
<el-button style="width: 48%" |
|||
@click="addRicheng">添加日程</el-button> |
|||
</div> |
|||
</el-col> |
|||
|
|||
<el-col :span="18"> |
|||
<div class="m-cal"> |
|||
<div class="hd"> |
|||
<div class="hd-year"> |
|||
<el-date-picker v-model="currentYearStr" |
|||
value-format="yyyy" |
|||
type="year" |
|||
placeholder="选择年" |
|||
size="small" |
|||
style="width: 150px"> |
|||
</el-date-picker> |
|||
</div> |
|||
<div class="hd-month"> |
|||
<div class="month-item" |
|||
:class="{ 'z-on': m - 1 == currentMonth }" |
|||
:key="'month' + m" |
|||
@click="currentMonth = m - 1" |
|||
v-for="m in 12"> |
|||
<el-badge :value="monthData[m-1]" |
|||
:hidden="monthData[m-1] == 0" |
|||
class="item"> |
|||
<div class="month-text">{{ m }}月</div> |
|||
</el-badge> |
|||
</div> |
|||
</div> |
|||
<div class="hd-btn"> |
|||
<el-button type="primary" |
|||
size="small" |
|||
@click="handleAddYearPlan">生成年度活动计划</el-button> |
|||
</div> |
|||
</div> |
|||
<calendar :currentYear="currentYear" |
|||
:currentMonth="currentMonth" |
|||
@rangeChange="handleRangeChange" |
|||
@clickDate="handleChangeDate"> |
|||
<template v-slot:date-item="{ item, index }"> |
|||
<div class="tip" |
|||
v-if=" |
|||
rangeData[item.dateId] && |
|||
rangeData[item.dateId].activityList.length > 0 |
|||
"> |
|||
<div class="tip-num" |
|||
v-if="rangeData[item.dateId].activityList.length > 1"> |
|||
{{ rangeData[item.dateId].activityList.length }} |
|||
</div> |
|||
|
|||
<div class="tip-text"> |
|||
<span class="z-on"> |
|||
{{ rangeData[item.dateId].activityList[0].actTypeName }}</span> |
|||
{{ |
|||
rangeData[item.dateId].activityList[0].isPublish==='0' |
|||
? "(未发布)" |
|||
: "(已发布)" |
|||
}} |
|||
</div> |
|||
<div class="tip-cnt"> |
|||
{{ rangeData[item.dateId].activityList[0].topic }} |
|||
</div> |
|||
|
|||
<div class="all-list" |
|||
:class="computeAllListClass(index)"> |
|||
<div class="item" |
|||
:key="item.activityId" |
|||
v-for="item in rangeData[item.dateId].activityList"> |
|||
<div class="item-title"> |
|||
{{ item.theme }} |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>活动类型：</span> |
|||
<span>{{ item.actTypeName }}</span> |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>开始时间：</span> |
|||
<span>{{ item.holdTime }}</span> |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>活动地点：</span> |
|||
<span>{{ item.address }}</span> |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>参加组织：</span> |
|||
<span>{{ item.joinOrgs.join("、") }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="corn" |
|||
v-if=" |
|||
rangeData[item.dateId] && |
|||
rangeData[item.dateId].scheduleList.length > 0 |
|||
"> |
|||
<div class="corn-num"> |
|||
{{ rangeData[item.dateId].scheduleList.length }} |
|||
</div> |
|||
<div class="corn-text">日程</div> |
|||
|
|||
<div class="all-list" |
|||
:class="computeAllListClass(index)"> |
|||
<div class="item" |
|||
:key="item.scheduleId" |
|||
v-for="item in rangeData[item.dateId].scheduleList"> |
|||
<div class="item-title"> |
|||
{{ item.title }} |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>提醒时间：</span> |
|||
<span>{{ item.remindTime }}</span> |
|||
</div> |
|||
<div class="item-prop"> |
|||
<span>备注说明：</span> |
|||
<span>{{ item.remark }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
</calendar> |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
|
|||
<div v-if="showType === 'yearplan'"> |
|||
<yearplan-list :currentYearStr="currentYearStr" |
|||
@handleOk="handleAddPlanOk" |
|||
@handleClose="handleAddPlanClose"></yearplan-list> |
|||
</div> |
|||
|
|||
<el-dialog v-if="showAdd" |
|||
:visible.sync="showAdd" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="addDiaTitle" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showAdd = false"> |
|||
<add-activity ref="ref_add_form" |
|||
:formType="formType" |
|||
:icPartyActId="icPartyActId" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose"></add-activity> |
|||
</el-dialog> |
|||
|
|||
<el-dialog v-if="showSchedule" |
|||
:visible.sync="showSchedule" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="scheduleDiaTitle" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showSchedule = false"> |
|||
<schedule-form ref="ref_schedule_form" |
|||
:formType="formType" |
|||
:scheduleId="scheduleId" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose"> |
|||
</schedule-form> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost, requestGet } from "@/js/dai/request"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import calendar from "./cpts/calendar"; |
|||
import yearplanList from "../orgActivity/activivityList/yearplanList"; |
|||
import addActivity from "../orgActivity/activivityList/addActivity"; |
|||
import scheduleForm from "../orgActivity/activivityList/scheduleForm"; |
|||
|
|||
function doAfter (fn) { |
|||
return new Promise(async (resolve) => { |
|||
while (!fn()) { |
|||
await nextTick(100); |
|||
} |
|||
resolve(); |
|||
}); |
|||
} |
|||
|
|||
export default { |
|||
name: "party-calendar", |
|||
components: { |
|||
calendar, |
|||
yearplanList, |
|||
addActivity, |
|||
scheduleForm, |
|||
}, |
|||
data () { |
|||
let todayObj = new Date(); |
|||
|
|||
return { |
|||
currentYearStr: todayObj.getFullYear() + "", |
|||
currentMonth: todayObj.getMonth(), |
|||
currentDate: { |
|||
year: "", |
|||
month: "", |
|||
date: "", |
|||
day: "", |
|||
}, |
|||
|
|||
currentDateData: { |
|||
scheduleList: [], |
|||
activityList: [], |
|||
}, |
|||
|
|||
monthData: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], |
|||
|
|||
rangeDateList: [], |
|||
rangeData: {}, |
|||
|
|||
partyOptions: [], |
|||
partyOptionsProps: { |
|||
multiple: false, |
|||
value: "id", |
|||
label: "partyOrgName", |
|||
children: "children", |
|||
checkStrictly: true, |
|||
emitPath: false, |
|||
}, |
|||
|
|||
fmData: { |
|||
orgId: "", |
|||
isSelf: "1", |
|||
yearId: "", |
|||
}, |
|||
|
|||
showAdd: false, |
|||
formType: "add", |
|||
addDiaTitle: "添加活动计划", |
|||
showSchedule: false, |
|||
scheduleDiaTitle: "添加日程提醒", |
|||
showType: "list", |
|||
|
|||
icPartyActId: "", |
|||
scheduleId: "", |
|||
}; |
|||
}, |
|||
computed: { |
|||
currentYear () { |
|||
return parseInt(this.currentYearStr); |
|||
}, |
|||
apiParams () { |
|||
const { currentYear, fmData } = this; |
|||
return { |
|||
yearId: currentYear, |
|||
orgId: fmData.orgId, |
|||
isSelf: fmData.isSelf, |
|||
}; |
|||
}, |
|||
}, |
|||
watch: { |
|||
"fmData.orgId": function (val) { |
|||
console.log("orgId", val); |
|||
this.getCurrentDateData(); |
|||
this.getRangeData(); |
|||
}, |
|||
"fmData.isSelf": function (val) { |
|||
console.log("isSelf", val); |
|||
this.getCurrentDateData(); |
|||
this.getRangeData(); |
|||
}, |
|||
currentYear: function (val) { |
|||
console.log("watch--currentYear", val); |
|||
this.getMonthData(); |
|||
}, |
|||
}, |
|||
async mounted () { |
|||
await this.getPartyOptions(); |
|||
this.getMonthData(); |
|||
}, |
|||
methods: { |
|||
// 添加活动 |
|||
addHudong () { |
|||
this.icPartyActId = ""; |
|||
this.addDiaTitle = "新增活动计划"; |
|||
this.formType = "add"; |
|||
this.showAdd = true; |
|||
}, |
|||
|
|||
// 添加日程 |
|||
addRicheng () { |
|||
this.formType = "schedule"; |
|||
this.scheduleId = '' |
|||
this.showSchedule = true; |
|||
}, |
|||
|
|||
// 点击活动操作 |
|||
handleClickHuodong (type, item) { |
|||
console.log(type, item); |
|||
this.icPartyActId = item.activityId; |
|||
|
|||
if (type == "publish") { |
|||
// 发布 |
|||
this.$confirm("确认发布活动?", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.publishActivity(); |
|||
}) |
|||
.catch((err) => { |
|||
if (err == "cancel") { |
|||
// this.$message({ |
|||
// type: "info", |
|||
// message: "已取消发布" |
|||
// }); |
|||
} |
|||
}); |
|||
} else if (type == "edit") { |
|||
// 编辑 |
|||
this.addDiaTitle = "修改活动计划"; |
|||
this.formType = "edit"; |
|||
this.showAdd = true; |
|||
} else if (type == "del") { |
|||
// 删除 |
|||
this.$confirm("活动删除后不可恢复，您确定要删除吗？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.cancelActivity(); |
|||
}) |
|||
.catch((err) => { |
|||
if (err == "cancel") { |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
|
|||
async publishActivity () { |
|||
const url = `/resi/partymember/icPartyAct/publish/${this.icPartyActId}`; |
|||
|
|||
const { data, code, msg } = await requestPost(url, {}); |
|||
|
|||
if (code === 0) { |
|||
this.$message.success("发布成功！"); |
|||
this.refreshData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
|
|||
async cancelActivity () { |
|||
const url = "/resi/partymember/icPartyAct/del"; |
|||
|
|||
let params = []; |
|||
params.push(this.icPartyActId); |
|||
|
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
if (code === 0) { |
|||
this.$message.success("删除成功！"); |
|||
this.refreshData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
|
|||
// 点击日程操作 |
|||
handleClickRicheng (type, item) { |
|||
console.log(type, item); |
|||
this.scheduleId = item.scheduleId; |
|||
if (type == "edit") { |
|||
// 编辑 |
|||
this.scheduleDiaTitle = "修改日程提醒"; |
|||
this.formType = "schedule"; |
|||
this.showSchedule = true; |
|||
} else if (type == "del") { |
|||
// 删除 |
|||
this.$confirm("日程提醒删除后不可恢复，您确定要删除吗？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.cancelSchedule(); |
|||
}) |
|||
.catch((err) => { |
|||
if (err == "cancel") { |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
|
|||
async cancelSchedule () { |
|||
const url = "/resi/partymember/icSchedule/del"; |
|||
|
|||
let params = []; |
|||
params.push(this.scheduleId); |
|||
|
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
if (code === 0) { |
|||
this.$message.success("删除成功！"); |
|||
this.refreshData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
|
|||
//刷新日历 |
|||
refreshData () { |
|||
this.getMonthData(); |
|||
this.getRangeData(); |
|||
this.getCurrentDateData(); |
|||
}, |
|||
|
|||
handleChangeParty () { }, |
|||
|
|||
handleChangeDate (item) { |
|||
console.log("handleChangeDate"); |
|||
this.currentYearStr = item.year + ""; |
|||
this.currentMonth = item.month; |
|||
this.currentDate = { ...item }; |
|||
|
|||
this.getCurrentDateData(); |
|||
}, |
|||
|
|||
computeAllListClass (index) { |
|||
let x = index % 7; |
|||
let y = Math.floor(index / 7); |
|||
if (x < 3) { |
|||
if (y < 3) { |
|||
return "z-top-left"; |
|||
} else { |
|||
return "z-bottom-left"; |
|||
} |
|||
} else { |
|||
if (y < 3) { |
|||
return "z-top-right"; |
|||
} else { |
|||
return "z-bottom-right"; |
|||
} |
|||
} |
|||
}, |
|||
|
|||
handleRangeChange (arr) { |
|||
this.rangeDateList = arr; |
|||
this.getRangeData(); |
|||
}, |
|||
|
|||
async getRangeData () { |
|||
const arr = this.rangeDateList; |
|||
const url = "/resi/partymember/icPartyAct/homeSearch"; |
|||
|
|||
if (!this.apiParams.orgId || arr.length == 0) return; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
...this.apiParams, |
|||
startDate: arr[0].dateId, |
|||
endDate: arr[arr.length - 1].dateId, |
|||
}); |
|||
if (code === 0) { |
|||
if (Array.isArray(data)) { |
|||
let rangeData = {}; |
|||
arr.forEach((item) => { |
|||
rangeData[item.dateId] = { |
|||
...item, |
|||
scheduleTotal: 0, |
|||
activityTotal: 0, |
|||
scheduleList: [], |
|||
activityList: [], |
|||
}; |
|||
let curr = data.find((val) => val.dateId == item.dateId); |
|||
if (curr) { |
|||
rangeData[item.dateId].scheduleList = curr.scheduleList; |
|||
rangeData[item.dateId].activityList = curr.activityList; |
|||
rangeData[item.dateId].scheduleTotal = curr.scheduleTotal; |
|||
rangeData[item.dateId].activityTotal = curr.activityTotal; |
|||
} |
|||
}); |
|||
this.rangeData = rangeData; |
|||
console.log("rangeData", this.rangeData); |
|||
} |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
async getMonthData () { |
|||
const url = "/resi/partymember/icPartyAct/homeMonthTotal"; |
|||
|
|||
if (!this.apiParams.orgId) return; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
...this.apiParams, |
|||
}); |
|||
if (code === 0) { |
|||
if (Array.isArray(data)) { |
|||
data.forEach((item, index) => { |
|||
this.monthData[index] = parseInt(item.count); |
|||
}); |
|||
console.log("--------------monthData", this.monthData); |
|||
} |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
async getCurrentDateData () { |
|||
const url = "/resi/partymember/icPartyAct/actAndScheduleList"; |
|||
|
|||
if (!this.apiParams.orgId) return; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
...this.apiParams, |
|||
dateId: this.currentDate.dateId, |
|||
}); |
|||
if (code === 0) { |
|||
this.currentDateData.scheduleList = data.scheduleList || []; |
|||
this.currentDateData.activityList = data.activityList || []; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
async getPartyOptions () { |
|||
const url = "/resi/partymember/icPartyOrg/getSearchTreelist"; |
|||
let params = { |
|||
customerId: localStorage.getItem("customerId"), |
|||
agencyId: localStorage.getItem("agencyId"), |
|||
}; |
|||
|
|||
const { data, code, msg } = await requestGet(url, params); |
|||
if (code === 0) { |
|||
if (Array.isArray(data) && data.length > 0) { |
|||
this.partyOptions = data; |
|||
this.fmData.orgId = data[0].id; |
|||
} |
|||
} else { |
|||
} |
|||
}, |
|||
|
|||
handleAddYearPlan () { |
|||
this.showType = "yearplan"; |
|||
}, |
|||
|
|||
handleAddPlanOk () { |
|||
this.showType = "list"; |
|||
this.refreshData(); |
|||
}, |
|||
handleAddPlanClose () { |
|||
this.showType = "list"; |
|||
}, |
|||
|
|||
handleClose () { |
|||
this.formType = ""; |
|||
this.showAdd = false; |
|||
this.showSchedule = false; |
|||
}, |
|||
|
|||
handleOk () { |
|||
this.handleClose(); |
|||
this.refreshData(); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/c/config.scss"; |
|||
@import "@/assets/scss/c/function.scss"; |
|||
|
|||
$blue: #3e8ef7; |
|||
$red: #f33; |
|||
|
|||
.g-cnt { |
|||
background-color: #ffffff; |
|||
padding: 20px; |
|||
} |
|||
.m-cal { |
|||
.hd { |
|||
display: flex; |
|||
margin-bottom: 20px; |
|||
|
|||
.hd-month { |
|||
display: flex; |
|||
|
|||
.month-item { |
|||
position: relative; |
|||
margin-left: 10px; |
|||
|
|||
/deep/ .el-badge__content { |
|||
z-index: 1; |
|||
} |
|||
|
|||
&.z-on { |
|||
.month-text { |
|||
background-color: $blue; |
|||
color: #ffffff; |
|||
} |
|||
} |
|||
.month-text { |
|||
position: relative; |
|||
z-index: 0; |
|||
width: 40px; |
|||
height: 30px; |
|||
text-align: center; |
|||
background-color: #eeeeee; |
|||
border-radius: 8px; |
|||
line-height: 30px; |
|||
font-size: 14px; |
|||
cursor: pointer; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.hd-btn { |
|||
margin-left: auto; |
|||
} |
|||
} |
|||
|
|||
.all-list { |
|||
position: absolute; |
|||
z-index: 100; |
|||
padding: 0 10px; |
|||
width: 300px; |
|||
max-height: 200px; |
|||
overflow-y: auto; |
|||
background-color: rgba(#ffffff, 0.9); |
|||
box-shadow: 0 0 10px 3px rgba(#000, 0.1); |
|||
text-align: left; |
|||
color: #999; |
|||
transition: all ease 0.13s; |
|||
transform: scale(0); |
|||
|
|||
&.z-top-left { |
|||
right: -300px; |
|||
top: 0; |
|||
} |
|||
&.z-top-right { |
|||
left: -300px; |
|||
top: 0; |
|||
} |
|||
&.z-bottom-left { |
|||
right: -300px; |
|||
bottom: 0; |
|||
} |
|||
&.z-bottom-right { |
|||
left: -300px; |
|||
bottom: 0; |
|||
} |
|||
.item { |
|||
padding: 10px 0; |
|||
border-top: 1px dashed rgba(#000, 0.2); |
|||
&:first-child { |
|||
border-top: none; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.tip { |
|||
position: relative; |
|||
margin: 0 3px; |
|||
padding: 3px 2px 3px 12px; |
|||
line-height: 16px; |
|||
box-shadow: 0 0 5px 1px #eee; |
|||
background-color: #ffffff; |
|||
font-size: 12px; |
|||
border-radius: 4px; |
|||
cursor: pointer; |
|||
color: #999999; |
|||
|
|||
&:hover { |
|||
.all-list { |
|||
transform: scale(1); |
|||
} |
|||
} |
|||
.tip-num { |
|||
position: absolute; |
|||
z-index: 10; |
|||
top: -7px; |
|||
right: -7px; |
|||
border-radius: 100%; |
|||
width: 14px; |
|||
height: 14px; |
|||
line-height: 14px; |
|||
text-align: center; |
|||
font-size: 10px; |
|||
text-align: center; |
|||
color: #ffffff; |
|||
background-color: #f1ba06; |
|||
} |
|||
.z-on { |
|||
color: $red; |
|||
} |
|||
.tip-text { |
|||
@include toe; |
|||
text-align: left; |
|||
} |
|||
.tip-cnt { |
|||
@include toe; |
|||
text-align: left; |
|||
font-size: 10px; |
|||
} |
|||
|
|||
&::before { |
|||
position: absolute; |
|||
content: ""; |
|||
left: 4px; |
|||
top: 0; |
|||
bottom: 0; |
|||
margin: auto; |
|||
display: block; |
|||
width: 4px; |
|||
height: 4px; |
|||
border-radius: 100%; |
|||
background-color: $red; |
|||
} |
|||
} |
|||
|
|||
.corn { |
|||
position: absolute; |
|||
right: 0; |
|||
top: 0; |
|||
color: #ffffff; |
|||
cursor: pointer; |
|||
|
|||
&:hover { |
|||
.all-list { |
|||
transform: scale(1); |
|||
} |
|||
} |
|||
.corn-num { |
|||
position: absolute; |
|||
z-index: 10; |
|||
top: -7px; |
|||
right: -7px; |
|||
border-radius: 100%; |
|||
width: 14px; |
|||
height: 14px; |
|||
line-height: 14px; |
|||
text-align: center; |
|||
font-size: 10px; |
|||
text-align: center; |
|||
color: #ffffff; |
|||
background-color: #f1ba06; |
|||
} |
|||
.corn-text { |
|||
position: relative; |
|||
z-index: 1; |
|||
font-size: 12px; |
|||
line-height: 18px; |
|||
padding-right: 3px; |
|||
} |
|||
|
|||
&::before { |
|||
content: ""; |
|||
display: block; |
|||
position: absolute; |
|||
z-index: 0; |
|||
top: 0; |
|||
right: 0; |
|||
width: 0px; |
|||
height: 0; |
|||
border-top: 17px solid #f33; |
|||
border-right: 25px solid #f33; |
|||
border-bottom: 17px solid transparent; |
|||
border-left: 25px solid transparent; |
|||
} |
|||
} |
|||
} |
|||
.m-sizer { |
|||
.item { |
|||
margin-bottom: 10px; |
|||
} |
|||
} |
|||
|
|||
.m-date { |
|||
text-align: center; |
|||
color: $blue; |
|||
line-height: 1.5; |
|||
background-color: #f3f4f5; |
|||
padding: 20px; |
|||
.date-top { |
|||
font-size: 24px; |
|||
} |
|||
.date-big { |
|||
font-size: 100px; |
|||
} |
|||
.date-week { |
|||
font-size: 24px; |
|||
} |
|||
} |
|||
|
|||
.m-list { |
|||
margin-top: 20px; |
|||
.list-title { |
|||
width: 100px; |
|||
text-align: center; |
|||
line-height: 24px; |
|||
background-color: $red; |
|||
color: #ffffff; |
|||
} |
|||
.list { |
|||
.item { |
|||
border-top: 1px solid #eee; |
|||
padding: 10px 0; |
|||
line-height: 1.5; |
|||
overflow: hidden; |
|||
.item-title { |
|||
font-weight: bold; |
|||
} |
|||
.item-prop { |
|||
margin: 4px 0; |
|||
} |
|||
|
|||
.item-ope { |
|||
margin-top: 10px; |
|||
float: right; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
.m-ope { |
|||
margin-top: 40px; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,741 @@ |
|||
<template> |
|||
<div class="div_main"> |
|||
<div v-if="showType==='list'"> |
|||
<div class="div_search"> |
|||
<el-form :inline="true" |
|||
:model="formData" |
|||
ref="ref_searchform" |
|||
:label-width="'80px'"> |
|||
<div> |
|||
|
|||
<el-form-item label="所属组织" |
|||
prop="publishPartyOrgId"> |
|||
<el-cascader class="customer_cascader" |
|||
ref="myCascader" |
|||
size="small" |
|||
v-model="agencyIdArray" |
|||
:options="orgOptions" |
|||
:props="orgOptionProps" |
|||
:show-all-levels="false" |
|||
@change="handleChangeAgency"></el-cascader> |
|||
</el-form-item> |
|||
<el-form-item label="活动类型" |
|||
prop="actType"> |
|||
<el-select v-model="formData.actType" |
|||
placeholder="请选择" |
|||
size="small" |
|||
clearable |
|||
class="item_width_2"> |
|||
<el-option v-for="item in categrayArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="举办时间" |
|||
prop="startDate"> |
|||
<el-date-picker v-model="formData.startDate" |
|||
class="item_width_2" |
|||
size="small" |
|||
type="date" |
|||
value-format="yyyyMMdd" |
|||
format="yyyy-MM-dd" |
|||
placeholder="开始时间"> |
|||
</el-date-picker> |
|||
<span class="data-tag">至</span> |
|||
<el-date-picker v-model="formData.endDate" |
|||
:picker-options="endPickerOptions" |
|||
class="item_width_2 data-tag" |
|||
size="small" |
|||
type="date" |
|||
value-format="yyyyMMdd" |
|||
format="yyyy-MM-dd" |
|||
placeholder="结束时间"> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
<el-form-item label="活动地点" |
|||
prop="address"> |
|||
<el-input v-model="formData.address" |
|||
class="item_width_2" |
|||
size="small" |
|||
clearable |
|||
placeholder="请输入"> |
|||
</el-input> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="活动主题" |
|||
prop="topic"> |
|||
<el-input v-model="formData.topic" |
|||
class="item_width_2" |
|||
size="small" |
|||
clearable |
|||
placeholder="请输入"> |
|||
</el-input> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="发布状态" |
|||
prop="isPublish"> |
|||
<el-select class="item_width_2" |
|||
v-model="formData.isPublish" |
|||
placeholder="全部" |
|||
size="small" |
|||
clearable> |
|||
<el-option v-for="item in statusArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
|
|||
</el-form-item> |
|||
|
|||
<el-button style="margin-left:30px" |
|||
size="small" |
|||
class="diy-button--search" |
|||
@click="handleSearch">查询</el-button> |
|||
<el-button style="margin-left:10px" |
|||
size="small" |
|||
class="diy-button--reset" |
|||
@click="resetSearch">重置</el-button> |
|||
</div> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="div_table"> |
|||
|
|||
<div class="div_btn"> |
|||
<el-button class="diy-button--add" |
|||
size="small" |
|||
@click="handleAdd">新增活动计划</el-button> |
|||
<el-button class="diy-button--add" |
|||
size="small" |
|||
@click="handleAddYearPlan">生成年度活动计划</el-button> |
|||
<el-button class="diy-button--add" |
|||
size="small" |
|||
@click="handleAddSchedule">添加日程提醒</el-button> |
|||
<el-button style="float:left;margin-left:10px" |
|||
class="diy-button--delete" |
|||
size="small" |
|||
@click="deleteBatch">批量删除</el-button> |
|||
<el-button @click="handleExport" |
|||
class="diy-button--reset" |
|||
size="small">导出</el-button> |
|||
</div> |
|||
|
|||
<el-table :data="tableData" |
|||
border |
|||
v-loading="tableLoading" |
|||
:header-cell-style="{background:'#2195FE',color:'#FFFFFF'}" |
|||
class="table" |
|||
style="width: 100%" |
|||
@select-all="selectAll" |
|||
@selection-change="selectionChange" |
|||
:height="maxTableHeight"> |
|||
<el-table-column type="selection" |
|||
width="55"> |
|||
</el-table-column> |
|||
<el-table-column label="序号" |
|||
fixed="left" |
|||
type="index" |
|||
align="center" |
|||
width="50" /> |
|||
|
|||
<el-table-column prop="topic" |
|||
align="center" |
|||
min-width="150" |
|||
label="活动主题" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="publishPartyOrgName" |
|||
label="所属组织" |
|||
align="center" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="actTypeName" |
|||
align="center" |
|||
width="150" |
|||
label="会议类型" |
|||
:show-overflow-tooltip="true"> |
|||
|
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="holdTime" |
|||
align="center" |
|||
width="150" |
|||
label="开始时间" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
<el-table-column prop="address" |
|||
align="center" |
|||
width="110" |
|||
label="活动地点" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
<el-table-column prop="isPublish" |
|||
align="center" |
|||
width="80" |
|||
label="发布状态" |
|||
:show-overflow-tooltip="true"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="scope.row.isPublish == '1'">已发布</span> |
|||
<span v-if="scope.row.isPublish == '0'">未发布</span> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column fixed="right" |
|||
label="操作" |
|||
align="center" |
|||
width="180"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click="handleDetail(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class=".div-table-button--detail">查看</el-button> |
|||
<el-button v-if="scope.row.isPublish == '0' && user.id===scope.row.publishStaffId" |
|||
@click="handlePublish(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class=".div-table-button--detail">发布</el-button> |
|||
<!-- <el-button @click="handleEdit(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class="div-table-button--edit">修改</el-button> --> |
|||
<el-button v-if="user.id===scope.row.publishStaffId" |
|||
@click="handleEdit(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class="div-table-button--edit">修改</el-button> |
|||
|
|||
<!-- <el-button @click="handleDel(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class="div-table-button--delete">删除</el-button> --> |
|||
<el-button v-if="user.id===scope.row.publishStaffId" |
|||
@click="handleDel(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class="div-table-button--delete">删除</el-button> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<div> |
|||
<el-pagination @size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page.sync="pageNo" |
|||
:page-sizes="[20, 50, 100, 200]" |
|||
:page-size="parseInt(pageSize)" |
|||
layout="sizes, prev, pager, next, total" |
|||
:total="total"> |
|||
</el-pagination> |
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
</div> |
|||
<el-dialog v-if="showAdd" |
|||
:visible.sync="showAdd" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="addDiaTitle" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showAdd = false"> |
|||
<add-activity ref="ref_add_form" |
|||
:formType="formType" |
|||
:icPartyActId="icPartyActId" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose"></add-activity> |
|||
</el-dialog> |
|||
<el-dialog v-if="showSchedule" |
|||
:visible.sync="showSchedule" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="'添加日程提醒'" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showSchedule = false"> |
|||
<schedule-form ref="ref_schedule_form" |
|||
:formType="formType" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose"> |
|||
</schedule-form> |
|||
</el-dialog> |
|||
|
|||
<div v-if="showType==='yearplan'"> |
|||
<yearplan-list @handleOk="handleAddPlanOk" |
|||
@handleClose="handleAddPlanClose"></yearplan-list> |
|||
</div> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost, requestGet } from "@/js/dai/request"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import { mapGetters } from "vuex"; |
|||
// import eventInfo from "./cpts/event-info"; |
|||
import axios from "axios"; |
|||
import addActivity from "./addActivity"; |
|||
import scheduleForm from "./scheduleForm"; |
|||
import yearplanList from "./yearplanList"; |
|||
|
|||
|
|||
export default { |
|||
components: { addActivity, scheduleForm, yearplanList }, |
|||
|
|||
data () { |
|||
let endDisabledDate = (time) => {//这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键 |
|||
let nowData = Date.now() |
|||
|
|||
if (this.formData.startDate) { |
|||
let startDate = new Date(this.formData.startDate) |
|||
return time.getTime() < startDate || time.getTime() === startDate |
|||
} |
|||
|
|||
} |
|||
let startDisabledDate = (time) => {//这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键 |
|||
let nowData = Date.now() |
|||
return time.getTime() > nowData |
|||
} |
|||
|
|||
return { |
|||
tableLoading: false, |
|||
user: {}, |
|||
agencyId: '', |
|||
|
|||
tableData: [], |
|||
categrayArray: [], |
|||
statusArray: [ |
|||
{ |
|||
value: "0", |
|||
label: "未发布", |
|||
}, |
|||
{ |
|||
value: "1", |
|||
label: "已发布", |
|||
}, |
|||
], |
|||
|
|||
formData: { |
|||
publishPartyOrgId: '',//发布活动党组织；所属党组织 |
|||
actType: '',//活动类型 |
|||
startDate: '',//活动开始时间20220817 |
|||
endDate: '',//活动结束时间20220817 |
|||
isPublish: '',//活动状态。0未完成；1:已完成 |
|||
address: '', |
|||
topic: '', |
|||
|
|||
}, |
|||
pageNo: 1, |
|||
pageSize: window.localStorage.getItem("pageSize") || 20, |
|||
total: 1, |
|||
endPickerOptions: { |
|||
disabledDate: endDisabledDate |
|||
}, |
|||
// startPickerOptions: { |
|||
// disabledDate: startDisabledDate |
|||
// }, |
|||
|
|||
|
|||
orgOptions: [], |
|||
orgOptionProps: { |
|||
multiple: false, |
|||
value: 'id', |
|||
label: 'partyOrgName', |
|||
children: 'children', |
|||
checkStrictly: true |
|||
}, |
|||
agencyIdArray: [], |
|||
|
|||
showAdd: false, |
|||
formType: 'add', |
|||
addDiaTitle: '添加活动计划', |
|||
showSchedule: false, |
|||
showType: 'list', |
|||
|
|||
icPartyActId: '', |
|||
selection: [] |
|||
}; |
|||
}, |
|||
computed: { |
|||
maxTableHeight () { |
|||
return this.$store.state.inIframe |
|||
? this.clientHeight - 410 + this.iframeHeigh |
|||
: this.clientHeight - 410; |
|||
}, |
|||
...mapGetters(["clientHeight", "iframeHeight"]), |
|||
}, |
|||
watch: { |
|||
|
|||
}, |
|||
mounted () { |
|||
console.log(this.$store.state) |
|||
this.user = this.$store.state.user |
|||
this.agencyId = this.user.agencyId |
|||
this.getOrgTreeList() |
|||
this.getCategrayList() |
|||
this.getTableData(); |
|||
}, |
|||
methods: { |
|||
|
|||
async getOrgTreeList () { |
|||
|
|||
const url = '/resi/partymember/icPartyOrg/getSearchTreelist' |
|||
let params = { |
|||
customerId: localStorage.getItem('customerId'), |
|||
agencyId: localStorage.getItem('agencyId') |
|||
}; |
|||
|
|||
const { data, code, msg } = await requestGet(url, params); |
|||
console.log('data-orgparty----o', data) |
|||
if (code === 0) { |
|||
|
|||
this.orgOptions = data |
|||
|
|||
} else { |
|||
} |
|||
|
|||
|
|||
}, |
|||
|
|||
handleChangeAgency (val) { |
|||
|
|||
let obj = this.$refs["myCascader"].getCheckedNodes()[0].data |
|||
if (obj) { |
|||
this.formData.publishPartyOrgId = obj.id |
|||
} else { |
|||
this.formData.publishPartyOrgId = '' |
|||
} |
|||
|
|||
}, |
|||
handleAddYearPlan () { |
|||
this.showType = 'yearplan' |
|||
}, |
|||
|
|||
handleAddPlanOk () { |
|||
this.showType = 'list' |
|||
}, |
|||
handleAddPlanClose () { |
|||
this.showType = 'list' |
|||
}, |
|||
|
|||
handleAddSchedule () { |
|||
|
|||
this.formType = 'schedule' |
|||
this.showSchedule = true; |
|||
}, |
|||
|
|||
handleSearch (val) { |
|||
console.log(this.formData); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
// 字典 |
|||
async getCategrayList () { |
|||
const url = "/resi/partymember/icPartyAct/acttypelist" |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/acttypelist" |
|||
|
|||
let params = {} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.categrayArray = data |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
|
|||
async handleAdd () { |
|||
this.icPartyActId = '' |
|||
this.addDiaTitle = '新增活动计划' |
|||
this.formType = 'add' |
|||
this.showAdd = true; |
|||
}, |
|||
|
|||
async handlePublish (row) { |
|||
this.icPartyActId = row.icPartyActId |
|||
|
|||
this.$confirm("确认发布活动?", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning" |
|||
}) |
|||
.then(() => { |
|||
this.publishActivity() |
|||
}) |
|||
.catch(err => { |
|||
if (err == "cancel") { |
|||
// this.$message({ |
|||
// type: "info", |
|||
// message: "已取消发布" |
|||
// }); |
|||
} |
|||
|
|||
}); |
|||
|
|||
}, |
|||
|
|||
async publishActivity () { |
|||
|
|||
const url = `/resi/partymember/icPartyAct/publish/${this.icPartyActId}`; |
|||
// const url = `http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/publish/${this.icPartyActId}`; |
|||
|
|||
|
|||
const { data, code, msg } = await requestPost(url, {}); |
|||
|
|||
if (code === 0) { |
|||
this.$message.success("发布成功！"); |
|||
this.getTableData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
|
|||
|
|||
async handleDetail (row) { |
|||
this.icPartyActId = row.icPartyActId |
|||
this.addDiaTitle = '查看活动计划' |
|||
this.formType = 'detail' |
|||
this.showAdd = true |
|||
|
|||
}, |
|||
async handleEdit (row) { |
|||
this.icPartyActId = row.icPartyActId |
|||
this.addDiaTitle = '修改活动计划' |
|||
this.formType = 'edit' |
|||
this.showAdd = true |
|||
|
|||
}, |
|||
|
|||
|
|||
handleClose () { |
|||
this.formType = '' |
|||
|
|||
this.showAdd = false |
|||
this.showSchedule = false |
|||
}, |
|||
|
|||
handleOk () { |
|||
this.handleClose() |
|||
this.pageNo = 1 |
|||
this.getTableData() |
|||
|
|||
}, |
|||
|
|||
|
|||
async handleDel (row) { |
|||
|
|||
this.icPartyActId = row.icPartyActId |
|||
|
|||
this.$confirm("活动删除后不可恢复，您确定要删除吗？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning" |
|||
}) |
|||
.then(() => { |
|||
this.cancelActivity() |
|||
}) |
|||
.catch(err => { |
|||
if (err == "cancel") { |
|||
// this.$message({ |
|||
// type: "info", |
|||
// message: "已取消删除" |
|||
// }); |
|||
} |
|||
|
|||
}); |
|||
|
|||
}, |
|||
|
|||
async cancelActivity () { |
|||
|
|||
const url = "/resi/partymember/icPartyAct/del"; |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/del"; |
|||
let params = [] |
|||
params.push(this.icPartyActId) |
|||
|
|||
|
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
if (code === 0) { |
|||
this.$message.success("删除成功！"); |
|||
this.getTableData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
|
|||
selectAll (selection) { |
|||
this.selection = selection |
|||
|
|||
}, |
|||
selectionChange (selection) { |
|||
this.selection = selection |
|||
|
|||
}, |
|||
|
|||
deleteBatch () { |
|||
if (this.selection.length > 0) { |
|||
this.$confirm("确认删除选择的活动?", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning" |
|||
}) |
|||
.then(() => { |
|||
this.deleteActBatch() |
|||
}) |
|||
.catch(err => { |
|||
if (err == "cancel") { |
|||
// this.$message({ |
|||
// type: "info", |
|||
// message: "已取消删除" |
|||
// }); |
|||
} |
|||
|
|||
}); |
|||
} else { |
|||
this.$message.warning('请先选择要删除的活动') |
|||
} |
|||
}, |
|||
|
|||
async deleteActBatch () { |
|||
let params = [] |
|||
this.selection.forEach(element => { |
|||
|
|||
params.push(element.icPartyActId) |
|||
}); |
|||
|
|||
const url = "/resi/partymember/icPartyAct/del"; |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/del"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.$message.success("删除成功！"); |
|||
this.getTableData(); |
|||
} else { |
|||
this.$message.error('操作失败！') |
|||
} |
|||
}, |
|||
|
|||
async getTableData () { |
|||
this.tableLoading = true |
|||
const url = "/resi/partymember/icPartyAct/page-list"; |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/page-list"; |
|||
const { pageSize, pageNo, formData } = this; |
|||
const { data, code, msg } = await requestPost(url, { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}); |
|||
|
|||
this.tableLoading = false |
|||
if (code === 0) { |
|||
|
|||
this.total = data.total || 0; |
|||
this.tableData = data.list |
|||
? data.list.map((item) => { |
|||
return item; |
|||
}) |
|||
: []; |
|||
|
|||
this.tableData.forEach(item => { |
|||
if (item.operationType === '2') { |
|||
item.operationTypeShow = '已转需求' |
|||
} |
|||
if (item.operationType === '1') { |
|||
item.operationTypeShow = '已立项' |
|||
} |
|||
if (item.operationType === '0') { |
|||
item.operationTypeShow = '已回复' |
|||
} |
|||
|
|||
}); |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
async handleExport () { |
|||
const url = "/resi/partymember/icPartyAct/export-act"; |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/export-act"; |
|||
const { pageSize, pageNo, formData } = this; |
|||
axios({ |
|||
url: window.SITE_CONFIG["apiURL"] + url, |
|||
method: "post", |
|||
data: { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}, |
|||
responseType: "blob", |
|||
}) |
|||
.then((res) => { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { type: "application/vnd.ms-excel" }); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
}) |
|||
.catch((err) => { |
|||
console.log("获取导出情失败", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
handleSizeChange (val) { |
|||
|
|||
this.pageSize = val; |
|||
window.localStorage.setItem("pageSize", val); |
|||
this.getTableData(); |
|||
}, |
|||
handleCurrentChange (val) { |
|||
|
|||
this.pageNo = val; |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
resetSearch () { |
|||
this.agencyIdArray = [] |
|||
this.formData = { |
|||
publishPartyOrgId: '',//发布活动党组织；所属党组织 |
|||
actType: '',//活动类型 |
|||
startDate: '',//活动开始时间20220817 |
|||
endDate: '',//活动结束时间20220817 |
|||
isPublish: '',//活动状态。 |
|||
address: '', |
|||
topic: '', |
|||
} |
|||
|
|||
|
|||
this.pageNo = 1 |
|||
// this.getTableData() |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/buttonstyle.scss"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
|||
</style> |
|||
@ -0,0 +1,686 @@ |
|||
<template> |
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
|
|||
<el-form ref="ref_form" |
|||
:inline="true" |
|||
:model="formData" |
|||
:rules="dataRule" |
|||
:disabled="formType==='detail'" |
|||
class="div_form"> |
|||
|
|||
<el-form-item label="活动类型" |
|||
label-width="150px" |
|||
prop="actType"> |
|||
<el-select v-model="formData.actType" |
|||
placeholder="请选择" |
|||
clearable |
|||
class="item_width_1"> |
|||
<el-option v-for="(item) in categrayArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="举办活动时间" |
|||
style="display: block" |
|||
prop="holdTime" |
|||
label-width="150px"> |
|||
<el-date-picker v-model="formData.holdTime" |
|||
value-format="yyyy-MM-dd HH:mm:ss" |
|||
format="yyyy-MM-dd HH:mm:ss" |
|||
type="datetime" |
|||
placeholder="选择时间"> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="活动主题" |
|||
prop="topic" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<el-input class="item_width_1" |
|||
placeholder="请输入活动主题" |
|||
v-model="formData.topic"> |
|||
</el-input> |
|||
</el-form-item> |
|||
<el-form-item label="活动地点" |
|||
prop="address" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<el-input class="item_width_1" |
|||
placeholder="请输入活动地点" |
|||
v-model="formData.address"> |
|||
</el-input> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="自动发布时间" |
|||
prop="autoPublicType" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<el-select class="item_width_1" |
|||
v-model="formData.autoPublicType" |
|||
placeholder="请选择" |
|||
filterable |
|||
clearable> |
|||
<el-option v-for="item in autoTimeArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
|
|||
</el-form-item> |
|||
|
|||
<el-form-item label="发布活动党组织" |
|||
prop="publichIdArray" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<div v-if="formType==='detail'" |
|||
class="item_width_1">{{formData.publishPartyOrgName}}</div> |
|||
<el-cascader v-else |
|||
class="item_width_1" |
|||
ref="myCascader" |
|||
v-model="formData.publichIdArray" |
|||
:key="iscascaderShow" |
|||
:options="publishOptions" |
|||
:props="publichOptionProps" |
|||
:show-all-levels="false" |
|||
@change="handleChangeScope"></el-cascader> |
|||
</el-form-item> |
|||
<el-form-item label="参加活动党组织" |
|||
prop="joinIdArray" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<div v-if="formType==='detail'" |
|||
class="item_width_1">{{formData.joinNames}}</div> |
|||
<el-cascader v-else |
|||
class="item_width_1" |
|||
ref="myCascader_join" |
|||
v-model="formData.joinIdArray" |
|||
:key="joinIscascaderShow" |
|||
:options="joinOptions" |
|||
:props="joinOptionProps" |
|||
:show-all-levels="false" |
|||
@change="handleChangeJoinOrg"></el-cascader> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="参加人员" |
|||
prop="joinUserType" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<el-select class="item_width_1" |
|||
v-model="formData.joinUserType" |
|||
placeholder="请选择" |
|||
filterable |
|||
clearable> |
|||
<el-option v-for="item in joinArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
|
|||
</el-form-item> |
|||
|
|||
<el-form-item label="自动通知参加人员" |
|||
prop="isAutoInform" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<el-checkbox :label="'是'" |
|||
v-model="isAutoInform"></el-checkbox> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="活动介绍" |
|||
prop="introduce" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<el-input class="item_width_1" |
|||
type="textarea" |
|||
maxlength="1000" |
|||
show-word-limit |
|||
:rows="3" |
|||
placeholder="请输入活动介绍，不超过1000字" |
|||
v-model="formData.introduce"></el-input> |
|||
</el-form-item> |
|||
|
|||
<el-form-item class="block" |
|||
label="附件" |
|||
label-width="150px" |
|||
prop="attach"> |
|||
<el-upload class="upload-demo" |
|||
:action="uploadUlr" |
|||
accept=".doc,.pdf,.xls,.docx,.xlsx,.jpg,.png,.jpeg,.bmp,.mp4,.wma,.m4a,.mp3" |
|||
:on-success="handleFileSuccess" |
|||
:on-remove="handleFileRemove" |
|||
:limit="3" |
|||
:before-upload="beforeUpload" |
|||
:file-list="fileList"> |
|||
<el-button size="small" |
|||
:disabled="fileList.length===3" |
|||
type="primary">点击上传</el-button> |
|||
<div slot="tip" |
|||
class="el-upload__tip">支持图片、word、pdf</div> |
|||
</el-upload> |
|||
</el-form-item> |
|||
|
|||
</el-form> |
|||
|
|||
</div> |
|||
|
|||
<div class="div_btn"> |
|||
<el-button size="small" |
|||
@click="handleCancle">取 消</el-button> |
|||
<el-button size="small" |
|||
type="primary" |
|||
:disabled="btnDisable" |
|||
@click="handleComfirm">确 定</el-button> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from 'vuex' |
|||
import { Loading } from 'element-ui' // 引入Loading服务 |
|||
import { requestPost, requestGet } from '@/js/dai/request' |
|||
|
|||
|
|||
let loading // 加载动画 |
|||
export default { |
|||
data () { |
|||
return { |
|||
btnDisable: false, |
|||
publishOptions: [], |
|||
|
|||
iscascaderShow: 0, |
|||
publichOptionProps: { |
|||
multiple: false, |
|||
value: 'id', |
|||
label: 'partyOrgName', |
|||
children: 'children', |
|||
checkStrictly: true |
|||
}, |
|||
|
|||
joinOptions: [], |
|||
|
|||
joinIscascaderShow: 0, |
|||
joinOptionProps: { |
|||
multiple: true, |
|||
value: 'id', |
|||
label: 'partyOrgName', |
|||
children: 'children', |
|||
checkStrictly: false |
|||
}, |
|||
|
|||
categrayArray: [], |
|||
|
|||
formData: { |
|||
icPartyActId: '',//编辑活动时必传 |
|||
actType: '',// 活动类型，来源于活动类型接口value |
|||
holdYearId: '',//活动开始时间所属年份：yyyy |
|||
holdMonthId: '',//活动开始时间所属月份：yyyyMM |
|||
holdTime: '',//活动开始时间：yyyy-MM-dd HH:mm:ss |
|||
topic: '',// 活动主题 |
|||
address: '',// 活动地址 |
|||
latitude: '',//活动地点纬度 |
|||
longitude: '',// 活动地点经度 |
|||
autoPublicType: '',//自动发布时间key; 来源于字典表接口 |
|||
publishPartyOrgId: '',// 发布活动党组织id |
|||
publishPartyOrgName: '',// 发布活动党组织名称 |
|||
publishOrgPid: '',// 参加活动党组织ID的上级节点 |
|||
publishOrgType: '',//党组织类型 0省委,1市委,2区委,3党工委,4党委,5支部；6党小组 |
|||
publishOrgPathShow: '',//PUBLISH_PARTY_ORG_ID的全路径，包含自身。方便前端回显 |
|||
joinUserType: '',//参加人员类型，0：全体党员；1：支部委员 |
|||
isAutoInform: '',// 是否自动通知参加人员，0否；1是 |
|||
introduce: '',// 活动介绍 |
|||
joinOrgList: [], |
|||
attachmentList: [], |
|||
joinIdArray: [], |
|||
publichIdArray: [], |
|||
|
|||
}, |
|||
isAutoInform: false, |
|||
|
|||
autoTimeArray: [], |
|||
|
|||
joinArray: [//参加人员 |
|||
{ |
|||
value: '0', |
|||
label: '全体党员' |
|||
}, |
|||
{ |
|||
value: '1', |
|||
label: '支部委员' |
|||
}, |
|||
], |
|||
|
|||
fileList: [], |
|||
uploadUlr: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadvariedfile', |
|||
|
|||
} |
|||
}, |
|||
|
|||
watch: { |
|||
"formData.holdTime": function (val) { |
|||
let array = val.split('-') |
|||
this.formData.holdYearId = array[0] |
|||
this.formData.holdMonthId = array[0] + array[1] |
|||
} |
|||
}, |
|||
components: {}, |
|||
async mounted () { |
|||
this.startLoading() |
|||
await this.getCategrayList() |
|||
await this.getAutoTimeArray() |
|||
await this.getOrgTreeList() |
|||
await this.getJoinOrgTreeList() |
|||
|
|||
if (this.icPartyActId) { |
|||
await this.loadInfo() |
|||
|
|||
} else { |
|||
this.$refs.ref_form.resetFields(); |
|||
} |
|||
|
|||
this.endLoading() |
|||
|
|||
}, |
|||
|
|||
methods: { |
|||
|
|||
handleChangeScope (value) { |
|||
|
|||
let obj = this.$refs["myCascader"].getCheckedNodes()[0].data |
|||
|
|||
if (obj) { |
|||
this.formData.publishPartyOrgId = obj.id//发布活动党组织id |
|||
this.formData.publishPartyOrgName = obj.partyOrgName//发布活动党组织名称 |
|||
this.formData.publishOrgPid = obj.pid//发布活动党组织ID的上级节点 |
|||
this.formData.publishOrgType = obj.partyOrgType//党组织类型 0省委,1市委,2区委,3党工委,4党委,5支部；6党小组 |
|||
this.formData.publishOrgPathShow = value.join(':')//PUBLISH_PARTY_ORG_ID的全路径，包含自身。方便前端回显 |
|||
} else { |
|||
this.formData.publishPartyOrgId = '' |
|||
this.formData.publishPartyOrgName = '' |
|||
this.formData.publishOrgPid = '' |
|||
this.formData.publishOrgType = '' |
|||
this.formData.publishOrgPathShow = '' |
|||
} |
|||
}, |
|||
|
|||
handleChangeJoinOrg (value) { |
|||
console.log('value', value) |
|||
console.log('joinIdArray', this.formData.joinIdArray) |
|||
this.formData.joinOrgList = [] |
|||
let selArray = this.$refs["myCascader_join"].getCheckedNodes() |
|||
|
|||
console.log('selArray', selArray) |
|||
|
|||
selArray.forEach((element, index) => { |
|||
|
|||
let obj = { |
|||
joinOrgId: element.data.id, |
|||
orgType: element.data.partyOrgType, |
|||
pid: element.data.pid, |
|||
joinOrgPathShow: element.path.join(':'), |
|||
joinOrgName: element.data.partyOrgName, |
|||
} |
|||
this.formData.joinOrgList.push(obj) |
|||
}); |
|||
|
|||
}, |
|||
|
|||
async handleComfirm () { |
|||
|
|||
this.btnDisable = true |
|||
setTimeout(() => { |
|||
this.btnDisable = false |
|||
}, 10000) |
|||
this.$refs['ref_form'].validate((valid, messageObj) => { |
|||
if (!valid) { |
|||
// app.util.validateRule(messageObj) |
|||
this.btnDisable = false |
|||
} else { |
|||
this.addActivity() |
|||
|
|||
} |
|||
|
|||
}) |
|||
|
|||
}, |
|||
|
|||
async addActivity () { |
|||
// debugger |
|||
|
|||
if (this.isAutoInform) { |
|||
this.formData.isAutoInform = '1' |
|||
} else { |
|||
this.formData.isAutoInform = '0' |
|||
} |
|||
this.formData.attachmentList = [...this.fileList] |
|||
|
|||
|
|||
if (this.formType === 'add') { |
|||
this.formData.icPartyActId = '' |
|||
} |
|||
console.log(this.formData) |
|||
const url = '/resi/partymember/icPartyAct/addOrUpdate' |
|||
// const url = 'http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/addOrUpdate' |
|||
let params = { |
|||
|
|||
...this.formData |
|||
} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.$message.success('操作成功') |
|||
this.resetData() |
|||
this.$emit('handleOk') |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
async loadInfo () { |
|||
const url = `/resi/partymember/icPartyAct/act-detail/${this.icPartyActId}`; |
|||
// const url = `http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/act-detail/${this.icPartyActId}`; |
|||
|
|||
let params = {} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.formData = { ...data } |
|||
this.formData.publichIdArray = [] |
|||
if (data.publishOrgPathShow) { |
|||
this.formData.publichIdArray = data.publishOrgPathShow.split(':') |
|||
} |
|||
|
|||
this.formData.joinIdArray = [] |
|||
this.formData.joinNames = '' |
|||
data.joinOrgList.forEach(element => { |
|||
if (element.joinOrgPathShow) { |
|||
this.formData.joinIdArray.push(element.joinOrgPathShow.split(':')) |
|||
} |
|||
|
|||
this.formData.joinNames = this.formData.joinNames + element.joinOrgName + ',' |
|||
|
|||
}); |
|||
|
|||
if (this.formData.joinNames) { |
|||
this.formData.joinNames = this.formData.joinNames.substring(0, this.formData.joinNames.length - 1) |
|||
} |
|||
this.isAutoInform = this.formData.isAutoInform == '1' |
|||
|
|||
this.fileList = [... this.formData.attachmentList] |
|||
|
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
// 活动类型 |
|||
async getCategrayList () { |
|||
const url = "/resi/partymember/icPartyAct/acttypelist" |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/acttypelist" |
|||
|
|||
let params = {} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.categrayArray = data |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
// 自动发布时间 |
|||
async getAutoTimeArray () { |
|||
const url = "/sys/dict/data/dictlist" |
|||
|
|||
let params = { |
|||
dictType: 'icpartyact_auto_publish_time' |
|||
} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.autoTimeArray = data |
|||
|
|||
this.autoTimeArray.forEach(element => { |
|||
element.value = parseInt(element.value) |
|||
}); |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
async getOrgTreeList () { |
|||
|
|||
const url = '/resi/partymember/icPartyOrg/getSearchTreelist' |
|||
let params = { |
|||
customerId: localStorage.getItem('customerId'), |
|||
agencyId: localStorage.getItem('agencyId') |
|||
}; |
|||
|
|||
const { data, code, msg } = await requestGet(url, params); |
|||
console.log('data-orgparty----o', data) |
|||
if (code === 0) { |
|||
|
|||
this.publishOptions = data |
|||
this.joinOptions = data |
|||
this.changeKey(this.joinOptions) |
|||
|
|||
} else { |
|||
} |
|||
|
|||
|
|||
}, |
|||
|
|||
changeKey (arr) { |
|||
for (var i = 0; i < arr.length; i++) { |
|||
arr[i].value = arr[i].userId |
|||
arr[i].label = arr[i].userName |
|||
if (arr[i].children.length) { |
|||
this.changeKey(arr[i].children) |
|||
} else { |
|||
delete arr[i].children |
|||
} |
|||
} |
|||
}, |
|||
|
|||
//加载组织 |
|||
async getJoinOrgTreeList () { |
|||
const url = '/resi/partymember/icPartyOrg/getOrgTreeHaveGroup' |
|||
// const url = 'http://yapi.elinkservice.cn/mock/245/heart/icServiceOrg/selectlist' |
|||
let params = { |
|||
agencyId: localStorage.getItem('agencyId') |
|||
|
|||
} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
// this.joinOptions = data |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
|
|||
beforeUpload (file) { |
|||
const array = file.name.split('.') |
|||
const extension = array[array.length - 1] |
|||
|
|||
const formatarray = ['jpg', 'png', 'jpeg', 'bmp', 'mp4', 'wma', 'm4a', 'mp3', 'doc', 'docx', 'xls', 'xlsx', 'pdf'] |
|||
|
|||
if (formatarray.indexOf(extension) === -1) { |
|||
this.$message.error('只支持图片、word、pdf') |
|||
return false |
|||
} |
|||
|
|||
}, |
|||
|
|||
handleFileRemove (file) { |
|||
|
|||
if (file && file.status === "success") { |
|||
this.fileList.splice(this.fileList.findIndex(item => item.uid === file.uid), 1) |
|||
} |
|||
}, |
|||
|
|||
handleFileSuccess (res, file) { |
|||
|
|||
if (res.code === 0 && res.msg === 'success') { |
|||
const array = file.name.split('.') |
|||
const fileType = array[array.length - 1] |
|||
|
|||
const picArray = ['jpg', 'png', 'jpeg', 'bmp'] |
|||
const videoarray = ['mp4', 'wma', 'm4a'] |
|||
const docArray = ['doc', 'docx', 'xls', 'xlsx', 'pdf'] |
|||
const mp3Array = ['mp3'] |
|||
|
|||
if (picArray.indexOf(fileType) > -1) { |
|||
file.format = 'image' |
|||
} else if (videoarray.indexOf(fileType) > -1) { |
|||
file.format = 'video' |
|||
} else if (docArray.indexOf(fileType) > -1) { |
|||
file.format = 'doc' |
|||
} else if (mp3Array.indexOf(fileType) > -1) { |
|||
file.format = 'voice' |
|||
} |
|||
|
|||
file.url = res.data.url |
|||
file.type = fileType |
|||
|
|||
// file.attachmentName = file.name |
|||
// file.attachmentType = file.type |
|||
// file.attachmentUrl = file.url |
|||
file.format = file.attachmentFormat |
|||
|
|||
|
|||
this.fileList.push(file) |
|||
console.log(this.fileList) |
|||
} else this.$message.error(res.msg) |
|||
}, |
|||
|
|||
//下载 |
|||
handleFileDownload (file) { |
|||
|
|||
var a = document.createElement('a'); |
|||
var event = new MouseEvent('click'); |
|||
a.download = file.name; |
|||
console.log(a) |
|||
a.href = file.url; |
|||
a.dispatchEvent(event); |
|||
|
|||
|
|||
}, |
|||
handleCancle () { |
|||
this.resetData() |
|||
this.$emit('handleClose') |
|||
|
|||
}, |
|||
|
|||
|
|||
|
|||
resetData () { |
|||
|
|||
this.formData = { |
|||
icPartyActId: '',//编辑活动时必传 |
|||
actType: '',// 活动类型，来源于活动类型接口value |
|||
holdYearId: '',//活动开始时间所属年份：yyyy |
|||
holdMonthId: '',//活动开始时间所属月份：yyyyMM |
|||
holdTime: '',//活动开始时间：yyyy-MM-dd HH:mm:ss |
|||
topic: '',// 活动主题 |
|||
address: '',// 活动地址 |
|||
latitude: '',//活动地点纬度 |
|||
longitude: '',// 活动地点经度 |
|||
autoPublicType: '',//自动发布时间key; 来源于字典表接口 |
|||
publishPartyOrgId: '',// 发布活动党组织id |
|||
publishPartyOrgName: '',// 发布活动党组织名称 |
|||
publishOrgPid: '',// 参加活动党组织ID的上级节点 |
|||
publishOrgType: '',//党组织类型 0省委,1市委,2区委,3党工委,4党委,5支部；6党小组 |
|||
publishOrgPathShow: '',//PUBLISH_PARTY_ORG_ID的全路径，包含自身。方便前端回显 |
|||
joinUserType: '',//参加人员类型，0：全体党员；1：支部委员 |
|||
isAutoInform: '',// 是否自动通知参加人员，0否；1是 |
|||
introduce: '',// 活动介绍 |
|||
joinOrgList: [], |
|||
attachmentList: [], |
|||
joinIdArray: [], |
|||
publichIdArray: [] |
|||
|
|||
} |
|||
|
|||
}, |
|||
// 开启加载动画 |
|||
startLoading () { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: '正在加载……', // 加载中需要显示的文字 |
|||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|||
}) |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading () { |
|||
// clearTimeout(timer); |
|||
if (loading) { |
|||
loading.close() |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
dataRule () { |
|||
return { |
|||
|
|||
actType: [ |
|||
{ required: true, message: '活动类型不能为空', trigger: 'change' }, |
|||
], |
|||
holdTime: [ |
|||
{ required: true, message: '活动举办时间不能为空', trigger: 'change' } |
|||
], |
|||
|
|||
topic: [ |
|||
{ required: true, message: '活动主题不能为空', trigger: 'change' } |
|||
], |
|||
address: [ |
|||
{ required: true, message: '活动地点不能为空', trigger: 'change' } |
|||
], |
|||
autoPublicType: [ |
|||
{ required: true, message: '自动发布时间不能为空', trigger: 'change' } |
|||
], |
|||
joinUserType: [ |
|||
{ required: true, message: '参加人员不能为空', trigger: 'change' } |
|||
], |
|||
joinIdArray: [ |
|||
{ required: true, message: '参加活动党组织不能为空', trigger: 'change' } |
|||
], |
|||
publichIdArray: [ |
|||
{ required: true, message: '发布活动党组织不能为空', trigger: 'change' } |
|||
], |
|||
|
|||
} |
|||
}, |
|||
|
|||
|
|||
}, |
|||
props: { |
|||
|
|||
formType: { //表单操作类型 add新增，edit编辑，detail详情 |
|||
type: String, |
|||
required: '' |
|||
}, |
|||
icPartyActId: { |
|||
type: String, |
|||
required: '' |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style lang="scss" scoped > |
|||
@import "@/assets/scss/modules/management/form-main.scss"; |
|||
</style> |
|||
@ -0,0 +1,729 @@ |
|||
<template> |
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
<div style="margin-left:20px"> |
|||
<div class="div_search"> |
|||
<span>选择活动类型</span> |
|||
|
|||
<el-select style="margin-left:30px" |
|||
class="item_width_1" |
|||
v-model="actType" |
|||
placeholder="全部" |
|||
size="small" |
|||
clearable> |
|||
<el-option v-for="(item,index) in actTypeArray" |
|||
@click.native="handleClickActType(index)" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
|
|||
<el-button size="small" |
|||
class="diy-button--add" |
|||
style="margin-left:50px" |
|||
@click="handleAdd">新增</el-button> |
|||
|
|||
</div> |
|||
<div class="div_search"> |
|||
<span>活动举办频次</span> |
|||
<span style="margin-left:30px">{{selActType.frequencyDesc?selActType.frequencyDesc:'--'}}</span> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="div_table"> |
|||
|
|||
<el-table class="table" |
|||
:data="tableData" |
|||
border |
|||
:height="tableHeight" |
|||
v-loading="tableLoading" |
|||
:header-cell-style="{background:'#2195FE',color:'#FFFFFF'}" |
|||
style="width: 100%"> |
|||
<el-table-column label="序号" |
|||
header-align="center" |
|||
align="center" |
|||
type="index" |
|||
width="50"> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="holdTime" |
|||
header-align="center" |
|||
align="center" |
|||
label="举办活动时间" |
|||
width="200"> |
|||
<template slot-scope="scope"> |
|||
|
|||
<el-date-picker v-model="scope.row.holdTime" |
|||
style="width: 175px" |
|||
size="small" |
|||
format="yyyy-MM-dd hh:mm:ss" |
|||
value-format="yyyy-MM-dd hh:mm:ss" |
|||
type="datetime" |
|||
placeholder="选择日期"> |
|||
</el-date-picker> |
|||
|
|||
</template> |
|||
|
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="address" |
|||
header-align="center" |
|||
align="center" |
|||
label="活动地点" |
|||
width="220"> |
|||
<template slot-scope="scope"> |
|||
|
|||
<el-input v-model="scope.row.address" |
|||
style="width: 195px" |
|||
size="small" |
|||
placeholder="输入地点"> |
|||
</el-input> |
|||
|
|||
</template> |
|||
|
|||
</el-table-column> |
|||
<el-table-column prop="topic" |
|||
header-align="center" |
|||
align="center" |
|||
label="活动主题" |
|||
min-width="220"> |
|||
<template slot-scope="scope"> |
|||
|
|||
<el-input v-model="scope.row.topic" |
|||
style="width: 195px" |
|||
size="small" |
|||
placeholder="输入主题"> |
|||
</el-input> |
|||
|
|||
</template> |
|||
|
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="scopeId" |
|||
header-align="center" |
|||
align="center" |
|||
label="发布活动党组织" |
|||
width="220"> |
|||
|
|||
<template slot-scope="scope"> |
|||
|
|||
<el-cascader class="item_width_1" |
|||
:ref="'myCascader'+scope.$index" |
|||
v-model="scope.row.publichIdArray" |
|||
:key="iscascaderShow" |
|||
:options="publishOptions" |
|||
:props="publichOptionProps" |
|||
:show-all-levels="false" |
|||
@change="handleChangeScope(scope.$index)"></el-cascader> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="scopeId" |
|||
header-align="center" |
|||
align="center" |
|||
label="参加活动党组织" |
|||
width="220"> |
|||
|
|||
<template slot-scope="scope"> |
|||
|
|||
<el-cascader class="item_width_1" |
|||
:ref="'myCascader_join'+scope.$index" |
|||
v-model="scope.row.joinIdArray" |
|||
:key="joinIscascaderShow" |
|||
:options="joinOptions" |
|||
:props="joinOptionProps" |
|||
:show-all-levels="false" |
|||
@change="((value)=>{handleChangeJoinOrg(value,scope.$index)})"></el-cascader> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="joinUserType" |
|||
header-align="center" |
|||
align="center" |
|||
label="参加人员" |
|||
width="140"> |
|||
|
|||
<template slot-scope="scope"> |
|||
|
|||
<el-select style="width: 115px" |
|||
size="small" |
|||
v-model="scope.row.joinUserType" |
|||
placeholder="请选择" |
|||
clearable> |
|||
<el-option v-for="item in joinArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="autoPublicType" |
|||
header-align="center" |
|||
align="center" |
|||
label="自动发布时间" |
|||
width="160"> |
|||
|
|||
<template slot-scope="scope"> |
|||
|
|||
<el-select style="width: 135px" |
|||
v-model="scope.row.autoPublicType" |
|||
size="small" |
|||
placeholder="请选择" |
|||
filterable |
|||
clearable> |
|||
<el-option v-for="item in autoTimeArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="isAutoInformShow" |
|||
header-align="center" |
|||
align="center" |
|||
label="自动通知" |
|||
width="80"> |
|||
|
|||
<template slot-scope="scope"> |
|||
|
|||
<el-checkbox :label="'是'" |
|||
size="small" |
|||
v-model="scope.row.isAutoInformShow"></el-checkbox> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column label="操作" |
|||
fixed="right" |
|||
min-width="60" |
|||
header-align="center" |
|||
align="center" |
|||
class="operate"> |
|||
<template slot-scope="scope"> |
|||
|
|||
<el-button type="text" |
|||
style="color:#D51010;text-decoration: underline;" |
|||
size="small" |
|||
@click="handleDelete(scope.row,scope.$index)">删除</el-button> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
</div> |
|||
<div class="div_btn"> |
|||
<el-button size="small" |
|||
@click="handleCancle">取 消</el-button> |
|||
<el-button size="small" |
|||
type="primary" |
|||
@click="handleComfirm">确定</el-button> |
|||
|
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from 'vuex' |
|||
import { Loading } from 'element-ui' // 引入Loading服务 |
|||
import { requestPost, requestGet } from '@/js/dai/request' |
|||
|
|||
let loading // 加载动画 |
|||
export default { |
|||
data () { |
|||
return { |
|||
tableLoading: false, |
|||
|
|||
tableData: [], |
|||
isHasRule: false, |
|||
actTypeArray: [], |
|||
selActType: {}, |
|||
actType: "", |
|||
joinArray: [//参加人员 |
|||
{ |
|||
value: '0', |
|||
label: '全体党员' |
|||
}, |
|||
{ |
|||
value: '1', |
|||
label: '支部委员' |
|||
}, |
|||
], |
|||
|
|||
autoTimeArray: [], |
|||
|
|||
publishOptions: [], |
|||
publichIdArray: [], |
|||
iscascaderShow: 0, |
|||
publichOptionProps: { |
|||
multiple: false, |
|||
value: 'id', |
|||
label: 'partyOrgName', |
|||
children: 'children', |
|||
checkStrictly: true |
|||
}, |
|||
|
|||
joinOptions: [], |
|||
joinIdArray: [], |
|||
joinIscascaderShow: 0, |
|||
joinOptionProps: { |
|||
multiple: true, |
|||
value: 'id', |
|||
label: 'partyOrgName', |
|||
children: 'children', |
|||
checkStrictly: false |
|||
}, |
|||
defaultPublishParty: {} |
|||
|
|||
} |
|||
}, |
|||
components: {}, |
|||
async mounted () { |
|||
await this.getOrgTreeList() |
|||
await this.getJoinOrgTreeList() |
|||
await this.getCategrayList() |
|||
await this.getAutoTimeArray() |
|||
await this.getDefaultPublishParty() |
|||
|
|||
}, |
|||
|
|||
methods: { |
|||
|
|||
handleChangeScope (index) { |
|||
|
|||
}, |
|||
|
|||
handleChangeJoinOrg (value, index) { |
|||
|
|||
}, |
|||
|
|||
async handleClickActType (index) { |
|||
this.selActType = { ...this.actTypeArray[index] } |
|||
|
|||
//首先获取当前年份对应活动类型是否有活动 |
|||
await this.getTableData() |
|||
//如果没有活动，根据字典数据，初始化 |
|||
|
|||
if (this.isHasRule === '1') { |
|||
|
|||
this.$confirm("您已经生成过该活动类型的规则，您需要在该活动类型下追加新的活动吗？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning" |
|||
}) |
|||
.then(() => { |
|||
this.tableData = [] |
|||
for (let i = 0; i < this.selActType.yearCount; i++) { |
|||
this.handleAdd() |
|||
} |
|||
|
|||
}) |
|||
.catch(err => { |
|||
if (err == "cancel") { |
|||
this.tableData = [] |
|||
} |
|||
|
|||
}); |
|||
|
|||
} else { |
|||
this.tableData = [] |
|||
for (let i = 0; i < this.selActType.yearCount; i++) { |
|||
this.handleAdd() |
|||
} |
|||
} |
|||
|
|||
|
|||
}, |
|||
async getTableData () { |
|||
this.tableLoading = true |
|||
const url = "/resi/partymember/icPartyAct/yearSearch"; |
|||
|
|||
let params = { |
|||
yearId: this.yearId |
|||
} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
this.tableLoading = false |
|||
if (code === 0) { |
|||
let tempArray = [] |
|||
|
|||
data.forEach(item => { |
|||
|
|||
if (item.type === this.actType) { |
|||
tempArray = [] |
|||
|
|||
item.activityList.forEach(actItem => { |
|||
// actItem.publichIdArray = actItem.publishOrgPathShow.split(':') |
|||
|
|||
// actItem.joinIdArray = [] |
|||
// actItem.joinOrgList.forEach(element => { |
|||
// actItem.joinIdArray.push(element.joinOrgPathShow.split(':')) |
|||
// }); |
|||
|
|||
// item.isAutoInform = item.isAutoInform == '1' |
|||
|
|||
tempArray.push(actItem) |
|||
}); |
|||
} |
|||
|
|||
|
|||
}); |
|||
|
|||
if (tempArray.length > 0) { |
|||
this.isHasRule = '1' |
|||
} else { |
|||
this.isHasRule = '0' |
|||
} |
|||
|
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
async handleComfirm () { |
|||
this.disposeParty() |
|||
|
|||
let valiMsg = this.validata() |
|||
if (valiMsg) { |
|||
this.$message({ |
|||
type: 'warning', |
|||
message: valiMsg |
|||
}) |
|||
return false |
|||
} |
|||
console.log(this.tableData) |
|||
this.addPlan() |
|||
|
|||
}, |
|||
async addPlan () { |
|||
|
|||
let url = "/resi/partymember/icPartyAct/batch-add" |
|||
|
|||
let params = { |
|||
delActIds: [], |
|||
actList: this.tableData |
|||
} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.$emit('handleOk') |
|||
} else { |
|||
|
|||
this.$message.error(msg) |
|||
} |
|||
|
|||
}, |
|||
|
|||
disposeParty () { |
|||
this.tableData.forEach((tableItem, index) => { |
|||
//参会党组织 |
|||
tableItem.joinOrgList = [] |
|||
let selJoinArray = this.$refs["myCascader_join" + index].getCheckedNodes() |
|||
console.log('selJoinArray', selJoinArray) |
|||
|
|||
selJoinArray.forEach(joinItem => { |
|||
|
|||
let obj = { |
|||
joinOrgId: joinItem.data.id, |
|||
orgType: joinItem.data.partyOrgType, |
|||
pid: joinItem.data.pid, |
|||
joinOrgName: joinItem.data.partyOrgName, |
|||
joinOrgPathShow: joinItem.path.join(':'), |
|||
} |
|||
tableItem.joinOrgList.push(obj) |
|||
}); |
|||
|
|||
|
|||
}); |
|||
}, |
|||
validata () { |
|||
let message = '' |
|||
console.log(this.tableData) |
|||
for (let i = 0; i < this.tableData.length; i++) { |
|||
let oneData = this.tableData[i] |
|||
|
|||
if (oneData.holdTime) { |
|||
let array = oneData.holdTime.split('-') |
|||
oneData.holdYearId = array[0] |
|||
oneData.holdMonthId = array[0] + array[1] |
|||
} |
|||
|
|||
oneData.isAutoInform = oneData.isAutoInformShow ? '1' : '0' |
|||
|
|||
if (oneData.actType === '' || oneData.holdTime === '' || oneData.topic === '' || oneData.address === '' || oneData.publishPartyOrgId === '' |
|||
|| oneData.joinUserType === '' || oneData.joinIdArray.length === 0) { |
|||
message = '第' + (i + 1) + "行填写不完整，请先填写完整！" |
|||
break; |
|||
} |
|||
} |
|||
|
|||
return message |
|||
}, |
|||
|
|||
async handleDelete (row, tableIndex) { |
|||
|
|||
this.$confirm("活动删除后不可恢复，您确定要删除吗？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning" |
|||
}) |
|||
.then(() => { |
|||
// if (row.icPartyActId) { |
|||
// this.icPartyActId = row.icPartyActId |
|||
// this.delPlan(tableIndex) |
|||
// } else { |
|||
this.tableData.splice(tableIndex, 1); |
|||
// } |
|||
|
|||
}) |
|||
.catch(err => { |
|||
if (err == "cancel") { |
|||
|
|||
} |
|||
|
|||
}); |
|||
}, |
|||
|
|||
async delPlan (tableIndex) { |
|||
|
|||
const url = "/resi/partymember/icPartyAct/del"; |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/del"; |
|||
let params = [] |
|||
params.push(this.icPartyActId) |
|||
|
|||
|
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
if (code === 0) { |
|||
this.$message.success("删除成功！"); |
|||
this.tableData.splice(tableIndex, 1); |
|||
// this.getTableData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
|
|||
|
|||
handleCancle () { |
|||
this.$emit('handleClose') |
|||
|
|||
}, |
|||
|
|||
handleAdd () { |
|||
if (!this.actType) { |
|||
this.$message({ |
|||
type: 'info', |
|||
message: '请先选择活动类型' |
|||
}) |
|||
return false |
|||
} |
|||
|
|||
let obj = { |
|||
icPartyActId: '',//编辑活动时必传 |
|||
actType: this.actType,// 活动类型，来源于活动类型接口value |
|||
holdYearId: '',//活动开始时间所属年份：yyyy |
|||
holdMonthId: '',//活动开始时间所属月份：yyyyMM |
|||
holdTime: '',//活动开始时间：yyyy-MM-dd HH:mm:ss |
|||
topic: '',// 活动主题 |
|||
address: '',// 活动地址 |
|||
latitude: '',//活动地点纬度 |
|||
longitude: '',// 活动地点经度 |
|||
autoPublicType: '',//自动发布时间key; 来源于字典表接口 |
|||
publishPartyOrgId: this.defaultPublishParty.defaultPartyOrgId,// 发布活动党组织id |
|||
publishPartyOrgName: this.defaultPublishParty.defaultPartyOrgName,// 发布活动党组织名称 |
|||
publishOrgPid: this.defaultPublishParty.defaultPartyOrgPid,// 参加活动党组织ID的上级节点 |
|||
publishOrgType: this.defaultPublishParty.orgType,//党组织类型 0省委,1市委,2区委,3党工委,4党委,5支部；6党小组 |
|||
publishOrgPathShow: this.defaultPublishParty.defaultPartyOrgPath,//PUBLISH_PARTY_ORG_ID的全路径，包含自身。方便前端回显 |
|||
joinUserType: '',//参加人员类型，0：全体党员；1：支部委员 |
|||
isAutoInform: '',// 是否自动通知参加人员，0否；1是 |
|||
introduce: '',// 活动介绍 |
|||
attachmentList: [], |
|||
joinOrgList: [], |
|||
|
|||
publichIdArray: this.defaultPublishParty.defaultPartyOrgPath.split(':'), |
|||
// publichIdArray: ['1536584227130798081'], |
|||
joinIdArray: [], |
|||
isAutoInformShow: true |
|||
|
|||
} |
|||
|
|||
this.tableData.push(obj) |
|||
}, |
|||
|
|||
|
|||
async getOrgTreeList () { |
|||
|
|||
const url = '/resi/partymember/icPartyOrg/getSearchTreelist' |
|||
let params = { |
|||
customerId: localStorage.getItem('customerId'), |
|||
agencyId: localStorage.getItem('agencyId') |
|||
}; |
|||
|
|||
const { data, code, msg } = await requestGet(url, params); |
|||
console.log('data-orgparty----o', data) |
|||
if (code === 0) { |
|||
|
|||
this.publishOptions = data |
|||
this.joinOptions = data |
|||
this.changeKey(this.joinOptions) |
|||
|
|||
} else { |
|||
} |
|||
|
|||
|
|||
}, |
|||
|
|||
changeKey (arr) { |
|||
for (var i = 0; i < arr.length; i++) { |
|||
arr[i].value = arr[i].userId |
|||
arr[i].label = arr[i].userName |
|||
if (arr[i].children.length) { |
|||
this.changeKey(arr[i].children) |
|||
} else { |
|||
delete arr[i].children |
|||
} |
|||
} |
|||
}, |
|||
|
|||
//加载组织 |
|||
async getJoinOrgTreeList () { |
|||
const url = '/resi/partymember/icPartyOrg/getOrgTreeHaveGroup' |
|||
// const url = 'http://yapi.elinkservice.cn/mock/245/heart/icServiceOrg/selectlist' |
|||
let params = { |
|||
agencyId: localStorage.getItem('agencyId') |
|||
|
|||
} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
// this.joinOptions = data |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
// 字典 |
|||
async getCategrayList () { |
|||
const url = "/resi/partymember/icPartyAct/acttypelist" |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/acttypelist" |
|||
|
|||
let params = {} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.actTypeArray = data |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
// 自动发布时间 |
|||
async getAutoTimeArray () { |
|||
const url = "/sys/dict/data/dictlist" |
|||
|
|||
let params = { |
|||
dictType: 'icpartyact_auto_publish_time' |
|||
} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.autoTimeArray = data |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
// 获取默认发布党组织 |
|||
async getDefaultPublishParty () { |
|||
const url = "/resi/partymember/icPartyOrg/defaultpartyorg" |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyOrg/defaultpartyorg" |
|||
|
|||
let params = {} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.defaultPublishParty = data |
|||
|
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
// 开启加载动画 |
|||
startLoading () { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: '正在加载……', // 加载中需要显示的文字 |
|||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|||
}) |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading () { |
|||
// clearTimeout(timer); |
|||
if (loading) { |
|||
loading.close() |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
tableHeight () { |
|||
|
|||
return (this.clientHeight - 375) |
|||
|
|||
}, |
|||
|
|||
...mapGetters(['clientHeight']) |
|||
|
|||
}, |
|||
props: { |
|||
|
|||
yearId: { |
|||
type: String, |
|||
required: true |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style lang="scss" scoped > |
|||
@import "@/assets/scss/buttonstyle.scss"; |
|||
|
|||
.item_width_1 { |
|||
width: 160px; |
|||
} |
|||
.item_width_2 { |
|||
width: 200px; |
|||
} |
|||
.div_search { |
|||
margin-top: 10px; |
|||
} |
|||
.div_table { |
|||
margin-top: 20px; |
|||
// background: #ffffff; |
|||
// box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1); |
|||
// border-radius: 4px; |
|||
|
|||
.table { |
|||
margin-top: 20px; |
|||
} |
|||
} |
|||
.div_btn { |
|||
margin-top: 10px; |
|||
display: flex; |
|||
justify-content: flex-end; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,272 @@ |
|||
<template> |
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
|
|||
<el-form ref="ref_form" |
|||
:inline="true" |
|||
:model="formData" |
|||
:rules="dataRule" |
|||
class="div_form"> |
|||
|
|||
<el-form-item label="日程标题" |
|||
prop="title" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<el-input class="item_width_1" |
|||
placeholder="请输入活动标题" |
|||
v-model="formData.title"> |
|||
</el-input> |
|||
</el-form-item> |
|||
<el-form-item label="提醒时间" |
|||
style="display: block" |
|||
prop="remindTime" |
|||
label-width="150px"> |
|||
<el-date-picker v-model="formData.remindTime" |
|||
value-format="yyyy-MM-dd HH:mm:ss" |
|||
format="yyyy-MM-dd HH:mm:ss" |
|||
type="datetime" |
|||
placeholder="选择时间"> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="是否公开" |
|||
label-width="150px" |
|||
prop="isPublic"> |
|||
<el-select v-model="formData.isPublic" |
|||
placeholder="请选择" |
|||
clearable |
|||
class="item_width_1"> |
|||
<el-option v-for="item in gongkaiArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="日程介绍" |
|||
prop="remark" |
|||
label-width="150px" |
|||
style="display: block"> |
|||
<el-input class="item_width_1" |
|||
type="textarea" |
|||
maxlength="1000" |
|||
show-word-limit |
|||
:rows="3" |
|||
placeholder="请输入日程介绍，不超过1000字" |
|||
v-model="formData.remark"></el-input> |
|||
</el-form-item> |
|||
|
|||
</el-form> |
|||
|
|||
</div> |
|||
|
|||
<div class="div_btn"> |
|||
<el-button size="small" |
|||
@click="handleCancle">取 消</el-button> |
|||
<el-button size="small" |
|||
type="primary" |
|||
:disabled="btnDisable" |
|||
@click="handleComfirm">确 定</el-button> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from 'vuex' |
|||
import { Loading } from 'element-ui' // 引入Loading服务 |
|||
import { requestPost, requestGet } from '@/js/dai/request' |
|||
|
|||
|
|||
|
|||
|
|||
let loading // 加载动画 |
|||
export default { |
|||
data () { |
|||
return { |
|||
btnDisable: false, |
|||
|
|||
|
|||
formData: { |
|||
title: '',// |
|||
remindTime: '',// |
|||
isPublic: '',// |
|||
remark: '',// |
|||
scheduleId: '', |
|||
|
|||
}, |
|||
|
|||
|
|||
gongkaiArray: [ |
|||
{ |
|||
value: '0', |
|||
label: '仅自己可见' |
|||
}, |
|||
{ |
|||
value: '1', |
|||
label: '组织内其他人可见' |
|||
}, |
|||
|
|||
], |
|||
|
|||
} |
|||
}, |
|||
|
|||
watch: { |
|||
|
|||
}, |
|||
components: {}, |
|||
async mounted () { |
|||
|
|||
if (this.scheduleId) { |
|||
this.formData.scheduleId = this.scheduleId |
|||
await this.loadInfo() |
|||
|
|||
} else { |
|||
this.$refs.ref_form.resetFields(); |
|||
} |
|||
|
|||
}, |
|||
|
|||
|
|||
methods: { |
|||
|
|||
async handleComfirm () { |
|||
|
|||
this.handleAdd() |
|||
}, |
|||
|
|||
async loadInfo () { |
|||
const url = `/resi/partymember/icSchedule/${this.scheduleId}`; |
|||
// const url = `http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/act-detail/${this.icPartyActId}`; |
|||
|
|||
let params = {} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.formData = { ...data } |
|||
this.formData.scheduleId = this.scheduleId |
|||
|
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
async handleAdd () { |
|||
|
|||
this.btnDisable = true |
|||
setTimeout(() => { |
|||
this.btnDisable = false |
|||
}, 10000) |
|||
this.$refs['ref_form'].validate((valid, messageObj) => { |
|||
if (!valid) { |
|||
|
|||
this.btnDisable = false |
|||
} else { |
|||
|
|||
this.addSchedule() |
|||
|
|||
} |
|||
|
|||
}) |
|||
|
|||
}, |
|||
|
|||
async addSchedule () { |
|||
|
|||
console.log(this.formData) |
|||
|
|||
|
|||
const url = '/resi/partymember/icSchedule/addOrEdit' |
|||
// const url = 'http://yapi.elinkservice.cn/mock/245/icSchedule/addOrEdit' |
|||
let params = { |
|||
|
|||
...this.formData |
|||
} |
|||
|
|||
const { data, code, msg } = await requestPost(url, params) |
|||
|
|||
if (code === 0) { |
|||
this.$message.success('操作成功') |
|||
this.resetData() |
|||
this.$emit('handleOk') |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
|
|||
|
|||
|
|||
handleCancle () { |
|||
this.resetData() |
|||
this.$emit('handleClose') |
|||
|
|||
}, |
|||
|
|||
resetData () { |
|||
this.scheduleId = '' |
|||
this.formData = { |
|||
title: '',// |
|||
remindTime: '',// |
|||
isPublic: '',// |
|||
remark: '',// |
|||
scheduleId: '', |
|||
} |
|||
|
|||
}, |
|||
// 开启加载动画 |
|||
startLoading () { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: '正在加载……', // 加载中需要显示的文字 |
|||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|||
}) |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading () { |
|||
// clearTimeout(timer); |
|||
if (loading) { |
|||
loading.close() |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
dataRule () { |
|||
return { |
|||
|
|||
title: [ |
|||
{ required: true, message: '日程标题不能为空', trigger: 'change' }, |
|||
], |
|||
remindTime: [ |
|||
{ required: true, message: '提醒时间不能为空', trigger: 'change' } |
|||
], |
|||
isPublic: [ |
|||
{ required: true, message: '是否公开不能为空', trigger: 'change' } |
|||
], |
|||
|
|||
} |
|||
}, |
|||
|
|||
}, |
|||
props: { |
|||
|
|||
|
|||
formType: { //表单操作类型 add新增，edit编辑，detail详情,feedback反馈 |
|||
type: String, |
|||
required: '' |
|||
}, |
|||
scheduleId: { //表单操作类型 add新增，edit编辑，detail详情,feedback反馈 |
|||
type: String, |
|||
required: '' |
|||
}, |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style lang="scss" scoped > |
|||
@import "@/assets/scss/modules/management/form-main.scss"; |
|||
</style> |
|||
@ -0,0 +1,525 @@ |
|||
<template> |
|||
<div class="div_main"> |
|||
<div> |
|||
<div class="div_search"> |
|||
<el-form :inline="true" |
|||
:model="formData" |
|||
ref="ref_searchform" |
|||
:label-width="'150px'"> |
|||
<div> |
|||
|
|||
<el-form-item label="选择计划年度" |
|||
prop="serviceCategoryKey"> |
|||
<el-date-picker v-model="formData.yearId" |
|||
value-format="yyyy" |
|||
type="year" |
|||
placeholder="选择年" |
|||
size="small" |
|||
style="width: 150px"> |
|||
</el-date-picker> |
|||
|
|||
<!-- <el-select v-model="formData.yearId" |
|||
placeholder="请选择" |
|||
size="small" |
|||
class="item_width_2"> |
|||
<el-option v-for="item in yearArray" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> --> |
|||
</el-form-item> |
|||
|
|||
<el-button style="margin-left:30px" |
|||
size="small" |
|||
class="diy-button--search" |
|||
@click="handleSearch">查询</el-button> |
|||
|
|||
</div> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="div_table"> |
|||
|
|||
<div class="div_btn"> |
|||
<el-button class="diy-button--add" |
|||
size="small" |
|||
@click="handleAdd">添加规则</el-button> |
|||
|
|||
</div> |
|||
|
|||
<el-table :data="tableData" |
|||
border |
|||
v-loading="tableLoading" |
|||
:header-cell-style="{background:'#2195FE',color:'#FFFFFF'}" |
|||
class="table" |
|||
style="width: 100%" |
|||
:span-method="objectSpanMethod" |
|||
:height="maxTableHeight"> |
|||
<!-- <el-table-column label="序号" |
|||
fixed="left" |
|||
type="index" |
|||
align="center" |
|||
width="50" /> --> |
|||
|
|||
<el-table-column prop="actType" |
|||
align="center" |
|||
width="120" |
|||
label="活动类别" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="frequency" |
|||
label="举办频次" |
|||
width="120" |
|||
align="center" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="holdTime" |
|||
align="center" |
|||
width="160" |
|||
label="活动时间" |
|||
:show-overflow-tooltip="true"> |
|||
|
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="address" |
|||
align="center" |
|||
min-width="180" |
|||
label="活动地点" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
<el-table-column prop="topic" |
|||
align="center" |
|||
min-width="180" |
|||
label="活动主题" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
<el-table-column prop="publishPartyOrgName" |
|||
align="center" |
|||
min-width="180" |
|||
label="发布活动党支部" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
<el-table-column prop="publishStaffName" |
|||
align="center" |
|||
width="120" |
|||
label="发布人" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
<el-table-column prop="joinOrgsShow" |
|||
align="center" |
|||
min-width="200" |
|||
label="参加活动党支部" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
<el-table-column prop="joinUserTypeName" |
|||
align="center" |
|||
width="80" |
|||
label="参加人员" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
<el-table-column prop="autoPublicTypeDesc" |
|||
align="center" |
|||
width="120" |
|||
label="自动发布时间" |
|||
:show-overflow-tooltip="true"> |
|||
|
|||
</el-table-column> |
|||
<el-table-column prop="isAutoInformValue" |
|||
align="center" |
|||
width="80" |
|||
label="自动通知" |
|||
:show-overflow-tooltip="true"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="scope.row.isAutoInform == '1'">是</span> |
|||
<span v-if="scope.row.isAutoInform == '0'">否</span> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column fixed="right" |
|||
label="操作" |
|||
align="center" |
|||
width="180"> |
|||
<template slot-scope="scope"> |
|||
|
|||
<el-button @click="handleDetail(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class=".div-table-button--detail">查看</el-button> |
|||
|
|||
<el-button v-if="user.id===scope.row.publishStaffId" |
|||
@click="handleEdit(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class="div-table-button--edit">修改</el-button> |
|||
|
|||
<el-button v-if="user.id===scope.row.publishStaffId" |
|||
@click="handleDel(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class="div-table-button--delete">删除</el-button> |
|||
|
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<div class="div-btn"> |
|||
<el-button size="small" |
|||
@click="handleCancle">取 消</el-button> |
|||
<el-button size="small" |
|||
type="primary" |
|||
@click="handleComfirm">确 定</el-button> |
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
<el-dialog v-if="showAdd" |
|||
:visible.sync="showAdd" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="addDiaTitle" |
|||
width="1400px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showAdd = false"> |
|||
<add-rule ref="ref_add_form" |
|||
:yearId="formData.yearId" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose"></add-rule> |
|||
</el-dialog> |
|||
<el-dialog v-if="showEdit" |
|||
:visible.sync="showEdit" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="editDiaTitle" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showEdit = false"> |
|||
<add-activity ref="ref_edit_form" |
|||
:formType="formType" |
|||
:icPartyActId="icPartyActId" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose"></add-activity> |
|||
</el-dialog> |
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost, requestGet } from "@/js/dai/request"; |
|||
import { mapGetters } from "vuex"; |
|||
import axios from "axios"; |
|||
import addRule from "./addRule"; |
|||
import addActivity from "./addActivity"; |
|||
|
|||
export default { |
|||
components: { addRule, addActivity }, |
|||
|
|||
data () { |
|||
|
|||
return { |
|||
tableLoading: false, |
|||
user: {}, |
|||
agencyId: '', |
|||
|
|||
tableData: [], |
|||
originalData: [], |
|||
rowArray: [],//合并行的行数 |
|||
|
|||
yearArray: [], |
|||
formData: { |
|||
yearId: '', |
|||
}, |
|||
icPartyActId: '', |
|||
|
|||
|
|||
showAdd: false, |
|||
showEdit: false, |
|||
|
|||
formType: 'add', |
|||
addDiaTitle: '添加规则', |
|||
editDiaTitle: '修改规则', |
|||
|
|||
}; |
|||
}, |
|||
computed: { |
|||
maxTableHeight () { |
|||
return this.$store.state.inIframe |
|||
? this.clientHeight - 380 + this.iframeHeigh |
|||
: this.clientHeight - 380; |
|||
}, |
|||
...mapGetters(["clientHeight", "iframeHeight"]), |
|||
}, |
|||
watch: { |
|||
|
|||
}, |
|||
mounted () { |
|||
|
|||
this.user = this.$store.state.user |
|||
this.agencyId = this.user.agencyId |
|||
|
|||
this.yearArray = [] |
|||
let now = new Date() |
|||
let year = now.getFullYear() |
|||
|
|||
if (this.currentYearStr) { |
|||
|
|||
this.formData.yearId = this.currentYearStr |
|||
} else { |
|||
this.formData.yearId = year + '' |
|||
} |
|||
for (let i = 0; i < 5; i++) { |
|||
let obj = { |
|||
value: (year - i) + '', |
|||
label: (year - i) + '年' |
|||
|
|||
} |
|||
|
|||
this.yearArray.push(obj) |
|||
} |
|||
|
|||
this.getTableData(); |
|||
}, |
|||
methods: { |
|||
|
|||
flitterData (arr) { |
|||
let spanOneArr = [] |
|||
let concatOne = 0 |
|||
arr.forEach((item, index) => { |
|||
|
|||
if (index === 0) { |
|||
spanOneArr.push(1) |
|||
} else { |
|||
if (item.actType === arr[index - 1].actType) { //第一列需合并相同内容的判断条件 |
|||
spanOneArr[concatOne] += 1 |
|||
spanOneArr.push(0) |
|||
} else { |
|||
spanOneArr.push(1) |
|||
concatOne = index |
|||
}; |
|||
} |
|||
}); |
|||
return { |
|||
one: spanOneArr, |
|||
} |
|||
}, |
|||
objectSpanMethod ({ row, column, rowIndex, columnIndex }) { |
|||
if (columnIndex === 0) { // 判断哪一列 |
|||
const _row = (this.flitterData(this.tableData).one)[rowIndex] |
|||
const _col = _row > 0 ? 1 : 0 |
|||
return { |
|||
rowspan: _row, |
|||
colspan: _col |
|||
}; |
|||
} |
|||
if (columnIndex === 1) { // 判断哪一列 |
|||
const _row = (this.flitterData(this.tableData).one)[rowIndex] |
|||
const _col = _row > 0 ? 1 : 0 |
|||
return { |
|||
rowspan: _row, |
|||
colspan: _col |
|||
}; |
|||
} |
|||
}, |
|||
|
|||
|
|||
handleCancle () { |
|||
this.$emit('handleClose') |
|||
}, |
|||
handleComfirm () { |
|||
this.$emit('handleOk') |
|||
}, |
|||
|
|||
handleSearch (val) { |
|||
|
|||
this.getTableData(); |
|||
}, |
|||
|
|||
async handleAdd () { |
|||
|
|||
this.formType = 'add' |
|||
this.showAdd = true; |
|||
|
|||
}, |
|||
async handleDetail (row) { |
|||
this.icPartyActId = row.icPartyActId |
|||
this.addDiaTitle = '查看活动计划' |
|||
this.formType = 'detail' |
|||
this.showEdit = true |
|||
|
|||
}, |
|||
|
|||
async handleEdit (row) { |
|||
this.icPartyActId = row.icPartyActId |
|||
this.formType = 'edit' |
|||
this.showEdit = true |
|||
|
|||
}, |
|||
|
|||
handleClose () { |
|||
this.formType = '' |
|||
|
|||
this.showAdd = false |
|||
this.showEdit = false |
|||
|
|||
|
|||
}, |
|||
handleOk () { |
|||
this.handleClose() |
|||
this.pageNo = 1 |
|||
this.getTableData() |
|||
|
|||
}, |
|||
|
|||
|
|||
async handleDel (row) { |
|||
|
|||
this.icPartyActId = row.icPartyActId |
|||
|
|||
this.$confirm("活动删除后不可恢复，您确定要删除吗？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning" |
|||
}) |
|||
.then(() => { |
|||
this.cancelActivity() |
|||
}) |
|||
.catch(err => { |
|||
if (err == "cancel") { |
|||
// this.$message({ |
|||
// type: "info", |
|||
// message: "已取消删除" |
|||
// }); |
|||
} |
|||
|
|||
}); |
|||
|
|||
}, |
|||
|
|||
async cancelActivity () { |
|||
|
|||
const url = '/resi/partymember/icPartyAct/del'; |
|||
// const url = 'http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/del'; |
|||
let params = [this.icPartyActId] |
|||
|
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
if (code === 0) { |
|||
this.$message.success("删除成功！"); |
|||
this.getTableData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
|
|||
async getTableData () { |
|||
this.tableLoading = true |
|||
const url = "/resi/partymember/icPartyAct/yearSearch"; |
|||
// const url = "http://yapi.elinkservice.cn/mock/245/icPartyAct/yearSearch"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, this.formData); |
|||
|
|||
this.tableLoading = false |
|||
if (code === 0) { |
|||
let tempArray = [] |
|||
this.rowArray = [] |
|||
|
|||
this.originalData = data.concat(); |
|||
|
|||
data.forEach(item => { |
|||
item.activityList.forEach(actItem => { |
|||
actItem.actType = item.typeValue |
|||
actItem.frequency = item.frequency |
|||
|
|||
if (actItem.joinOrgList && actItem.joinOrgList.length > 0) { |
|||
|
|||
let arr = [] |
|||
actItem.joinOrgList.forEach(element => { |
|||
arr.push(element.joinOrgName) |
|||
}); |
|||
actItem.joinOrgsShow = arr.join(',') |
|||
} else { |
|||
actItem.joinOrgsShow = '' |
|||
} |
|||
|
|||
|
|||
tempArray.push(actItem) |
|||
}); |
|||
|
|||
this.rowArray.push(item.activityList.length) |
|||
}); |
|||
|
|||
this.tableData = tempArray |
|||
|
|||
|
|||
|
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
async handleExport () { |
|||
const url = "/gov/project/icEvent/export"; |
|||
const { pageSize, pageNo, formData } = this; |
|||
axios({ |
|||
url: window.SITE_CONFIG["apiURL"] + url, |
|||
method: "post", |
|||
data: { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}, |
|||
responseType: "blob", |
|||
}) |
|||
.then((res) => { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { type: "application/vnd.ms-excel" }); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
}) |
|||
.catch((err) => { |
|||
console.log("获取导出情失败", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
|
|||
}, |
|||
|
|||
props: { |
|||
|
|||
currentYearStr: { //年份 |
|||
type: String, |
|||
required: '' |
|||
}, |
|||
|
|||
|
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/buttonstyle.scss"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
|||
|
|||
.div-btn { |
|||
display: flex; |
|||
justify-content: center; |
|||
padding-bottom: 10px; |
|||
margin-top: 30px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue