迁移三会一课

This commit is contained in:
aixianling
2021-12-18 18:29:28 +08:00
parent 35a2b6f11d
commit a0e5ca3656
7 changed files with 4278 additions and 0 deletions

View File

@@ -0,0 +1,564 @@
<template>
<section class="AppMeetingChinaunion">
<ai-list v-if="showList">
<ai-title title="三会一课" isShowBottomBorder slot="title">
<template #rightBtn>
<ai-party :instance="instance" v-model="partyId" :topOrgId="topOrgId" size="small"
style="display:inline-block" @origin="changeParty"/>
<el-button icon="iconfont iconNav_DataCenter" size="small" type="primary" @click="showStatistics()">会议统计
</el-button>
<el-button icon="iconfont iconSetting" size="small" type="primary" @click="toMeetSet()">设置</el-button>
</template>
</ai-title>
<template #content>
<ai-search-bar>
<template #left>
<el-select size="small" v-model="search.meetingClassification" placeholder="会议分类"
@change="$forceUpdate(),page.current=1,getAppThreeMeetingInfo()" clearable>
<el-option v-for="(op,j) in dict.getDict('meetingClassification')" :key="j" :label="op.dictName"
:value="op.dictValue"/>
</el-select>
<el-select size="small" v-model="search.postStatus" placeholder="发布状态"
@change="$forceUpdate(),page.current=1,getAppThreeMeetingInfo()" clearable>
<el-option v-for="(op,j) in dict.getDict('postStatus')" :key="j" :label="op.dictName"
:value="op.dictValue"/>
</el-select>
<ai-search label="学习日期">
<el-date-picker size="small" placeholder="请选择" type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
style="width: 258px;"
value-format="yyyy-MM-dd"
v-model="stuTime"
@change="page.current=1,getAppThreeMeetingInfo()"/>
</ai-search>
</template>
<template #right>
<el-input size="small" v-model="search.meetingAgenda" placeholder="会议标题/创建人"
prefix-icon="iconfont iconSearch" clearable
@keyup.enter.native="page.current=1,getAppThreeMeetingInfo()"/>
<el-button type="primary" icon="iconfont iconSearch" @click="page.current=1,getAppThreeMeetingInfo()">查询
</el-button>
<el-button icon="el-icon-refresh-right" @click="resetSearch">重置</el-button>
</template>
</ai-search-bar>
<ai-search-bar>
<template #left>
<el-button type="primary" icon="iconfont iconAdd" v-if="$permissions('app_appthreemeetinginfo_edit')"
@click="add">添加
</el-button>
<el-button icon="iconfont iconAdd" v-if="$permissions('app_appthreemeetinginfo_makeup')"
@click="supplement">补录
</el-button>
</template>
</ai-search-bar>
<el-table ref="multipleTable" :data="tableData" style="margin-top:16px;"
header-cell-class-name="table-header"
tooltip-effect="light" row-class-name="table-row" cell-class-name="table-cell">
<el-table-column prop="meetingAgenda" label="会议名称" show-overflow-tooltip align="center">
<div slot-scope="{row}">
{{ row.meetingAgenda || "-" }}
</div>
</el-table-column>
<el-table-column prop="meetingClassification" label="会议分类" align="center" show-overflow-tooltip>
<div slot-scope="{row}" v-if="row.meetingClassification.length">
<span v-for="(i,index) in dict.getDict('meetingClassification')" :key="index">
<span v-for="(b,indexs) in row.meetingClassification" :key="indexs" v-if="i.dictValue == b">
{{ i.dictName }}
<span v-if="indexs < (row.meetingClassification.length - 1) ">,</span>
</span>
</span>
</div>
<div v-else>-</div>
</el-table-column>
<el-table-column prop="organizationName" label="所属组织" align="center">
<template slot-scope="scope">
<el-tooltip effect="light" placement="top" content="请进入详情查看更多组织"
v-if="scope.row.organizationName.length > 1">
<span>{{ scope.row.organizationName[0] }}...</span>
</el-tooltip>
<span v-else>{{ scope.row.organizationName[0] || '-' }}</span>
</template>
</el-table-column>
<el-table-column prop="startTime" label="开始时间" align="center">
<div slot-scope="{row}"> {{ row.startTime || '-' }}</div>
</el-table-column>
<el-table-column prop="endTime" label="结束时间" align="center">
<div slot-scope="{row}">
{{ row.endTime || '-' }}
</div>
</el-table-column>
<el-table-column prop="createUserName" label="创建人" align="center">
<div slot-scope="{row}">
{{ row.createUserName || "-" }}
</div>
</el-table-column>
<el-table-column prop="postStatus" label="发布状态" align="center">
<div slot-scope="{row}" :style="{color:color[row.postStatus]}">
{{ dict.getLabel('postStatus', row.postStatus) || '-' }}
</div>
</el-table-column>
<el-table-column prop="operate" label="操作" align="center">
<div slot-scope="{row}">
<el-button type="text" icon="iconfont iconjdq_led_edit" title="编辑" @click="gotoDetail(row)"
v-if="row.postStatus=='0'"/>
<el-button type="text" icon="iconfont iconShow" title="详情" @click="gotoDetail(row)" v-else/>
<el-button type="text" icon="iconfont iconDelete" title="删除" @click="delMeeting(row)"/>
</div>
</el-table-column>
<div slot="empty" class="no-data" style="height:160px;"/>
</el-table>
<div class="pagination">
<el-pagination background
:current-page="page.current"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
layout="total,prev, pager, next,sizes, jumper"
:total="page.total"/>
</div>
</template>
</ai-list>
<div v-if="!$permissions('app_appthreemeetinginfo_detail')" class="no-permission"
style="display: flex;flex-direction:column;align-items: center;justify-content: center;height: calc(100% - 148px);font-size: 14px;">
<div style="height: 170px;"></div>
<p>暂无使用该应用的权限</p>
</div>
<el-dialog :visible.sync="dialogTableVisible" title="会议数据统计" width="520px" class="mask label-110"
:close-on-click-modal='false'>
<div class="content input-240">
<el-row :gutter="8">
<el-col style="width: 100px;">
<el-select v-model="searchYear" placeholder="年份" size="mini" clearable class="timeSelect"
@change="getMeetStatistics">
<el-option v-for="(op,j) in dict.getDict('meetingChangeYear')" :key="j" :label="op.dictName"
:value="op.dictValue"/>
</el-select>
</el-col>
<el-col style="width: 100px;">
<el-select v-model="searchMonth" placeholder="全部" size="mini" clearable class="timeSelect"
@change="getMeetStatistics">
<el-option v-for="(op,j) in dict.getDict('monthList')" :key="j" :label="op.dictName"
:value="op.dictValue"/>
</el-select>
</el-col>
</el-row>
<ul class="totalTitle">
<li v-for="(item,index) in totalTitleList" :key="index">
<span>{{ item.num }}</span>
<span>{{ item.title }}</span>
</li>
</ul>
<el-row type="flex" justify="space-between" style="margin-top: 40px;">
<el-col style="width: 160px;height: 160px;">
<pieChart :chart-data="pieChart" :colorList="colorList"></pieChart>
</el-col>
<el-col class="pieList">
<ul>
<li v-for="(item,index) in pieData.dataStatistics" :key="index">
<div class="colorWrap">
<div :style="{background:colorList[index]}"></div>
<span>{{ item.name }}</span>
</div>
<span class="num">{{ item.v1 }}</span>
</li>
</ul>
</el-col>
</el-row>
</div>
<div class="operation">
<el-button class="delete-btn" @click="dialogTableVisible = false" size="mini">关闭</el-button>
</div>
</el-dialog>
<appThreeMeetingUser :instance="instance" :dict="dict" v-if="showMeetingUser" :meetingId="meetingId"
:meetingStatus="meetingStatus"
:detail="detail"/>
<add :instance="instance" :dict="dict" :detail="detail" v-if="showAdd"/>
<meetingDetail :instance="instance" :dict="dict" :detail="detail" v-if="showDetail"/>
<meetingSet :instance="instance" :dict="dict" :partyId="partyId" :partyName="search.partyName"
v-if="showSet"/>
<supplement :instance="instance" :dict="dict" v-if="showSupplement"/>
</section>
</template>
<script>
import {mapState} from "vuex";
import moment from "dayjs";
import appThreeMeetingUser from "./components/appThreeMeetingUser";
import meetingSet from "./components/meetingSet";
import supplement from "./components/supplement";
import pieChart from "./components/pieChart";
import add from "./components/add";
import meetingDetail from "./components/meetingDetail";
export default {
name: "AppMeetingChinaunion",
label: "三会一课(联通专版)",
props: {
instance: Function,
dict: Object,
permissions: Function
},
components: {appThreeMeetingUser, meetingSet, supplement, pieChart, add, meetingDetail},
data() {
return {
searchTime: '',
tableData: [],
search: {
meetingAgenda: "",
meetingClassification: "",
postStatus: "",
partyName: "",
searchParamYM: '',
},
partyId: '',
page: {
current: 1,
size: 10,
total: 0,
},
detail: {},
showSet: false, //设置
showMeetingUser: false, //统计
showSupplement: false, //补录
showDetail: true, //详情
showAdd: false, //添加
showList: false, //列表
meetingId: "",//会议id
meetingStatus: '', //会议状态
partyType: '', //2表示支部可进支部党组织设置
dialogTableVisible: false,
topOrgId: '',
stuTime: "",
searchMonth: "",
searchYear: new Date().getFullYear(),
colorList: ["#FF4466", "#37A62B", "#4B87FE", "#FFAA44"],
totalTitleList: [],
pieData: {},
pieChart: [],
}
},
methods: {
add() {
this.detail = {};
this.showList = false;
this.showAdd = true;
},
supplement() {
this.showList = false;
this.showSupplement = true;
},
showStatistics() {
if (this.partyType != '2') {
return this.$message.error("所属组织不是支部党组织");
}
this.dialogTableVisible = true
this.getMeetStatistics();
},
/**
* 获取统计
* */
getMeetStatistics() {
this.instance.post(`/app/appthreemeetinginfo/statistics-branch-Per-month?month=${this.searchMonth}&year=${this.searchYear}&partyOrgId=${this.partyId}`).then(res => {
if (res && res.data) {
const {type0, type1, type2, type3, total} = res.data;
let chartData = [];
this.totalTitleList = [
{title: "共计会议", num: total},
{title: "支部党员大会", num: type0},
{title: "支部委员会", num: type1},
{title: "党小组会", num: type2},
{title: "党课", num: type3}
]
res.data.dataStatistics.map(e => {
chartData.push({value: e.v1, name: e.name})
})
this.pieChart = chartData;
this.pieData = res.data;
}
})
},
/**
* 切换党组织
* @param e
*/
changeParty(e) {
if (!e.length) return
this.partyType = e[0].partyType
this.page.current = 1
this.search.partyName = e[0].name
this.getAppThreeMeetingInfo()
},
delMeeting(item) {
this.$confirm(`是否要删除会议?`, {
type: 'warning'
}).then(() => {
this.instance.post(`/app/appthreemeetinginfo/delete?ids=${item.id}`, null, {}).then(res => {
if (res && res.code == 0) {
this.$message.success("删除成功!")
this.getAppThreeMeetingInfo()
}
})
})
},
//分页
handleCurrentChange(val) {
this.page.current = val;
this.getAppThreeMeetingInfo();
},
//分页
handleSizeChange(val) {
this.page.size = val
this.page.current = 1
this.getAppThreeMeetingInfo()
},
//重置
resetSearch() {
this.page.current = 1
this.page.size = 10
this.searchTime = ''
this.stuTime = ""
this.search.meetingClassification = "";
this.search.postStatus = "";
this.search.meetingAgenda = "";
this.$nextTick(() => {
this.getAppThreeMeetingInfo()
})
},
//列表
getAppThreeMeetingInfo() {
const date = this.stuTime ? {
startTimeStart: this.stuTime[0],
startTimeEnd: this.stuTime[1]
} : {}
this.instance.post("/app/appthreemeetinginfo/list", null, {
params: {
...this.search,
...this.page,
...date,
organizationId: this.partyId,
}
}).then(res => {
if (res && res.code == 0) {
if (res.data.records.length) {
res.data.records.map((item) => {
item.organizationName = item.organizationName.split('/')
})
}
this.tableData = res.data.records;
this.page.total = res.data.total;
}
})
},
//返回
goBack() {
this.showSet = false;
this.showMeetingUser = false;
this.showSupplement = false;
this.showDetail = false;
this.showAdd = false;
this.showList = true;
this.getAppThreeMeetingInfo()
},
//跳转详请
gotoDetail(row) {
if (row.postStatus == '0') {
this.detail = row;
this.showList = false;
this.showAdd = true;
} else {
this.detail = row;
this.showList = false;
this.showDetail = true;
}
// this.detail = row;
// this.showList = false;
// this.showDetail = true;
},
/**
* 设置
* @returns {ElMessageComponent}
*/
toMeetSet() {
if (this.partyType != '2') {
return this.$message.error("所属组织不是支部党组织");
}
this.showList = false;
this.showSet = true;
},
},
created() {
this.topOrgId = this.user.info.organizationId;
this.partyId = this.user.info.organizationId;
this.search.partyName = this.user.info.organizationName;
this.dict.load('meetingClassification', 'monthList', "meetingChangeYear", "postStatus").then(() => this.resetSearch());
},
computed: {
...mapState(['user']),
color() {
return ["#A722FF", "#FF8822", "#2266FF", "#999999"]
},
},
filters: {
formatTime(time) {
return moment(time).format("YYYY-MM-DD HH:mm");
}
}
}
</script>
<style scoped lang="scss">
.AppMeetingChinaunion {
height: 100%;
::v-deep .ai-party {
.el-dialog__header, .el-dialog__footer {
line-height: 1 !important;
}
}
.pieList {
width: 215px !important;
display: flex;
align-items: center;
justify-content: center;
padding-top: 30px;
ul {
width: 100%;
height: 100%;
li {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 8px;
.colorWrap {
display: flex;
align-items: center;
div {
width: 8px;
height: 8px;
}
span {
font-size: 14px;
color: #666666;
line-height: 20px;
margin-left: 16px;
}
}
}
.num {
font-size: 14px;
font-weight: 400;
color: #333333;
line-height: 20px;
}
}
}
.btn {
::v-deep .el-button [class*=iconfont] + span {
margin-left: 0;
}
}
.timeSelect {
.el-input__inner {
width: 120px !important;
}
}
.operation {
overflow: hidden;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 64px;
line-height: 64px;
display: flex;
z-index: 1000;
align-items: center;
justify-content: center;
background-color: #f3f6f9;
box-shadow: inset 0 1px 0 0 #eeeeee;
button {
width: 92px;
height: 32px;
padding: 0 !important;
}
.delete-btn {
background-color: #fff;
}
}
.mask {
.content {
padding-bottom: 100px;
}
.el-table {
border: 1px solid #D8E0E8;
border-bottom: 0;
}
p {
line-height: 28px;
text-align: right;
width: 88px;
float: right;
padding-bottom: 8px;
}
.el-dialog__header {
text-align: center;
}
}
.el-table thead.is-group th {
background: #fff;
}
.totalTitle {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
padding: 16px 0;
border-bottom: 1px solid rgb(238, 238, 238);
li {
display: flex;
flex-direction: column;
align-items: center;
span:nth-child(1) {
font-size: 24px;
font-weight: bold;
color: #E03416;
line-height: 28px;
}
span:nth-child(2) {
font-size: 12px;
color: #666666;
line-height: 16px;
}
}
}
}
</style>

View File

@@ -0,0 +1,999 @@
<template>
<div class="addThreeMeeting">
<ai-detail>
<ai-title slot="title" :title="`${form.id?'编辑':'添加'}三会一课`" isShowBack @onBackClick="$parent.goBack()"
isShowBottomBorder/>
<template #content>
<ai-card>
<template #content>
<el-form :model="form" label-width="100px" ref="basicForm" :rules="fromRules" size="small">
<ai-title title="基本信息" isShowBottomBorder/>
<el-form-item label="会议分类:" prop="meetingClassification">
<el-checkbox-group v-model="form.meetingClassification">
<el-checkbox :label="op.dictValue" v-for="(op,j) in dict.getDict('meetingClassification')" :key="j">
{{ op.dictName }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item prop="meetingAgenda" label="会议名称:" ref="fromTitle">
<el-input
v-model="form.meetingAgenda"
placeholder="限30字"
clearable
:maxLength="30"
/>
</el-form-item>
<el-form-item prop="appThreeMeetingOrganizationList" label="与会组织:"
ref="appThreeMeetingOrganizationList">
<div class="organ" @click="showDialogVisible()">
<span v-if="form.appThreeMeetingOrganizationList.length">
<span v-for="(item,i) in form.appThreeMeetingOrganizationList" :key="item.name"
class="organzation">{{ item.name || item.organizationName }}
<span class="iconfont iconOverrule" @click.stop="delate(i)"></span>
</span>
</span>
<span v-else>请选择</span>
</div>
</el-form-item>
<el-form-item prop="isOnline" label="举办方式">
<!-- <el-radio label="1" v-model="form.isOnline">线上举办</el-radio>-->
<el-radio label="0" v-model="form.isOnline">线下举办</el-radio>
</el-form-item>
<el-form-item prop="meetingAddress" label="会议地点:" v-if="form.isOnline==0">
<el-input
v-model="form.meetingAddress"
placeholder="限60字"
clearable
:maxLength="60"
/>
</el-form-item>
<el-row type="flex" justify="space-between">
<el-form-item prop="startTime" label="开始时间:" ref="startTime">
<el-date-picker @change="dataChange()"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
v-model="form.startTime"
placeholder="请选择..."
/>
</el-form-item>
<el-form-item prop="endTime" label="结束时间:" ref="endTime">
<el-date-picker @change="dataChange()"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
v-model="form.endTime"
placeholder="请选择..."
:disabled="!Boolean(form.startTime)"
></el-date-picker>
</el-form-item>
</el-row>
<el-form-item label="会议说明:" prop="meetingDescription" calss="uedtor" style="margin-top: 16px;">
<ai-editor v-model="form.meetingDescription" :instance="instance"/>
</el-form-item>
<el-form-item label="附件:">
<ai-uploader :instance="instance" v-model="form.fileList" fileType="file"
:limit="9"></ai-uploader>
</el-form-item>
<ai-title title="人员设置" isShowBottomBorder/>
<div class="person">
<el-form-item label="与会人员:" prop="participantList" label-width="106px" ref="participantList">
<div class="select-person" v-for="(item,index) in form.participantList" :key="item.name"
style="margin-bottom: 36px;">
<div class="person-pictrue" style="cursor: pointer;" @click="selectHost(index)">
<img :src="item.avatarUrl" alt="" v-if="item.avatarUrl"
style="position: absolute;left: 0;top:0;">
<div
style="overflow: hidden;width:40px;white-space: nowrap;background-color:#2266FF;border-radius:50%;"
v-else>{{ item.name }}
</div>
<span class="host">主持人</span>
<span class="iconfont del-icon iconOverrule" @click.stop="deletePerson(index)"></span>
</div>
<span class="person-name">{{ item.name }}</span>
<span style="position: absolute;left: 0;top: 60px;color: #2266FF;" v-if="item.isHost">
<span class="iconfont iconzxjyzdls" style="color: #8899BB;"></span>
<span style="font-size: 12px;">主持人</span>
</span>
</div>
<ai-party-member
:instance="instance"
customCliker
dialogTitle="添加人员"
v-model="form.participantList"
:key="partyKey"
customOrg
v-if="isShowChooseUser"
:disable="hostDisable"
:area-id="areaId"
:partyOrgList="form.appThreeMeetingOrganizationList"
@change="handleSelectParty">
<div class="select-person add-person">
<div class="add-icon"><span class="el-icon-plus icon-add"></span></div>
<span class="person-name">选择</span>
</div>
</ai-party-member>
</el-form-item>
<span class="tips">*从党员用户中选择必须设置一名主持人(点击与会人员头像设置或变更主持人)</span>
</div>
<div class="person">
<el-form-item label="纪要负责人:" label-width="106px" style="width:100%;margin-bottom: 0;"
ref="recorderList">
<ai-person-select :customClicker="true" :chooseUserList="form.recorderList" customRightText
:instance="instance" url="/admin/user/pageForWeb" headerTitle="人员列表"
dialogTitle="选择" @selectPerson="changeRecorderList">
<template v-slot:option="{ item }">
<span class="iconfont iconProlife">{{ item.name }}</span>
<span>{{ item.phone }}</span>
</template>
</ai-person-select>
</el-form-item>
<span class="tips">*从系统用户中选择拥有签到管理权限</span>
</div>
<ai-title title="会议投票设置" isShowBottomBorder/>
<el-form-item label="是否投票:">
<el-radio v-for="op in dict.getDict('yesOrNo')"
:key="op.dictValue" :label="op.dictValue" v-model="form.isVote">
{{ op.dictName }}
</el-radio>
</el-form-item>
<template v-if="form.isVote==1">
<el-form-item label="投票主题:" prop="voteTopic">
<el-input type="textarea" v-model="form.voteTopic" maxlength="80" show-word-limit rows="4"/>
</el-form-item>
<el-form-item label="投票选项:" required>
<el-radio label="1" v-model="voteOps">同意/不同意</el-radio>
</el-form-item>
<el-form-item label="投票形式:" prop="anonymous">
<ai-select v-model="form.anonymous" :selectList="dict.getDict('ThreeMeetingAnonymous')"/>
</el-form-item>
<el-form-item label="截止时间:" prop="voteDeadline">
<el-date-picker v-model="form.voteDeadline" type="datetime" placeholder="请选择"
value-format="yyyy-MM-dd HH:mm:ss"/>
</el-form-item>
</template>
<ai-title title="其他设置" isShowBottomBorder/>
<el-form-item v-if="form.isOnline==0" label="签到方式:" prop="signMethod">
<el-radio-group v-model="form.signMethod">
<el-radio label="1">签到</el-radio>
<el-radio label="0">不签到</el-radio>
</el-radio-group>
</el-form-item>
<div class="person" v-if="form.signMethod=='1'">
<el-form-item label="签到负责人:" label-width="106px" style="width:100%" ref="chargeOfSignInList">
<ai-person-select :customClicker="true" :chooseUserList="form.chargeOfSignInList"
:instance="instance" customRightText url="/admin/user/pageForWeb"
headerTitle="人员列表" dialogTitle="选择" :isMultiple="true"
@selectPerson="changeCharge">
<template v-slot:option="{ item }">
<span class="iconfont iconProlife">{{ item.name }}</span>
<span>{{ item.phone }}</span>
</template>
</ai-person-select>
</el-form-item>
<span class="tips">*从系统用户中选择拥有签到管理权限</span>
</div>
<div class="areaList" v-if="form.signMethod=='1'">
<el-form-item label="签到时间:" style="width:100%;"
:prop="form.signMethod=='1'?'meetingBefore':'meetingBeforeCo'">
会议开始时间前
<el-input v-model="form.meetingBefore" class="time-input"
oninput="value=value.replace(/[^\d]/g,'')"></el-input>
分钟至会议开始时间后
<el-input v-model="form.meetingAfter" class="time-input"
oninput="value=value.replace(/[^\d]/g,'')"></el-input>
分钟可进行签到
<P>
可签到时间为
<span style="color:#5088FF"
v-if="form.meetingBefore&&form.meetingAfter&&form.startTime">({{ signStart }} ~ {{
signEnd
}})</span>
<span style="color:#5088FF" v-else>-</span>
</P>
</el-form-item>
</div>
<el-form-item label="提醒方式:" style="width:100%;" prop="reminderMethod">
<el-checkbox-group v-model="form.reminderMethod">
<el-checkbox label="5" style="width: 100%;"
:disabled="form.reminderMethod.indexOf('0')>-1 || form.reminderMethod.indexOf('1')>-1||form.reminderMethod.indexOf('2')>-1||form.reminderMethod.indexOf('3')>-1 || form.reminderMethod.indexOf('4')>-1">
不提醒
</el-checkbox>
<el-checkbox label="0" style="width: 16%;" :disabled="form.reminderMethod.indexOf('5') > -1">立即通知
</el-checkbox>
<el-checkbox label="1" style="width: 16%;" :disabled="form.reminderMethod.indexOf('5') > -1">提前10分钟
</el-checkbox>
<el-checkbox label="2" style="width: 16%;" :disabled="form.reminderMethod.indexOf('5') > -1">提前30分钟
</el-checkbox>
<el-checkbox label="3" style="width: 16%;" :disabled="form.reminderMethod.indexOf('5') > -1">提前1小时
</el-checkbox>
<el-checkbox label="4" style="width: 16%;" :disabled="form.reminderMethod.indexOf('5') > -1">提前2小时
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
</template>
</ai-card>
</template>
<template #footer>
<el-button size="small" @click="confirm()">取消</el-button>
<el-button type="primary" size="small" @click="confirm('1')">立即发布</el-button>
<el-button size="small" @click="confirm('0')">保存</el-button>
</template>
</ai-detail>
<el-dialog width="644px" title="选择党组织" :visible.sync="dialogVisible" class="select-party">
<div>
<el-row type="flex" justify="space-between">
<el-row class="search-panel" type="flex" justify="space-between">
<div class="add-item" style="padding-bottom:3px;overflow-x: hidden">
<p class="add_top">
<span>党组织</span>
<el-input placeholder="党组织名称" size="small" style="width:166px;" clearable
suffix-icon="el-icon-search"
v-model="filterText"></el-input>
</p>
<div class="tree_list">
<el-tree
:data="treeData"
show-checkbox
node-key="id"
ref="partyTree"
:filter-node-method="filterNode"
@check-change="handleCheckChange"
:highlight-current="true"
:props="defaultProps">
</el-tree>
</div>
</div>
</el-row>
<div class="selected-people add-item">
<p class="add_top">
<span>已选择</span>
<el-button icon="iconfont iconDelete" size="mini"
@click="clearSelect()">清空
</el-button>
</p>
<div class="add_tag" v-if="selectParty.length" style="width:100%;">
<el-tag v-for="(item,i) in selectParty" :disable-transitions="true" :key="item.name" type="info">
{{ item.name }}
<span class="iconfont iconOverrule icon-color89B" style="float: right;"
@click.stop="cancelSelect(i)"></span>
</el-tag>
</div>
<div class="add_tag" v-else
style="display:flex;align-items:center;justify-content:center;width:100%;">
<span>暂无数据</span>
</div>
</div>
</el-row>
</div>
<div slot="footer" style="text-align: center;">
<el-button style="width:92px" size="small" class="delete-btn" @click="dialogVisible=false">取消
</el-button>
<el-button style="width:92px" size="small" type="primary"
@click="dialogVisible=false,confirmSelect()">确认
</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {mapState} from "vuex";
import moment from 'dayjs';
export default {
name: "add",
props: {
instance: Function,
dict: Object,
permissions: Function,
detail: Object,
},
computed: {
...mapState(["user"]),
hostDisable() {
if (!this.form.meetingUser) return []
const list = [
...this.form.chargeOfSignInList,
...this.form.participantList,
...this.form.recorderList
]
return list || []
},
color() {
return ["#FF4466", "#2EA222", "#2266FF", "#FF8822", "#333333"]
},
},
data() {
const endTimePass = (rule, value, callback) => {
if (value) {
if (moment(value).unix() - moment(this.form.startTime).unix() > 0) {
callback()
} else {
callback(new Error('结束时间要大于开始时间'));
}
} else {
callback(new Error('请填写结束时间'));
}
}
const startTimePass = (rule, value, callback) => {
if (value) {
if (moment(value).unix() - moment(new Date()).unix() > 0) {
callback()
} else {
callback(new Error('开始时间要大于当前时间'));
}
} else {
callback(new Error('请填写开始时间'));
}
}
return {
form: {
meetingClassification: [], //会议分类
meetingAgenda: "", //会议名称
meetingAddress: "",//会议地点
meetingDescription: "",//会议说明
hostList: [], //主持人
meetingBefore: "",
meetingAfter: "",
startTime: "",//开始时间
endTime: "",//结束时间
reminderMethod: ["5"],//提醒方式,默认不签到
signMethod: "0",//签到方式 默认不签到
appThreeMeetingOrganizationList: [],//组织
participantList: [],//与会人员
recorderList: [],//纪要负责人
chargeOfSignInList: [],//签到负责人
annex: "",
fileList: [],
isOnline: "0",
isVote: "0"
},
signStart: "",
signEnd: "",
areaId: "",
voteOps: '1',
fromRules: {
meetingClassification: [{required: true, message: "请选择会议分类", trigger: "change"}],
meetingAgenda: [{required: true, message: "请输入会议名称", trigger: "change"}],
meetingAddress: [{required: true, message: "请输入会议地点", trigger: "change"}],
isOnline: [{required: true, message: "请选择举办方式", trigger: "change"}],
voteTopic: [{required: true, message: "请输入投票主题", trigger: "change"}],
anonymous: [{required: true, message: "请选择投票形式", trigger: "change"}],
voteDeadline: [{required: true, message: "请选择截止时间", trigger: "change"}],
meetingDescription: [{required: true, message: "请输入补充说明", trigger: "change"}],
meetingBefore: [{required: true, message: '请填写签到时间', trigger: "change"}],
meetingBeforeCo: [{required: false, message: '请填写签到时间', trigger: "change"}],
startTime: [{required: true, validator: startTimePass, trigger: "change"}],
endTime: [{required: true, validator: endTimePass, trigger: "change"}],
signMethod: [{required: true, message: "请选择签到方式", trigger: "change"}],
reminderMethod: [{required: true, message: "请选择提醒方式", trigger: "change"}],
hostList: [{required: true, message: "请选择主持人", trigger: "change"}],
recorderList: [{required: true, message: "请选择纪要负责人", trigger: "change"}],
chargeOfSignInList: [{required: true, message: "请选择签到负责人", trigger: "change"}],
participantList: [{required: true, message: "请选择与会人员", trigger: "change"}],
appThreeMeetingOrganizationList: [{required: true, message: "请选择党组织", trigger: "change"}]
},
defaultProps: {
children: 'children',
label: 'name'
},
treeData: [],//tree
dialogVisible: false,//弹窗
filterText: "",//tree模糊搜索
selectParty: [],//选中的党组织
partyKey: 1,
isShowChooseUser: true,
search: {
postStatus: "",
meetingUserName: "",
},
};
},
watch: {
filterText(val) {
this.$refs.partyTree.filter(val);
},
selectParty(newVal) {
++this.partyKey
if (!newVal.length) {
this.isShowChooseUser = false
this.$nextTick(() => {
setTimeout(() => {
this.isShowChooseUser = true
}, 1000)
})
}
this.$set(this.form, 'hostList', [])
this.$set(this.form, 'recorderList', [])
this.$set(this.form, 'chargeOfSignInList', [])
this.$set(this.form, 'participantList', [])
},
form: {
handler(newVal) {
if (newVal.startTime && newVal.meetingBefore) {
let d = new Date(newVal.startTime);
let time = d.getTime();
let min = (Number(newVal.meetingBefore)) * 60000
let total = time - min;
this.signStart = this.$moment(total).format('YYYY-MM-DD HH:mm:ss');
}
if (newVal.startTime && newVal.meetingAfter) {
let d = new Date(newVal.startTime);
let time = d.getTime();
let min = (Number(newVal.meetingAfter)) * 60000
let total = time + min;
this.signEnd = this.$moment(total).format('YYYY-MM-DD HH:mm:ss');
}
},
deep: true
}
},
methods: {
deletePerson(index) {
if (this.form.participantList[index].isHost) {
this.form.participantList.map(e => {
this.$set(e, "isHost", false);
})
}
this.form.participantList.splice(index, 1);
},
//选择主持人
selectHost(index) {
this.form.participantList.map(e => {
e.isHost = false;
})
this.form.participantList[index].isHost = true;
},
//开始时间,结束时间验证
dataChange() {
this.$refs.startTime.$emit('el.form.change');
this.$refs.endTime.$emit('el.form.change');
if (!this.form.startTime) {
this.form.endTime = null
}
},
//与会人员
handleSelectParty() {
this.form.participantList.map(e => {
e.meetingUserRole = "3";
e.userName = e.name;
this.$set(e, "isHost", false);
})
},
//纪要负责人
changeRecorderList(val) {
if (val) {
this.$set(val, "meetingUserRole", "1");
this.$set(val, "userName", val.name);
this.form.recorderList.splice(0, 1, val);
} else {
this.form.recorderList = [];
}
},
//签到负责人
changeCharge(val) {
val.map((e) => {
this.$set(e, "meetingUserRole", "2");
this.$set(e, "userName", e.name);
})
this.form.chargeOfSignInList = val;
},
//参与人
changeParticipantList(val) {
this.$set(val, "meetingUserRole", "3");
this.$set(val, "userName", val.name);
this.form.participantList.push(val);
},
//保存提交表单验证
confirm(status) {
if (status == '1') {
this.$refs.basicForm.validate(validate => {
if (validate) {
this.addUpdate(status);
}
});
} else if (status == '0') {
if (this.form.meetingAgenda == "") {
return this.$message.error("请填写会议名称");
} else if (!this.form.appThreeMeetingOrganizationList.length) {
return this.$message.error("请选择与会组织");
} else {
this.addUpdate(status);
}
} else { //取消返回主页
this.$confirm('是否放弃编辑内容').then(() => {
this.$parent.goBack();
});
}
},
//新增
addUpdate(status) {
let hasHost = false;
this.form.participantList.map(e => {
if (e.isHost) {
hasHost = true;
this.form.hostList.push({
...e,
meetingUserRole: "0"
})
}
})
if (!hasHost && status == '1') {
return this.$message.error("请选择主持人");
}
if (this.form.signMethod == '0') {
this.form.chargeOfSignInList = [];
this.form.meetingBefore = "";
this.form.meetingAfter = "";
}
//会议分类
this.form.meetingClassification = this.form.meetingClassification.join(",");
//提醒方式
this.form.reminderMethod = this.form.reminderMethod.join(",");
//发布状态
let postStatus = status;
let appThreeMeetingUserList = [];
let meetingList = [];
//选择人员
meetingList = [...this.form.hostList, ...this.form.recorderList, ...this.form.chargeOfSignInList, ...this.form.participantList]
meetingList.forEach(i => {
appThreeMeetingUserList.push({
"meetingUserId": i.id,
"meetingUserName": i.name,
"meetingUserRole": i.meetingUserRole,
"avatarUrl": i.avatarUrl ? i.avatarUrl : ""
})
})
//附件
this.form.annex = JSON.stringify(this.form.fileList);
if (this.form.meetingBefore === '' && this.form.signMethod != 0) {
this.form.meetingBefore = 60
}
if (this.form.meetingAfter === '' && this.form.signMethod != 0) {
this.form.meetingAfter = 60
}
this.instance.post(`/app/appthreemeetinginfo/addOrUpdate`, {
...this.form,
...this.form.file,
...this.form.meetingUser,
appThreeMeetingUserList,
postStatus,
id: this.detail.id
}).then(res => {
if (res && res.code == 0) {
this.$message.success(status == '1' ? "会议新增成功" : "保存成功");
this.$parent.goBack();
}
})
},
//获取会议详请
getDetailInfo() {
this.instance.post(`/app/appthreemeetinginfo/queryDetailById?id=${this.detail.id}`).then(res => {
if (res && res.data) {
this.form = res.data
this.form.meetingClassification = res.data.meetingClassification.split(",");
this.form.meetingAgenda = res.data.meetingAgenda;
this.form.meetingAddress = res.data.meetingAddress;
this.form.startTime = res.data.startTime;
this.form.endTime = res.data.endTime;
this.form.appThreeMeetingOrganizationList = res.data.appThreeMeetingOrganizationList;
this.form.meetingDescription = res.data.meetingDescription;
this.form.fileList = JSON.parse(res.data.annex || '[]');
this.form.participantList = res.data.participantList.map(e => {
return {
...e,
name: e.meetingUserName,
isHost: res.data.hostList.length ? (e.id == res.data.hostList[0].id) : false
}
});
this.form.recorderList = res.data.recorderList.map(e => {
return {...e, name: e.meetingUserName}
});
this.form.chargeOfSignInList = res.data.chargeOfSignInList.map(e => {
return {...e, name: e.meetingUserName}
});
this.form.signMethod = res.data.signMethod;
this.form.reminderMethod = res.data.reminderMethod.split(",");
this.form.meetingBefore = res.data.meetingBefore;
this.form.meetingAfter = res.data.meetingAfter;
}
});
},
//显示树结构
showDialogVisible() {
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.partyTree.setCheckedNodes(
this.form.appThreeMeetingOrganizationList
);
});
},
// 查询所有党组织 树形结构
searchSysAll() {
this.instance
.post("/admin/partyOrganization/queryAllChildren", null, {
params: {id: this.user.info.organizationId}
})
.then(res => {
if (res && res.code == 0) {
res.data = res.data.map(a => {
return {...a};
});
this.treeData = res.data.filter(
e => e.id == this.user.info.organizationId
);
this.treeData.map(t => this.addChild(t, res.data));
if (this.filterText) {
this.$nextTick(() => {
this.$refs.partyTree.filter(this.filterText);
});
}
}
});
},
//节点过滤/搜索
filterNode(value, data) {
if (!value) return true;
return data.name.indexOf(value) !== -1;
},
//选中的数据
handleCheckChange() {
this.selectParty = this.$refs.partyTree.getCheckedNodes()
},
//取消选择
cancelSelect(index) {
this.selectParty.splice(index, 1)
this.$refs.partyTree.setCheckedNodes(this.selectParty);
},
//删除选择
delate(index) {
let parentId = this.form.appThreeMeetingOrganizationList[index].parentId
this.form.appThreeMeetingOrganizationList.splice(index, 1);
this.form.appThreeMeetingOrganizationList.map((item, i) => {
if (item.id == parentId) {
this.delate(i)
}
})
this.form.hostList = []
this.form.recorderList = []
this.form.chargeOfSignInList = []
this.form.participantList = []
},
//清空
clearSelect() {
this.$refs.partyTree.setCheckedKeys([]);
this.selectParty = [];
this.form.hostList = []
this.form.recorderList = []
this.form.chargeOfSignInList = []
this.form.participantList = []
},
//确认选择
confirmSelect() {
this.form.appThreeMeetingOrganizationList = this.selectParty;
},
},
created() {
this.areaId = this.user.info.areaId;
this.dict.load('yesOrNo', 'ThreeMeetingAnonymous', "meetingClassification", "feminderMethod", "addSignMethod", "postStatus").then(() => {
this.searchSysAll();
if (this.detail && this.detail.id) {
this.getDetailInfo();
}
});
},
filters: {
formatTime(time) {
return moment(time).format("YYYY-MM-DD HH:mm");
}
}
};
</script>
<style scoped lang="scss">
.addThreeMeeting {
height: 100%;
::v-deep .el-form {
.ailist-title {
padding-left: 0;
margin-bottom: 8px;
}
.el-form-item {
.el-date-editor {
width: 100%;
}
}
}
::v-deep .el-dialog__body {
padding-top: 16px !important;
}
.host {
font-size: 12px;
width: 40px;
height: 40px;
display: inline-block;
position: absolute;
left: 0;
top: 0;
color: #ffffff;
background-color: transparent;
border-radius: 50%;
opacity: 0;
&:hover {
opacity: 1;
background-color: #AAAAAA;
}
}
::v-deep .el-upload--picture-card {
width: 84px !important;
height: 84px !important;
line-height: 30px !important;
background: rgba(245, 245, 245, 1) !important;
border-radius: 2px !important;
border: none !important;
}
.tips {
box-sizing: border-box;
padding: 0 106px;
font-size: 12px;
color: #999999;
line-height: 16px;
}
.person {
width: 100%;
margin-top: 16px;
.emcee {
position: absolute;
left: 0;
top: 0;
color: #2266FF;
padding: 0 106px;
font-size: 12px;
line-height: 16px;
}
.select-person {
display: flex;
flex-direction: column;
position: relative;
// width:70px;
margin: 0 15px;
height: 70px;
justify-content: center;
align-items: center;
.person-pictrue {
width: 54px;
height: 54px;
border-radius: 50%;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
position: relative;
img {
width: 40px;
height: 40px;
border-radius: 50%;
}
.del-icon {
position: absolute;
top: -12px;
right: -4px;
font-size: 16px;
color: #333;
width: 20px;
height: 24px;
border-radius: 50%;
background-color: #fff;
}
}
.person-name {
font-size: 14px;
color: #666;
line-height: normal;
}
}
::v-deep .el-form-item__content {
display: flex;
flex-wrap: wrap;
}
.add-person {
display: flex;
flex-direction: column;
position: relative;
// width:70px;
margin: 0 15px;
height: 70px;
justify-content: center;
align-items: center;
.add-icon {
width: 40px;
height: 40px;
line-height: 40px;
margin: 0 auto 4px;
text-align: center;
font-size: 20px;
color: #2266FF;
border: 1px dashed #2266ff;
border-radius: 50%;
box-sizing: border-box;
.icon-add {
color: #2266FF;
font-size: 20px;
margin-top: 5px;
}
}
}
}
::v-deep p.add_top {
margin: 0;
}
.time-input {
width: 48px;
height: 32px;
margin: 0 8px;
::v-deep .el-input__inner {
line-height: 32px;
height: 32px;
padding: 0 10px;
}
}
::v-deep .select-party {
.el-dialog__header {
padding: 13px 16px;
border-bottom: 1px solid #eee;
}
.el-dialog__body {
padding: 24px 40px 48px;
}
.el-tree {
background-color: #fcfcfc;
height: calc(100% - 40px);
width: 350px;
}
.add-item {
width: 274px;
height: 360px;
background: rgba(252, 252, 252, 1);
border-radius: 2px;
border: 1px solid rgba(208, 212, 220, 1);
position: relative;
overflow: auto;
box-sizing: border-box;
margin: 0;
.add_top {
width: 100%;
height: 40px;
background: rgba(245, 245, 245, 1);
border-bottom: 1px solid rgba(208, 212, 220, 1);
padding: 0 8px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: center;
}
.tree_list {
width: 100%;
overflow: auto;
height: calc(100% - 40px);
}
.add_buttom {
position: absolute;
left: 0;
bottom: 0;
font-size: 12px;
width: 310px;
height: 32px;
line-height: 32px;
z-index: 10000;
background: rgba(245, 246, 247, 1);
color: rgba(51, 51, 51, 1);
box-shadow: 0 1px 0 0 rgba(216, 220, 227, 1);
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
.add_tag {
width: 310px;
height: calc(100% - 40px);
overflow-y: auto;
.el-tag {
margin: 8px 8px 0 8px;
background: rgba(238, 238, 238, 1);
border: none;
color: #666;
max-width: calc(100% - 16px);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
::v-deep .el-tag .el-icon-close {
color: #666;
}
}
}
}
.organ {
width: auto;
height: auto;
padding: 0 10px;
line-height: 32px;
border: 1px solid #D0D4DC;
border-radius: 5px;
cursor: pointer;
box-sizing: border-box;
color: #666;
.organzation {
background-color: #eee;
margin-right: 4px;
padding: 4px;
}
}
}
</style>

View File

@@ -0,0 +1,452 @@
<!--suppress ALL -->
<template>
<section class="appThreeMeetingUser init-list-table bg369">
<ai-title title="统计详情" isShowBack @onBackClick="$parent.goBack()" isShowBottomBorder></ai-title>
<div class="main-content">
<el-row class="searchBar border-radius2" type="flex" justify="space-between" :style="search.style" :gutter="2" style="border-bottom: 1px solid #eee;">
<el-col style="margin-bottom:6px">
<el-row :gutter="8" type="flex">
<section v-for="(item,i) in columns" :key="i">
<el-col v-if="item.type=='select'" :span="4">
<el-select size="small" v-model="search[item.prop]" :placeholder=" item.label" @change="$forceUpdate(),page.current=1,getAppThreeMeetingUser()" clearable>
<el-option v-for="(op,j) in dict.getDict(item.dict)" :key="j" :label="op.dictName"
:value="op.dictValue"/>
</el-select>
</el-col>
<el-col v-else-if="item.type=='time'" :span="8" type="flex">
<span class="dateTitle">{{item.label}}</span>
<el-date-picker size="small" v-model="search[item.prop]" placeholder="请选择" type="daterange"
:start-placeholder="item.prop+'开始时间'"
:end-placeholder="item.prop+'结束日期'"></el-date-picker>
</el-col>
<el-col v-else-if="item.type=='num'" :span="8" style="display: flex;" type="flex">
<span class="dateTitle">{{item.label}}</span>
<ai-range v-model="search[item.prop]" />
</el-col>
</section>
</el-row>
</el-col>
<el-col style="width: auto;display: flex;margin-bottom:6px">
<el-col>
<el-input size="small" v-model="search.meetingUserName" placeholder="姓名"
prefix-icon="iconfont iconSearch" clearable @keyup.enter.native="page.current=1,getAppThreeMeetingUser()"></el-input>
</el-col>
<el-button size="mini" type="primary" icon="iconfont iconSearch" style="margin-left:5px;"
@click="page.current=1,getAppThreeMeetingUser()">查询
</el-button>
<el-button size="mini" icon="el-icon-refresh-right" style="margin-left:5px;" @click="resetSearch">
重置
</el-button>
</el-col>
</el-row>
<el-table ref="multipleTable" :data="tableData" style="margin-top:16px;"
header-cell-class-name="table-header"
tooltip-effect="light" row-class-name="table-row" cell-class-name="table-cell" @selection-change="handleSelectionChange">
<el-table-column prop="meetingUserName" label="姓名" align="center">
<div slot-scope="{row}">{{row.meetingUserName || "-"}}</div>
</el-table-column>
<el-table-column prop="joinStatus" label="参会情况" align="center">
<div slot-scope="{row}"> {{dict.getLabel('joinStatus',row.joinStatus)||'-'}}</div>
</el-table-column>
<el-table-column prop="absence" label="请假原因">
<div slot-scope="{row}">{{row.absence || "-"}}</div>
</el-table-column>
<el-table-column prop="signMethod" label="签到方式" align="center">
<div slot-scope="{row}"> {{dict.getLabel('signMethod',row.signMethod)||'-'}}</div>
</el-table-column>
<el-table-column prop="signStatus" label="签到状态" align="center">
<div slot-scope="{row}"> {{dict.getLabel('signStatus',row.signStatus)||'-'}}</div>
</el-table-column>
<el-table-column prop="signTime" label="签到时间" align="center">
<div slot-scope="{row}">{{row.signTime || "-"}}</div>
</el-table-column>
<el-table-column prop="signUserName" label="代签人" align="center">
<div slot-scope="{row}">{{row.signUserName || "-"}}</div>
</el-table-column>
<el-table-column prop="operate" label="操作" width="240" align="center">
<div slot-scope="{row}">
<span class="iconfont iconqiandao icon-color89B" style="cursor: pointer;"
title="签到" @click="changeStatus(row, 0)" v-if="row.signMethod != 1"></span>
<span class="iconfont iconqingjia icon-color89B" style="cursor: pointer;"
title="请假" @click="changeStatus(row, 1)"></span>
<span class="iconfont iconRepulse icon-color89B" style="cursor: pointer;"
title="重置" v-if="meetingStatus != 4" @click="changeStatus(row, 2)"></span>
</div>
<!-- <el-radio-group slot-scope="{row}" v-model="row.operation" @change="changeStatus(row)">
<el-radio :label="0">签到</el-radio>
<el-radio :label="1">请假</el-radio>
<el-radio :label="2" v-if="meetingStatus != 4">重置</el-radio>
</el-radio-group> -->
</el-table-column>
<div slot="empty" class="no-data" style="height:160px;"></div>
</el-table>
<div class="pagination">
<el-pagination background
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
layout="total,prev, pager, next,sizes, jumper"
:total="page.total">
</el-pagination>
</div>
</div>
<el-dialog :visible.sync="leaveMask" title="请假" width="520px" class="mask label-110"
:close-on-click-modal="false"
:before-close="maskInit" @close="maskInit">
<div class="content input-240">
<el-form ref="leaveMask" :rules="rules" :model="leaveInfo" label-width="100px">
<el-form-item label="请假原因:" class="user" prop="leaveText">
<el-input type="textarea" :rows="3" v-model="leaveInfo.leaveText" placeholder="请输入请假原因"/>
</el-form-item>
</el-form>
</div>
<div class="operation">
<el-button class="delete-btn" @click="maskInit" mini>取消</el-button>
<el-button type="primary" @click="confirmMask('leaveMask')" mini>确认</el-button>
</div>
</el-dialog>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "appThreeMeetingUser",
props: {
instance: Function,
dict: Object,
permissions: Function,
meetingId:String,
detail: Object,
meetingStatus: String
},
data() {
return {
activeName: 'first',
tableData: [],
columns: [
{
label: '编号',
prop: 'id',
type: '',
dict: ''
},
{
label: '会议编号',
prop: 'meetingId',
type: '',
dict: ''
},
{
label: '参会人员角色',
prop: 'meetingUserRole',
type: '',
dict: 'meetingUserRole'
},
{
label: '会议人员编号',
prop: 'meetingUserId',
type: '',
dict: ''
},
{
label: '会议人员姓名',
prop: 'meetingUserName',
type: '',
dict: ''
},
{
label: '参会情况',
prop: 'joinStatus',
type: 'select',
dict: 'joinStatus'
},
{
label: '签到状态',
prop: 'signStatus',
type: 'select',
dict: 'signStatus'
},
{
label: '签到方式',
prop: 'signMethod',
type: 'select',
dict: 'signMethod'
},
{
label: '请假原因',
prop: 'absence',
type: '',
dict: ''
},
{
label: '创建时间',
prop: 'createDate',
type: '',
dict: ''
},
{
label: '签到人',
prop: 'signUserId',
type: '',
dict: ''
},
{
label: '签到时间',
prop: 'signTime',
type: '',
dict: ''
},
{
label: '操作',
prop: 'operate',
type: '',
dict: ''
},
],
search: {
style: {},
meetingUserName: "",
meetingId:""
},
page: {
current: 1,
size: 10,
total: 0,
},
leaveMask: false,
leaveInfo: {
leaveText: ''
},
rules: {
leaveText: [{ required: true, message: '请输入请假原因', trigger: 'blur' }]
},
meetingInfo: {}, //点击操作的item
}
},
methods: {
confirmMask(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.signMeeting(0, 1, '', this.leaveInfo.leaveText, this.user.info.id, this.user.info.name, '', '请假成功')
} else {
return false;
}
});
},
maskInit() {
this.leaveMask = false
},
changeStatus(item, operation) {
this.meetingInfo = item
if(this.meetingStatus == 0) { //0未发布 1已发布 2已取消 3进行中 4已结束
this.$message({ message: '会议未发布,请发布后再操作', type: 'warning'});
return
}
if(item.meetingSignMethod == 1) { //签到方式为不签到
this.$message({ message: '签到方式选择为不签到,不可操作', type: 'warning'});
return
}
if(this.meetingStatus == 1) {
let d = new Date()
let time = item.meetingBefore
let beginTimestamp = new Date(time.replace(/\-/g, "\/"))
let newTimestamp = new Date(d.getFullYear() + '/' + (d.getMonth() + 1) + '/' + d.getDate() + ' ' + d.getHours() + ':' + d.getMinutes())
if (newTimestamp < beginTimestamp) {
this.$message({ message: '未到签到时间,不可操作', type: 'warning'});
return
}
}
if(this.meetingStatus == 2) {
this.$message({ message: '会议已取消,不可操作', type: 'warning'});
return
}
// if(this.meetingStatus == 3) {
// let d = new Date()
// let time = item.meetingAfter
// let endTimestamp = new Date(time.replace(/\-/g, "\/"))
// let newTimestamp = new Date(d.getFullYear() + '/' + (d.getMonth() + 1) + '/' + d.getDate() + ' ' + d.getHours() + ':' + d.getMinutes())
// if (endTimestamp > newTimestamp) { //代签
// this.operationStatus(operation)
// }
// }
if(!operation) { //0为签到
this.$confirm('确定签到吗?', '', {
type: 'info'
}).then(() => {
this.operationStatus(operation)
}).catch(() => {
return
});
}else {
this.operationStatus(operation)
}
},
operationStatus(status) {
if(status == 0) { //签到
let signTime = new Date().getFullYear() + '-' + this.isDate(new Date().getMonth() + 1) + '-' + this.isDate(new Date().getDate()) + ' ' + this.isDate(new Date().getHours()) + ':' + this.isDate(new Date().getMinutes()) + ':' + this.isDate(new Date().getSeconds())
this.signMeeting(1, 0, 1, '', this.user.info.id, this.user.info.name, signTime, '签到成功')
}
if(status == 1) { //请假
this.leaveMask = true
this.leaveInfo.leaveText = ''
}
if(status == 2) { //重置
this.$confirm(`确认将该成员签到状态重置吗?`, {type: 'warning'}).then(() => {
this.signMeeting('', '', '', '', '', '', '', '重置成功')
})
}
},
isDate(num) {
if(num < 10) {
num = '0' + num
}
return num
},
signMeeting(signStatus, joinStatus, signMethod, absence, signUserId, signUserName, signTime, succText) {
var params = {
signStatus,
joinStatus,
signMethod,
absence,
signUserId,
signUserName,
signTime,
id: this.meetingInfo.id,
meetingUserId: this.meetingInfo.meetingUserId,
meetingId: this.meetingInfo.meetingId
}
this.instance.post("/app/appthreemeetinguser/addOrUpdate", params).then(res => {
if(res.code==0){
this.maskInit()
this.$message.success(succText)
this.getAppThreeMeetingUser()
}
})
},
isPermit(params) {
return this.permissions ? this.permissions(params) : false
},
handleSelectionChange(){},
//分页
handleCurrentChange(val) {
this.page.current = val;
this.getAppThreeMeetingUser();
},
//分页
handleSizeChange(val){
this.page.size = val
this.page.current = 1
this.getAppThreeMeetingUser()
},
//重置
resetSearch() {
this.page.current = 1
this.page.size = 10
this.columns.map(c => {if(c.type) this.search[c.prop] = null})
Object.keys(this.search).forEach((e)=>{
this.search[e]=null;
})
this.getAppThreeMeetingUser()
},
//列表
getAppThreeMeetingUser() {
var meetingId = this.meetingId
this.instance.post("/app/appthreemeetinguser/list", null, {
params: {
...this.search,
...this.page,
meetingId
}
}).then(res => {
if(res.code==0){
this.tableData=res.data.records;
this.page.total=res.data.total;
this.tableData.map((item) => {
if(item.signStatus == 1) { //签到
item.operation = 0
}
if(item.joinStatus == 1) { //请假
item.operation = 1
}
return item
})
}
}
)
},
//请假,签到,取消代签
updateStatus(row,text){
var body = {};
if(text == '请假'){
body = {
id:row.id,
joinStatus:'1'
}
}
if(text == '签到'){
body = {
id:row.id,
signStatus:'1'
}
}
if(text == '取消代签'){
body = {
id:row.id,
signStatus:'0'
}
}
console.log(body)
this.$confirm(`是否${text}?`, {type: 'warning'}).then(() => {
this.instance.post("/app/appthreemeetinguser/addOrUpdate", body).then((res) => {
if(res.code ==0){
this.maskInit()
this.getAppThreeMeetingUser()
this.$message.success(`操作成功!`)
}
})
})
}
},
mounted() {
if (this.dict) this.dict.load(this.columns.map(e => e.type == 'select' ? e.dict : ''))
// console.log(this.detail)
this.resetSearch()
},
computed: {
...mapState(['user']),
}
}
</script>
<style scoped lang="scss">
.appThreeMeetingUser{
::v-deep .el-radio{
margin-right: 16px!important;
}
::v-deep .el-radio__label{
padding-left: 4px!important;
}
.operation {
overflow: hidden;
// position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 64px;
line-height: 64px;
display: flex;
align-items: center;
justify-content: center;
background-color: #f3f6f9;
box-shadow: inset 0 1px 0 0 #eeeeee;
}
::v-deep .el-textarea{
width: 362px;
}
}
</style>

View File

@@ -0,0 +1,714 @@
<template>
<div class="addThreeMeeting">
<ai-detail>
<ai-title slot="title" title="三会一课详请" isShowBack @onBackClick="$parent.goBack()" isShowBottomBorder/>
<template #content>
<ai-card title="会议详情">
<template #content>
<el-form size="small" label-suffix="" label-width="100px">
<ai-title :title="obj.meetingAgenda" isShowBottomBorder/>
<el-form-item label="会议分类">
<span v-for="(i,index) in dict.getDict('meetingClassification')" :key="index">
<span v-for="(b,indexs) in obj.meetingClassification" :key="indexs"
v-if="i.dictValue == b">
{{ i.dictName }}
<span v-if="indexs < (obj.meetingClassification.length - 1) ">,</span>
</span>
</span>
</el-form-item>
<el-form-item label="举办方式">{{ obj.isOnline == 1 ? '线上举办' : '线下举办' }}</el-form-item>
<el-form-item label="会议地点" v-if="obj.isOnline==0">{{ obj.meetingAddress || '-' }}</el-form-item>
<el-form-item label="会议说明">
<div v-html="obj.meetingDescription"/>
</el-form-item>
<el-row type="flex" justify="space-between">
<el-form-item label="开始时间">{{ obj.startTime || '-' }}</el-form-item>
<el-form-item label="结束时间">{{ obj.endTime || '-' }}</el-form-item>
</el-row>
<el-form-item label="签到方式">{{ dict.getLabel('addSignMethod', obj.signMethod || '-') }}</el-form-item>
<el-form-item label="签到时间">
<span class="value" v-if="obj.signMethod == 1">
会议开始时间前
<span style="color:#5088FF">{{ obj.meetingBefore }}</span>
分钟至会议开始时间后
<span style="color:#5088FF">{{ obj.meetingAfter }}</span> 分钟可进行签到
<div>可签到时间为 <span style="color:#5088FF">({{ signStart }} ~ {{ signEnd }})</span></div>
</span>
<span class="value" v-else>-</span>
</el-form-item>
<el-form-item label="提醒方式">
<span class="value"
v-if="obj.reminderMethod && obj.reminderMethod.length && obj.reminderMethod[0] !== ''">
<span v-for="(i,index) in dict.getDict('feminderMethod')" :key="index">
<span v-for="(b,indexs) in obj.reminderMethod" :key="indexs" v-if="i.dictValue == b">
{{ i.dictName }}
<span v-if="indexs < (obj.reminderMethod.length - 1) ">,</span>
</span>
</span>
</span>
<span class="value" v-else>-</span></el-form-item>
<ai-title title="附件" isShowBottomBorder>
<template #rightBtn>
<el-button type="text" icon="iconfont iconDownload" @click="downLoadAll">下载全部</el-button>
</template>
</ai-title>
<el-form-item label-width="0">
<div v-if="obj.annex.length">
<div class="flie" v-for="(item, index) in obj.annex" :key="index"
@click="downFile(item)">
<p>
<svg aria-hidden="true" style="width:24px;height:24px;">
<use xlink:href="#iconAppendix_UNdownload"></use>
</svg>
<span>{{ item.name }}</span>
</p>
<span style="color:#999;">{{ (item.size / 1024).toFixed(2) + "KB" }}
<span class="iconfont iconDownload" style="color:#5088FF"></span>
</span>
</div>
</div>
<div class="no-data" style="height:160px;width:100%;" v-else></div>
</el-form-item>
<ai-title title="人员信息" isShowBottomBorder/>
<el-form-item label="与会组织">{{ arrLabel(obj.appThreeMeetingOrganizationList, 'name') }}</el-form-item>
<el-form-item label="主持人">{{ arrLabel(obj.hostList, 'userName') }}</el-form-item>
<el-form-item label="记录人">{{ arrLabel(obj.recorderList, 'userName') }}</el-form-item>
<el-form-item label="签到负责人">{{ arrLabel(obj.chargeOfSignInList, 'userName') }}</el-form-item>
<el-form-item label="参与人">{{ arrLabel(obj.participantList, 'userName') }}</el-form-item>
</el-form>
</template>
</ai-card>
<ai-card title="会议纪要">
<template #content>
<el-form ref="ruleForm" size="small" label-suffix="" label-width="120px">
<ai-title title="会议纪要详情" isShowBottomBorder>
<template #rightBtn>
<template v-if="editable">
<el-button type="text" @click="cancelSummary()">取消</el-button>
<el-button type="text" @click="confirmSummary">保存</el-button>
</template>
<el-button v-else type="text" icon="iconfont iconEdit" @click="editForm">修改
</el-button>
</template>
</ai-title>
<el-form-item label="纪要负责人">{{ obj.recorderName || '-' }}</el-form-item>
<el-form-item label="上次编辑时间">{{ summaryObj.createTime|formatTime }}</el-form-item>
<template v-if="!editable">
<el-form-item label="纪要内容">
<div class="content" v-html="summaryObj.content ||'暂无内容'"/>
</el-form-item>
<el-form-item label="图片">
<span class="value" v-viewer>
<img v-for="(item, index) in summaryObj.images" :key="index" :src="item.url"
style="width: 84px;height:84px;margin: 0 16px 8px 0;">
</span></el-form-item>
</template>
<template v-if="editable">
<el-form-item label="纪要内容:">
<el-input
style="width: 90%;"
type="textarea"
:rows="16"
placeholder="请输入内容"
v-model="summaryObj.content">
</el-input>
</el-form-item>
<el-form-item label="图片:">
<ai-uploader :instance="instance" v-model="summaryObj.images" :limit="50"/>
</el-form-item>
</template>
</el-form>
</template>
</ai-card>
<ai-card title="人员签到">
<template #content>
<el-form>
<ai-title title="人员列表" isShowBottomBorder>
<!-- <template #rightBtn v-if="obj.signMethod==1">-->
<!-- <el-button type="text" icon="iconfont iconEwm" @click="showSignPhoto=true">获取签到码-->
<!-- </el-button>-->
<!-- </template>-->
</ai-title>
<div class="detail-info">
<div class="detail-left detail-info-p84">
<div class="info">
<span class="label">签到负责人</span>
<span class="value" v-if="obj.chargeOfSignInList && obj.chargeOfSignInList.length">
<span v-for="(item,index) in obj.chargeOfSignInList" :key="item+index">{{ item.userName }}
<span v-if="index < obj.chargeOfSignInList.length-1"></span>
</span>
</span>
<span class="value" v-else>-</span>
</div>
</div>
</div>
<ai-search-bar>
<template #left>
<el-select size="small" v-model="search.status" placeholder="状态" clearable @change="getSignInfo">
<el-option v-for="(op,j) in dict.getDict('OneThreeSignStatus')" :key="j" :label="op.dictName"
:value="op.dictValue"/>
</el-select>
</template>
<template #right>
<el-input size="small" placeholder="姓名" v-model="search.meetingUserName"
prefix-icon="iconfont iconSearch" clearable @keyup.enter.native="getSignInfo"
@clear="clear"></el-input>
</template>
</ai-search-bar>
<ai-table
:tableData="tableData"
:col-configs="colConfigs"
:isShowPagination="false"
border
@getList="getSignInfo">
<el-table-column label="操作" slot="options" align="center" width="150">
<template slot-scope="{row}">
<span class="opt" @click="doSign('2',row)" v-if="row.status==0">代签</span>
<span class="opt" style="margin-left: 16px;" @click="doSign('3',row)"
v-if="row.status==0">请假</span>
<span class="opt" @click="doSign('0',row)" v-if="['1','2','3'].includes(row.status)">撤消状态</span>
</template>
</el-table-column>
</ai-table>
</el-form>
</template>
</ai-card>
<ai-card v-if="obj.isVote == 1" title="投票统计">
<template #content>
<el-form>
<ai-title title="投票统计" isShowBottomBorder/>
<el-form-item label="投票主题">{{ obj.voteTopic }}</el-form-item>
<el-form-item label="投票形式">{{ dict.getLabel('ThreeMeetingAnonymous', obj.anonymous) }}</el-form-item>
<el-form-item label="截止时间">{{ obj.voteDeadline }}</el-form-item>
<ai-echart :ops="voteOps" :data="voteStaData"/>
<template v-if="obj.anonymous==1">
<ai-title title="投票详情" isShowBottomBorder/>
<ai-table :tableData="obj.participantList" :col-configs="voteConfigs" :isShowPagination="false"
border :dict="dict" @getList="getDetailInfo"/>
</template>
</el-form>
</template>
</ai-card>
</template>
</ai-detail>
<div class="signPhoto" v-show="showSignPhoto" @click="showSignPhoto=false"/>
<div class="signPhotoImg" v-show="showSignPhoto" @click="showSignPhoto=false">
<img :src="obj.signPhoto" alt="">
<span>点击鼠标右键另存至本地</span>
</div>
<ai-dialog
title="请假/代签"
:visible.sync="dialog"
:destroyOnClose="true"
@onConfirm="updateState"
width="520px">
<el-form ref="ruleForm" label-width="90px">
<el-form-item label="情况说明:">
<el-input type="textarea" v-model="description" placeholder="请输入..." :rows="4"/>
</el-form-item>
</el-form>
</ai-dialog>
</div>
</template>
<script>
import Vue from 'vue'
import {mapState} from "vuex";
import moment from 'dayjs';
import Viewer from 'v-viewer'
Vue.use(Viewer)
export default {
name: "meetingDetail",
props: {
instance: Function,
dict: Object,
permissions: Function,
detail: Object,
},
computed: {
...mapState(["user"]),
colConfigs() {
const self = this;
return [
{
prop: 'meetingUserName',
align: 'center',
label: '姓名',
},
{
prop: 'signTime',
align: 'center',
label: '签到时间',
width: 180,
},
{
prop: 'doUserName',
align: 'center',
label: '审批人/代签人'
},
{
prop: 'description',
align: 'left',
label: '情况说明'
},
{
prop: 'status',
align: 'center',
label: '状态',
render(h, {row}) {
return h('span', {
style: {
color: self.color[row.status]
}
}, self.$dict.getLabel('OneThreeSignStatus', row.status))
}
},
{slot: 'options', label: '操作'}
]
},
voteConfigs() {
return [
{label: "人员姓名", prop: "userName", align: 'center'},
{label: "投票选项", prop: "myVote", dict: "ThreeMeetingVoteItem"},
{label: "投票时间", prop: "voteTime"},
]
},
voteOps() {
return {
legend: {
itemWidth: 8, itemHeight: 8, itemGap: 20, orient: 'vertical',
top: 56, left: 240, formatter: name => {
let v1 = this.voteStaData.find(e => e['投票'] == name)?.v1 || 0
return `{row|${name}}{v|${v1}}`
},
textStyle: {
rich: {
row: {fontSize: 14, color: '#666', width: 40},
v: {width: 140, align: 'right'},
}
}
},
color: ['#4B87FE', '#fa4'],
daemon: {
center: [80, 80],
radius: [30, 70],
type: 'pie',
label: {position: 'inner', formatter: '{d}%', textStyle: {color: '#fff'}},
}
}
},
voteStaData() {
return [
{'投票': '同意', v1: this.obj.upVote || 0},
{'投票': '不同意', v1: this.obj.downVote || 0},
]
},
color() {
return ["#FF4466", "#2EA222", "#2266FF", "#FF8822", "#333333"]
},
},
data() {
return {
editable: false,
obj: {
meetingAgenda: "",
meetingClassification: [],
reminderMethod: [],
annex: [],
appThreeMeetingOrganizationList: [],
hostList: [],
recorderList: [],
chargeOfSignInList: [],
participantList: [],
images: []
},
summaryObj: {
content: "",
images: "",
meetingId: "",
},
fileList: [],
signStart: "",
signEnd: "",
areaId: "",
dialogVisible: false,
showConfirmBtn: false,
tableData: [],
search: {
status: "",
meetingUserName: "",
},
showSignPhoto: false,
edit: false,
sumEditDia: false,
textarea: "",
dialog: false,
description: "",
id: "",
status: "",
};
},
methods: {
clear() {
this.search.postStatus = "";
this.search.meetingUserName = "";
this.getSignInfo();
},
editAudioDia() {
this.sumEditDia = true;
},
doSign(status, {id}) {
this.status = status;
this.id = id;
if (status == '0') {
this.$confirm('是否撤销当前状态?').then(() => {
this.updateState();
});
} else {
this.description = "";
this.dialog = true;
}
},
//会议签到时间计算
countTime(total) {
let now = new Date(total)
let y = now.getFullYear();
let m = now.getMonth() + 1;
m = m < 10 ? ('0' + m) : m;
let da = now.getDate();
da = da < 10 ? ('0' + da) : da;
let h = now.getHours();
h = h < 10 ? ('0' + h) : h;
let minute = now.getMinutes();
minute = minute < 10 ? ('0' + minute) : minute;
let seconds = now.getSeconds();
seconds = seconds < 10 ? ('0' + seconds) : seconds;
return y + '-' + m + '-' + da + ' ' + h + ':' + minute + ":" + seconds;
},
delFile(index) {
this.fileList.splice(index, 1);
if (!this.showConfirmBtn && this.detail.id) {//非编辑删除文件
this.$message.success("文件删除成功!");
}
},
downFile(item) {
window.open(item.url);
},
updateState() {
this.instance.post(`/app/appthreemeetinguser/sign?id=${this.id}&status=${this.status}&description=${this.description}`).then((res) => {
if (res?.code == 0) {
const msg = this.status == 0 ? "撤销成功!" :
this.status == 2 ? "代签成功!" : "请假成功!";
this.$message.success(msg);
this.dialog = false;
this.getSignInfo();
}
})
},
//编辑取消/修改
editForm() {
this.editable = true;
},
cancelEditBtn() {
this.editable = false;
this.showConfirmBtn = false;
this.getDetailInfo();
},
navClick(id) {
if (id == 0) {
this.getDetailInfo()
} else if (id == 1) {
this.getSummary()
} else if (id == 2) {
this.getSignInfo()
}
this.$forceUpdate()
},
//获取会议详请
getDetailInfo() {
this.instance.post(`/app/appthreemeetinginfo/queryDetailById?id=${this.detail.id}`).then(res => {
if (res?.data) {
res.data.annex = JSON.parse(res.data.annex);
res.data.meetingClassification = res.data.meetingClassification.split(',');
this.obj = res.data;
}
});
},
//下载全部附件
downLoadAll() {
this.instance.post(`/app/appthreemeetinginfo/downLoadAllFileForDetail`, null, {
responseType: "blob",
params: {
id: this.detail.id
}
}).then(res => {
if (res?.type == "application/json") {
let reader = new FileReader(), _ = this
reader.readAsText(res, "utf-8")
reader.onload = e => {
if (e.target.readyState === 2) {
let ret = JSON.parse(e.target.result)
_.$message.error(ret.msg)
}
}
} else {
const link = document.createElement("a");
let blob = new Blob([res], {type: "application/vnd.ms-excel"});
link.style.display = "none";
link.href = URL.createObjectURL(blob);
let num = "";
for (let i = 0; i < 10; i++) {
num += Math.ceil(Math.random() * 10);
}
link.setAttribute("download", "三会一课附件" + ".zip");
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
})
},
//获取会议纪要信息
getSummary() {
this.instance.post(`/app/appthreemeetinginfoexpand/queryDetailById?id=${this.detail.id}`).then(res => {
if (res && res.data) {
res.data.images = JSON.parse(res.data.images);
this.summaryObj = res.data;
}
})
},
//获取人员签到
getSignInfo() {
this.instance.post(`/app/appthreemeetinguser/listForSign`, null, {
params: {
meetingId: this.detail.id,
...this.search,
size: 10000
}
}).then((res) => {
if (res && res.data) {
this.tableData = res.data.records;
}
})
},
cancelSummary() {
this.editable = false;
this.getSummary();
},
confirmSummary() {
let imgs = this.summaryObj.images && this.summaryObj.images.map(e => {
return {
url: e.url
}
})
this.instance.post(`/app/appthreemeetinginfoexpand/addOrUpdate`, {
meetingId: this.detail.id,
content: this.summaryObj.content,
images: JSON.stringify(imgs)
}).then(res => {
if (res && res.data) {
this.$message.success("保存成功");
this.getSummary()
this.editable = false;
}
});
},
arrLabel(arr, key) {
return arr?.map(e => e?.[key] || e)?.join(" / ") || "-"
}
},
created() {
this.areaId = this.user.info.areaId;
this.dict.load('ThreeMeetingAnonymous', 'ThreeMeetingVoteItem', "meetingClassification", "topicClassification", "feminderMethod", "addSignMethod", "postStatus", "OneThreeSignStatus").then(() => this.getDetailInfo());
},
watch: {
obj: {
handler(newVal) {
if (newVal.startTime && newVal.meetingBefore) {
let d = new Date(newVal.startTime);
let time = d.getTime();
let min = (Number(newVal.meetingBefore)) * 60000
let total = time - min;
this.signStart = this.countTime(total);
}
if (newVal.startTime && newVal.meetingAfter) {
let d = new Date(newVal.startTime);
let time = d.getTime();
let min = (Number(newVal.meetingAfter)) * 60000
let total = time + min;
this.signEnd = this.countTime(total);
}
},
deep: true
}
},
filters: {
formatTime(time) {
return time ? moment(time).format("YYYY-MM-DD HH:mm") : "-";
}
}
};
</script>
<style scoped lang="scss">
.addThreeMeeting {
height: 100%;
::v-deep .el-form {
.ailist-title {
padding: 0;
margin-bottom: 8px;
}
.el-form-item {
margin-bottom: 16px;
.el-date-editor {
width: 100%;
}
}
}
::v-deep.ai-detail__content--wrapper {
.el-form {
width: 1000px;
margin: 0 auto;
}
}
.audio {
display: flex;
margin-bottom: 8px;
}
::v-deep .el-dialog__body {
padding-top: 16px !important;
}
::v-deep .iconfont {
color: #2266FF;
cursor: pointer;
}
.content {
height: 400px;
background-color: #F5F5F5;
border-radius: 3px;
border: 1px solid #D0D4DC;
box-sizing: border-box;
padding: 14px;
font-size: 14px;
color: #333333;
line-height: 19px;
}
.signPhoto {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: #000000;
opacity: 0.2;
z-index: 100;
display: flex;
align-items: center;
justify-content: center;
}
.signPhotoImg {
position: absolute;
left: 0;
top: 0;
margin-left: calc((100% - 280px) / 2);
margin-top: 160px;
z-index: 200;
display: flex;
flex-direction: column;
align-items: center;
img {
width: 320px;
height: 320px;
}
span {
font-size: 14px;
color: #000000;
line-height: 19px;
margin-top: 24px;
}
}
.flie {
width: 100%;
height: 40px;
line-height: 40px;
padding: 0 8px;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 14px;
color: rgba(51, 51, 51, 1);
background: rgba(255, 255, 255, 1);
border-radius: 4px;
border: 1px solid rgba(208, 212, 220, 1);
margin-bottom: 16px;
cursor: pointer;
p {
display: flex;
justify-content: flex-start;
align-items: center;
}
.iconDelete {
color: #8899bb;
margin-left: 4px;
font-size: 16px;
}
}
::v-deep .el-form-item__label {
color: #999;
}
.flie:hover {
background-color: #f3f6f9;
border: none;
}
.flie:hover .iconDelete {
color: #ff4466;
}
.tips {
box-sizing: border-box;
padding: 0 106px;
font-size: 12px;
color: #999999;
line-height: 16px;
}
.opt {
font-size: 14px;
color: #5088FF;
cursor: pointer;
}
.wid100 {
width: 100%;
}
::v-deep .AiEchart {
height: 160px;
}
}
</style>

View File

@@ -0,0 +1,316 @@
<template>
<section class="meetingSet">
<ai-detail>
<ai-title slot="title" title="三会一课设置" isShowBack @onBackClick="$parent.goBack()" isShowBottomBorder/>
<template #content>
<div class="tab-tips">
<span class="el-icon-warning"/>
<span class="text">未按照会议要求开展三会一课的情况下支部负责人主要用于接收上级领导的催办消息</span>
</div>
<ai-card title="基本信息">
<template #content>
<ai-wrapper>
<ai-info-item label="党组织" :value="partyName"/>
</ai-wrapper>
</template>
</ai-card>
<ai-card title="支部负责人">
<template #right>
<ai-party-member :instance="instance" v-model="peopleList"
:action="'/app/appparty/list?partyOrgId='+partyId" @change="confirmAddUser"
dialogTitle="添加支部负责人" customCliker>
<el-button type="text" icon="iconfont iconAdd">添加人员</el-button>
</ai-party-member>
</template>
<template #content>
<el-table
:key='0'
:data="tableDataUser"
style="width: 100%"
border
header-cell-class-name="table-header"
empty-text="支部负责人信息为空点击标题右侧添加按钮进行添加"
>
<el-table-column type="index" label="序号" align="center" width="240"></el-table-column>
<el-table-column prop="partyName" label="姓名" align="center"></el-table-column>
<el-table-column label="操作" align="center">
<div slot-scope="{row}">
<span @click="deleteUser(row)"
class="iconfont iconDelete icon-color89B"
title="删除"
style="cursor: pointer;"
/>
</div>
</el-table-column>
</el-table>
</template>
</ai-card>
<ai-card title="三会一课要求">
<template #content>
<el-table
:key='1'
:data="tableDataRequirement"
style="width: 100%"
border
header-cell-class-name="table-header"
align="center"
empty-text="三会一课要求为空"
>
<el-table-column prop="meetingClassification" label="类型">
<div slot-scope="{row}">{{ dict.getLabel('meetingClassification', row.meetingClassification) || '-' }}
</div>
</el-table-column>
<el-table-column prop="type" label="要求">
<div slot-scope="{row}">{{ dict.getLabel('appThreeMeetingCTCType', row.type) || '-' }}</div>
</el-table-column>
</el-table>
</template>
</ai-card>
</template>
</ai-detail>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "meetingSet",
props: {
instance: Function,
dict: Object,
permissions: Function,
detail: Object,
partyId: String,
partyName: String,
},
computed: {
...mapState(["user"])
},
data() {
return {
navList: [
{name: "支部负责人", id: "1"},
{name: "会议要求", id: "2"}
],
navId: "1",
tableDataUser: [],
searchMsg: '',
peopleList: [],
chooseUser: [],
tableDataRequirement: [],
};
},
mounted() {
console.log(this.user)
this.dict.load('appThreeMeetingCTCType', 'meetingClassification')
this.getPartyList()
this.getRequirement()
},
methods: {
navClick(item) {
this.navId = item.id;
},
//获取支部负责人table
getPartyList() {
this.instance.post(`/app/appthreemeetingpartyconfig/list?organizationId=${this.partyId}`).then(res => {
if (res.code == 0) {
this.tableDataUser = res.data.records
this.peopleList = res.data.records.map((item) => {
return {
partyOrgId: item.organizationId,
id: item.partyId,
name: item.partyName,
phone: item.phone
}
})
// this.$forceUpdate()
}
})
},
//获取会议要求列表
getRequirement() {
this.instance.post(`/app/appthreemeetingclassificationconfig/list`).then(res => {
if (res.code == 0) {
this.tableDataRequirement = res.data.records
}
})
},
//确认添加支部人员
confirmAddUser(v) {
let userList = v.map((item) => {
return {
organizationId: item.partyOrgId,
partyId: item.id,
partyName: item.name,
phone: item.phone
}
})
this.instance.post(`/app/appthreemeetingpartyconfig/addOrUpdate`, userList, null).then(res => {
if (res.code == 0) {
this.$message({message: '添加成功', type: 'success'});
this.getPartyList()
}
})
},
//删除支部负责人
deleteUser(item) {
this.$confirm('是否删除该支部负责人?', '', {
type: 'error'
}).then(() => {
this.instance.post(`/app/appthreemeetingpartyconfig/delete?ids=${item.id}`).then(res => {
if (res.code == 0) {
this.$message({message: '删除成功', type: 'success'});
this.getPartyList()
}
})
})
}
}
};
</script>
<style scoped lang="scss">
::v-deep .right_title .iconfont {
margin-right: 0 !important;
}
.mask {
.operation {
overflow: hidden;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 64px;
line-height: 64px;
display: flex;
z-index: 1000;
align-items: center;
justify-content: center;
background-color: #f3f6f9;
box-shadow: inset 0 1px 0 0 #eeeeee;
button {
width: 92px;
height: 32px;
padding: 0 !important;
}
.delete-btn {
background-color: #fff;
}
}
.content {
padding: 0 16px 100px;
.search-info {
line-height: 44px;
border-bottom: 1px solid #D0D4DC;
span {
display: inline-block;
width: 120px;
line-height: 20px;
padding-right: 8px;
}
.el-input {
width: 160px;
height: 28px;
vertical-align: top;
}
::v-deep .el-input__inner {
height: 28px !important;
}
}
.user-list {
padding: 8px 0;
height: 200px;
overflow-y: scroll;
.user-item {
line-height: 24px;
cursor: pointer;
.iconfont {
margin-right: 4px;
}
}
.active {
color: #5088FF;
}
}
}
}
.content-left {
width: 160px;
height: 100%;
// float:left;
position: absolute;
left: -224px;
.content-left-nav {
width: 158px;
background-color: #ffffff;
border-radius: 4px;
border: solid 1px #eeeeee;
margin-top: 56px;
overflow: hidden;
li {
height: 48px;
line-height: 48px;
padding-left: 24px;
font-size: 14px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 0;
color: #666666;
cursor: pointer;
border-left: 3px solid transparent;
&:hover {
border-left: 3px solid #5088ff;
}
a {
display: block;
}
}
.navActive {
border-left: 3px solid #5088ff;
color: #5088ff;
}
}
}
.tab-tips {
display: inline-block;
width: 790px;
height: 32px;
line-height: 30px;
background-color: #fff3e8;
border-radius: 4px;
border: 1px solid #f82;
box-sizing: border-box;
color: #f82;
margin: 16px 0;
.el-icon-warning {
font-size: 16px;
margin: 0 8px;
}
.text {
font-size: 12px;
}
}
</style>

View File

@@ -0,0 +1,78 @@
<template>
<div style="width:100%;height: 160px;"/>
</template>
<script>
import echarts from 'echarts';
export default {
props: {
chartData: {
type: Array,
required: true
},
colorList: {
type: Array,
}
},
data() {
return {
chart: null,
}
},
mounted() {
this.$nextTick(() => {
this.initChart()
})
},
methods: {
initChart() {
this.chart = echarts.init(this.$el)
this.setOptions(this.chartData)
},
setOptions() {
this.chart.setOption({
tooltip: {
trigger: 'item',
formatter: '<br/>{b} : {c} ({d}%)'
},
series: [{
type: 'pie',
radius: ['40%', '90%'],
color: this.colorList,
avoidLabelOverlap: false,
label: {
show: true,
position: 'inside',
formatter: '{d}%',
fontSize: '12',
},
emphasis: {
label: {
show: true,
fontSize: '12',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: this.chartData
}]
})
}
},
watch: {
chartData: {
deep: true,
handler(val) {
this.setOptions(val)
}
}
},
}
</script>
<style lang="scss" scoped>
</style>

File diff suppressed because it is too large Load Diff