Files
dvcp_v2_webapp/project/pingchang/apps/AppOrganizationChange/components/organizationSetting.vue
2022-10-24 11:58:47 +08:00

142 lines
4.5 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<section class="organizationSetting">
<ai-detail>
<ai-title slot="title" title="换届设置" isShowBottomBorder isShowBack @onBackClick="cancel(true)"/>
<template slot="content">
<ai-card title="基本信息">
<template #content>
<div class="tips">
<i class="el-icon-warning"></i>
系统将在下次换届时间开始前换届提醒人进行提醒提醒方式包括平台消息推送短信提醒
</div>
<div class="add-form">
<el-form ref="form" :model="form" :rules="formRules" size="small" label-width="150px">
<el-form-item label="组织名称">{{ org.name }}</el-form-item>
<el-form-item label="成立时间">{{ $dateFormat(org.createTime) }}</el-form-item>
<el-form-item label="换届类型" prop="type">
<el-radio v-model="form.type" label="0">三年换届</el-radio>
<el-radio v-model="form.type" label="1">五年换届</el-radio>
</el-form-item>
<el-form-item label="换届提醒人" prop="userList">
<ai-person-select :instance="instance" :customClicker="true" :chooseUserList="chooseUserList"
:url="`/app/appparty/list?partyOrgId=${form.organizationId}`" headerTitle="党员列表"
:isMultiple="true" dialogTitle="选择抄送人" @selectPerson="selectUser" class="aipersonselect">
<template name="option" v-slot:option="{ item }">
<span class="iconfont iconProlife">{{ item.name }}</span>
</template>
</ai-person-select>
</el-form-item>
</el-form>
</div>
</template>
</ai-card>
</template>
<template slot="footer" class="footer">
<el-button class="delete-btn footer-btn" @click="cancel(false)">取消</el-button>
<el-button class="footer-btn" type="primary" @click="confirm()">保存</el-button>
</template>
</ai-detail>
</section>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: "organizationSetting",
inject: ['permissions', 'instance', 'dict'],
data() {
let validUser = (rule, value, callback) => {
if (!value.length) {
return callback(new Error('请选择换届提醒人'));
} else {
callback();
}
};
return {
form: {
addOrMakeup: true,
organizationId: '',
organizationName: '',
type: '0',
userList: [],
},
formRules: {
type: [{required: true, message: "请选择选举方式", trigger: "blur"}],
organizationName: [{required: true, message: "请选择党组织", trigger: "blur"}],
userList: [{required: true, validator: validUser, trigger: "blur"}],
},
chooseUserList: [],
}
},
computed: {
...mapState(['user']),
org: v => new v.MODEL.PartyOrg(v.$route.query.oid)
},
created() {
this.form.organizationId = this.$route.query.oid
this.getDetail()
},
methods: {
cancel() {
this.$router.back()
},
getDetail() {
const {oid: organizationId} = this.$route.query
this.instance.post(`/app/apporganizationchangeconfig/queryDetailByOrganizationId`, null, {
params: {organizationId}
}).then((res) => {
if (res?.data) {
this.form = res.data
}
})
},
selectUser(v) {
this.form.userList = v
},
selectVote(e) {
this.form.voteUsers = e
},
confirm() {
// 换届设置
this.$refs.form.validate((valid) => {
if (valid) {
const {id: organizationId, name: organizationName} = this.org
this.instance.post(`/app/apporganizationchangeconfig/update`, {
...this.form, organizationId, organizationName
}).then(res => {
if (res.code == 0) {
this.$message.success('提交成功')
this.cancel(true)
}
})
}
})
},
},
}
</script>
<style lang="scss" scope>
.organizationSetting {
height: 100%;
::v-deep .el-date-editor .el-input {
width: 100%;
}
.tips {
width: 100%;
border: 1px solid #f82;
background-color: #fff3e9;
color: #f82;
padding: 8px 16px;
box-sizing: border-box;
border-radius: 4px;
margin-bottom: 32px;
font-size: 13px;
}
}
</style>