360 lines
17 KiB
HTML
360 lines
17 KiB
HTML
<!--#
|
|
layout("/layouts/platform.html"){
|
|
#-->
|
|
<style>
|
|
.el-form .el-select, .el-form .el-date-editor {
|
|
width: 100%;
|
|
}
|
|
|
|
.el-divider {
|
|
background-color: #1867b0;
|
|
}
|
|
|
|
.el-divider__text {
|
|
color: #1867b0;
|
|
}
|
|
|
|
.w-e-text-container {
|
|
height: 250px !important;
|
|
}
|
|
</style>
|
|
<div id="app" v-cloak>
|
|
<guava ref="guava">
|
|
<el-card shadow="never">
|
|
<template #header>
|
|
<el-row justify="space-between" type="flex">
|
|
<h3 style="color: rgb(24, 103, 176);">
|
|
{{id?'项目编辑':'项目申报'}}
|
|
</h3>
|
|
</el-row>
|
|
</template>
|
|
<el-form :model="formData" :rules="rules" label-width="100px" ref="AddForm">
|
|
<div style="margin-bottom: 30px">
|
|
<el-form-item label="项目名称" prop="projectId">
|
|
<el-select v-model="formData.projectId" placeholder="请选择项目名称" clearable>
|
|
<el-option v-for="o in projectList" :label="o.projectName" :value="o.id"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</div>
|
|
|
|
<el-divider content-position="left">申报工会信息</el-divider>
|
|
<div>
|
|
<el-row :gutter="20" type="flex">
|
|
<el-col :span="8">
|
|
<el-form-item label="院级工会" prop="unionId">
|
|
<el-select placeholder="请选择申报院级工会" v-model="formData.unionId"
|
|
style="width: 100%;"
|
|
disabled
|
|
@change="searchUnionInfo(formData.unionId)"
|
|
clearable="true"
|
|
filterable>
|
|
<el-option v-for="item in unions"
|
|
:label="item.unionname"
|
|
:value="item.id"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="申报人" prop="declarer">
|
|
<el-input readonly placeholder="请填写申报人" v-model="formData.declarer"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="工会主席" prop="unionLeader">
|
|
<el-input placeholder="请填写工会主席" v-model="formData.unionLeader"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20" type="flex">
|
|
<el-col :span="8">
|
|
<el-form-item label="工会人数" prop="unionPeoNum">
|
|
<el-input placeholder="请填写工会人数" v-model="formData.unionPeoNum"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="补助金额" prop="subsidyAmount">
|
|
<el-input placeholder="请填写补助金额" v-model="formData.subsidyAmount"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="申请时间" prop="auditTime">
|
|
<el-date-picker
|
|
placeholder="申请时间"
|
|
style="width: 100%"
|
|
readonly
|
|
type="date"
|
|
v-model="formData.auditTime"
|
|
value-format="yyyy-MM-dd">
|
|
</el-date-picker>
|
|
<!--<el-input placeholder="请填写申请时间" v-model="formData.auditTime"></el-input>-->
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row type="flex" :gutter="20">
|
|
<el-col :span="24">
|
|
<el-form-item label="年度获奖情况" prop="award">
|
|
<el-input v-model="formData.award" type="textarea" rows="4"
|
|
placeholder="如有多种奖励，请用 / 隔开"></el-input>
|
|
<el-popover
|
|
v-model="popover"
|
|
placement="top-start"
|
|
width="800"
|
|
trigger="click">
|
|
<el-table :data="honorList" ref="multipleTable" @selection-change="handleSelectionChange"
|
|
row-key="id"
|
|
style="width: 100%; max-height: 400px; overflow-y: auto" size="mini">
|
|
<el-table-column
|
|
type="selection"
|
|
width="55">
|
|
</el-table-column>
|
|
<el-table-column property="prizeName" label="获奖名称"></el-table-column>
|
|
<el-table-column property="levelName" label="级别"></el-table-column>
|
|
<el-table-column property="grantDate" sortable label="授予时间"></el-table-column>
|
|
</el-table>
|
|
<div style="text-align: right; margin-top: 10px">
|
|
<el-button @click="multipleSelection = []; popover = false" size="mini">取消
|
|
</el-button>
|
|
<el-button @click="popoverOK" type="primary" size="mini">确定</el-button>
|
|
</div>
|
|
<el-button slot="reference" type="primary" size="mini">调用已录入荣誉</el-button>
|
|
</el-popover>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-divider content-position="left" ref="specificInformation">
|
|
具体预算详情(最多填写400字，当前字数
|
|
<span :style="{color:(specificInfoLength>400?'red':'')}"> {{specificInfoLength}})</span>
|
|
</el-divider>
|
|
<el-form-item label-width="0" prop="specificInfo" style="margin-bottom: 40px;">
|
|
<div ref="specificInfo" style="width: 100%;"></div>
|
|
</el-form-item>
|
|
</div>
|
|
</el-form>
|
|
|
|
<el-row class="mt10" justify="center" type="flex">
|
|
<el-button v-bind:disabled="isSubmitting" @click="doSave" style="width: 300px" type="primary">保存</el-button>
|
|
<el-button v-bind:disabled="isSubmitting" @click="doSubmit" style="width: 300px" type="primary">提交</el-button>
|
|
</el-row>
|
|
|
|
</el-card>
|
|
</guava>
|
|
</div>
|
|
|
|
<script>
|
|
let specificInfoEditor = null
|
|
|
|
var vue = new Vue({
|
|
el: '#app',
|
|
mixins: [initTableMixins],
|
|
data() {
|
|
const validatorSpecificInfo = (rule, value, callback) => {
|
|
if (value === '') {
|
|
callback(new Error('请填写'))
|
|
} else if (removeHTMLTag(value).length > 400) {
|
|
callback(new Error('字数太多'))
|
|
} else {
|
|
callback()
|
|
}
|
|
}
|
|
return {
|
|
id:null,
|
|
popover: false,
|
|
isSubmitting: false,
|
|
formData:{
|
|
specificInfo: '',
|
|
unionPeoNum:null,
|
|
unionLeader:null,
|
|
userName:'',
|
|
userId:'',
|
|
},
|
|
pageData:{},
|
|
projectList:[],
|
|
unions:[],
|
|
rules:{
|
|
projectId: [{required: true, message: '请选择项目名称', trigger: ['blur', 'change']}],
|
|
unionId: [{required: true, message: '请选择院级工会', trigger: ['blur', 'change']}],
|
|
declarer: [{required: true, message: '请填写申报人', trigger: ['blur', 'change']}],
|
|
unionLeader: [{required: true, message: '请填写工会主席', trigger: ['blur', 'change']}],
|
|
unionPeoNum: [{required: true, message: '请填写工会人数', trigger: ['blur', 'change']}],
|
|
subsidyAmount: [{required: true, message: '请填写补助金额', trigger: ['blur', 'change']}],
|
|
auditTime: [{required: true, message: '请填写申请日期', trigger: ['blur', 'change']}],
|
|
award: [{required: false, message: '请填写申请日期', trigger: ['blur', 'change']}],
|
|
specificInfo: [{validator: validatorSpecificInfo, trigger: ['blur', 'change']}],
|
|
},
|
|
multipleSelection: [],
|
|
honorList:[],
|
|
}
|
|
},
|
|
methods: {
|
|
async doSave() {
|
|
let isValid = true
|
|
this.$refs.AddForm.validateField('projectId', (err) => {
|
|
if (err.length) {
|
|
isValid = false
|
|
}
|
|
})
|
|
if (!isValid) return
|
|
let loading = this.$loading({
|
|
lock: true,
|
|
text: '保存中',
|
|
spinner: 'el-icon-loading',
|
|
background: 'rgba(0, 0, 0, 0.7)'
|
|
})
|
|
let postUrl = ''
|
|
if (this.formData.id) {
|
|
postUrl = '/platform/projectfunding/myDeclare/doEdit'
|
|
} else {
|
|
postUrl = '/platform/projectfunding/declare/doSave'
|
|
}
|
|
const o = this.projectList.find(o => o.id === this.formData.projectId)
|
|
this.formData.projectName = o.projectName
|
|
const resp = await $.post(base + postUrl, this.formData)
|
|
if (resp.code === 0) {
|
|
setTimeout(() => {
|
|
loading.text = '保存成功'
|
|
loading.spinner = 'el-icon-check'
|
|
setTimeout(() => {
|
|
loading.close()
|
|
sublime.jumpPagePjax('/platform/projectfunding/myDeclare')
|
|
}, 1000)
|
|
}, 1500)
|
|
} else {
|
|
loading.close()
|
|
this.notifyError(resp.msg)
|
|
}
|
|
},
|
|
async doSubmit() {
|
|
try {
|
|
const valid = await this.$refs['AddForm'].validate()
|
|
if (valid) {
|
|
let loading = this.$loading({
|
|
lock: true,
|
|
text: '提交中',
|
|
spinner: 'el-icon-loading',
|
|
background: 'rgba(0, 0, 0, 0.7)'
|
|
})
|
|
let postUrl = ''
|
|
if (this.formData.id) {
|
|
postUrl = '/platform/projectfunding/myDeclare/doEdit'
|
|
this.formData.tjxx = '0';
|
|
} else {
|
|
postUrl = '/platform/projectfunding/declare/doAdd'
|
|
}
|
|
const o = this.projectList.find(o => o.id === this.formData.projectId)
|
|
this.formData.projectName = o.projectName
|
|
|
|
const resp = await $.post(base + postUrl, this.formData)
|
|
if (resp.code === 0) {
|
|
setTimeout(() => {
|
|
loading.text = '提交成功'
|
|
loading.spinner = 'el-icon-check'
|
|
setTimeout(() => {
|
|
loading.close()
|
|
sublime.jumpPagePjax('/platform/projectfunding/myDeclare')
|
|
}, 1000)
|
|
}, 1500)
|
|
} else {
|
|
loading.close()
|
|
this.notifyError(resp.msg)
|
|
}
|
|
}
|
|
} catch (e) {
|
|
console.log(e)
|
|
}
|
|
},
|
|
handleSelectionChange(val) {
|
|
this.multipleSelection = val;
|
|
},
|
|
popoverOK(){
|
|
if (this.multipleSelection) {
|
|
let str = '';
|
|
this.multipleSelection.forEach(item => {
|
|
const time = item.grantDate ? moment(item.grantDate).format('YYYY') + '-' : ''
|
|
str += time + item.prizeName + '\n'
|
|
})
|
|
str = str.substring(0, str.length - 1)
|
|
this.formData.award = str
|
|
this.popover = false
|
|
}
|
|
},
|
|
async isEdit() {
|
|
const id = GetQueryString("id")
|
|
this.id = id
|
|
if (id) {
|
|
const resp = await $.get(loc() + '/findProjectInfo/' + id)
|
|
this.formData = resp.data
|
|
specificInfoEditor.txt.html(this.formData.specificInfo)
|
|
}
|
|
},
|
|
async initEditor() {
|
|
return await new Promise((resolve, reject) => {
|
|
this.$nextTick(() => {
|
|
setTimeout(() => {
|
|
specificInfoEditor = new wangEditor(this.$refs.specificInfo)
|
|
specificInfoEditor.config.onchange = (html) => {
|
|
if (removeHTMLTag(html).length > 400) {
|
|
this.$message.info('具体预算详情最多填写400字')
|
|
}
|
|
this.$refs.AddForm.validateField('specificInfo', (errMsg) => {
|
|
})
|
|
this.formData.specificInfo = html
|
|
}
|
|
specificInfoEditor.config.uploadImgShowBase64 = true
|
|
specificInfoEditor.create()
|
|
resolve()
|
|
}, 800)
|
|
})
|
|
})
|
|
},
|
|
async getProjectFunding(){
|
|
const resp = await $.get('/platform/projectfunding/manage/getProjectFunding')
|
|
if (resp.code === 0){
|
|
this.projectList = resp.data
|
|
}
|
|
},
|
|
async searchUnionInfo(id){
|
|
const resp = await $.get(loc() + '/getUnionInfo',{id:id})
|
|
if (resp.code === 0){
|
|
this.formData.unionPeoNum = resp.data.unionPeoNum;
|
|
this.formData.unionLeader = resp.data.username;
|
|
}
|
|
this.honorList = [];
|
|
await this.getUnionHonor(id)
|
|
},
|
|
async getUnionHonor(id){
|
|
const {data} = await $.post(loc() + '/getUnionHonor',{unionId:id})
|
|
this.honorList = data;
|
|
},
|
|
initFormData(){
|
|
if (this.id==null){
|
|
this.$set(this.formData, 'declarer', "${@shiro.getPrincipalProperty('username')}")
|
|
this.$set(this.formData, 'userId', "${@shiro.getPrincipalProperty('id')}")
|
|
this.$set(this.formData, "auditTime", new Date());
|
|
this.$set(this.formData, 'unionId', "${@shiro.getPrincipalProperty('union').getId()}")
|
|
}
|
|
},
|
|
},
|
|
computed: {
|
|
specificInfoLength() {
|
|
return removeHTMLTag(this.formData.specificInfo).length
|
|
},
|
|
},
|
|
async mounted() {
|
|
await this.initEditor()
|
|
await this.isEdit()
|
|
},
|
|
async created() {
|
|
this.initFormData();
|
|
this.unions = await getUnions();
|
|
await this.getProjectFunding();
|
|
await this.searchUnionInfo(this.formData.unionId);
|
|
}
|
|
})
|
|
</script>
|
|
<!--#
|
|
}
|
|
#-->
|