271 lines
10 KiB
HTML
271 lines
10 KiB
HTML
<!--#
|
|
layout("/mobile/platform.html"){
|
|
#-->
|
|
|
|
<style>
|
|
.van-field__control {
|
|
color: #8b8f95;
|
|
}
|
|
|
|
.van-field__label {
|
|
color: #39acff
|
|
}
|
|
|
|
.cell-card {
|
|
padding: 3px;
|
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1);
|
|
border-radius: 20px;
|
|
width: 95%;
|
|
margin: 5px auto;
|
|
}
|
|
|
|
.bottomDiv {
|
|
position: fixed;
|
|
bottom: 10px;
|
|
width: 100%;
|
|
z-index: 999;
|
|
}
|
|
|
|
.bottomBut {
|
|
margin: 0 auto;
|
|
width: 300px;
|
|
}
|
|
|
|
body {
|
|
overflow-y: scroll !important;
|
|
}
|
|
|
|
.van-dialog {
|
|
width: 95%;
|
|
height: 85%;
|
|
margin-top: 5%;
|
|
}
|
|
</style>
|
|
|
|
<div id="app" v-cloak>
|
|
<van-nav-bar title="填写慰问申请" left-arrow placeholder fixed
|
|
@click-left="location.replace('/mobile/condolence/apply')"></van-nav-bar>
|
|
<van-form ref="addForm">
|
|
<van-cell-group class="cell-card">
|
|
<van-field readonly value="${@shiro.getPrincipalProperty('username')}" name="manager_name"
|
|
label="经办人"
|
|
input-align="right"></van-field>
|
|
|
|
<van-field readonly :value="formData.apply_time" name="apply_time"
|
|
label="申请时间"
|
|
input-align="right"></van-field>
|
|
|
|
<van-field @input="userRemoteMethod" name="be_user_name"
|
|
v-model="formData.be_user_name" label="被慰问人" placeholder="请输入被慰问人姓名" input-align="right"
|
|
:rules="[{ required: true, message: '请填写被慰问人姓名' }]"></van-field>
|
|
|
|
<van-action-sheet v-model="sheetShow"
|
|
:actions="userList"
|
|
cancel-text="重新输入姓名查询"
|
|
@cancel="userList = []"
|
|
:close-on-click-overlay="false"
|
|
@select="onUserSelect">
|
|
</van-action-sheet>
|
|
|
|
<van-field v-model="formData.bank_card" name="bank_card" label="银行卡号" input-align="right"
|
|
:rules="[{ required:true, message: '请填写银行卡号' }]"></van-field>
|
|
|
|
<van-field readonly clickable name="type" :value="condolence.type[formData.type]"
|
|
label="慰问类型" input-align="right"
|
|
@click="showTypePicker = true" placeholder="点击选择慰问类型"
|
|
:rules="[{ required:true, message: '请选择慰问类型'}]"></van-field>
|
|
<van-popup v-model:show="showTypePicker" position="bottom" round>
|
|
<van-picker show-toolbar :columns="transColumns(condolence.type)" @confirm="onTypeConfirm"
|
|
@cancel="showTypePicker = false">
|
|
</van-picker>
|
|
</van-popup>
|
|
|
|
<van-field readonly clickable name="way" :value="condolence.way[formData.way]"
|
|
label="慰问方式" input-align="right"
|
|
@click="showWayPicker = true" placeholder="点击选择慰问方式"
|
|
:rules="[{ required:true, message: '请选择慰问方式'}]"></van-field>
|
|
<van-popup v-model:show="showWayPicker" position="bottom" round>
|
|
<van-picker show-toolbar :columns="transColumns(condolence.way)" @confirm="onWayConfirm"
|
|
@cancel="showWayPicker = false">
|
|
</van-picker>
|
|
</van-popup>
|
|
|
|
<van-field v-model="formData.money" name="money" type="number" label="慰问金额" input-align="right"
|
|
:rules="[{ required:true, message: '请填写慰问金额' }]"></van-field>
|
|
|
|
<van-field v-model="formData.personnel" name="personnel" label="参加慰问人员" input-align="right"></van-field>
|
|
|
|
<van-field v-model="formData.remark" name="remark" label="备  注" input-align="right"
|
|
rows="2" maxlength="200" type="textarea" show-word-limit autosize></van-field>
|
|
|
|
<van-field name="files" label="附  件">
|
|
<template #input>
|
|
<van-uploader v-model="files"
|
|
accept=".jpg,.png,.jpeg,.txt,.pdf,.doc,.docx,.xls,.xlsx"
|
|
:after-read="afterRead"></van-uploader>
|
|
</template>
|
|
</van-field>
|
|
|
|
<van-dialog id="dialog" v-model="showSign" title="请签字确认" show-cancel-button @confirm="onSubmit"
|
|
@close="$refs.signature.reset()">
|
|
<mobile-sign ref="signature" :my_sign.sync="sign"></mobile-sign>
|
|
</van-dialog>
|
|
|
|
</van-cell-group>
|
|
|
|
<div class="bottomDiv">
|
|
<van-button class="bottomBut" @click="openDialog" round block type="info" color="#39acff">
|
|
提 交
|
|
</van-button>
|
|
</div>
|
|
</van-form>
|
|
</div>
|
|
|
|
<script>
|
|
const vue = new Vue({
|
|
el: '#app',
|
|
data() {
|
|
return {
|
|
userList: [],
|
|
formData: {},
|
|
sign: "",
|
|
showTypePicker: false,
|
|
showWayPicker: false,
|
|
sheetShow: false,
|
|
showSign: false,
|
|
typeColumns: [],
|
|
wayColumns: [],
|
|
files: []
|
|
}
|
|
},
|
|
components: {
|
|
'mobile-sign': httpVueLoader('/components/sign/mobileSign.vue'),
|
|
},
|
|
methods: {
|
|
transColumns(obj) {
|
|
let arr = []
|
|
for (let i in obj) {
|
|
arr.push({value: i, text: obj[i]})
|
|
}
|
|
return arr
|
|
},
|
|
async userRemoteMethod(event) {
|
|
if (event) {
|
|
const arr = await this.queryUser(event)
|
|
this.userList = arr.map(v => {
|
|
return {name: v.username, id: v.id}
|
|
})
|
|
this.sheetShow = true
|
|
}
|
|
},
|
|
async queryUser(query) {
|
|
const {data} = await $.get("/platform/fw/condolence/apply/queryUser", {query})
|
|
return data
|
|
},
|
|
onUserSelect(u) {
|
|
this.$set(this.formData, 'be_user', u.id)
|
|
this.$set(this.formData, 'be_user_name', u.name)
|
|
this.sheetShow = false
|
|
},
|
|
afterRead(file) {
|
|
file.status = 'uploading';
|
|
file.message = '上传中...';
|
|
|
|
let formData = new FormData();
|
|
formData.append("file", file.file, file.file.name);
|
|
|
|
$.ajax({
|
|
url: "/platform/Common/uploadFile",
|
|
type: "post",
|
|
data: formData,
|
|
processData: false,
|
|
contentType: false,
|
|
success: (res) => {
|
|
const {code, data} = res
|
|
if (code === 0) {
|
|
file.status = 'success';
|
|
this.formData.files = [{
|
|
id: data.id,
|
|
filename: data.filename,
|
|
filepath: data.filepath
|
|
}]
|
|
this.files = [{url: FILE_DOMAIN + data.filepath}]
|
|
}
|
|
},
|
|
error: (err) => {
|
|
file.status = 'failed';
|
|
file.message = '上传失败';
|
|
}
|
|
});
|
|
},
|
|
onTypeConfirm(val) {
|
|
this.formData.type = val.value;
|
|
this.moneyChange(val.value)
|
|
this.showTypePicker = false;
|
|
},
|
|
onWayConfirm(val) {
|
|
this.formData.way = val.value;
|
|
this.showWayPicker = false;
|
|
},
|
|
moneyChange(type) {
|
|
if (type == 1) {
|
|
this.$set(this.formData, 'way', '2')
|
|
this.$set(this.formData, 'money', 200)
|
|
} else if (['2', '3', '4'].includes(type)) {
|
|
this.$set(this.formData, 'way', '2')
|
|
if (['2', '3'].includes(type)) {
|
|
this.$set(this.formData, 'money', 500)
|
|
} else if (['4'].includes(type)) {
|
|
this.$set(this.formData, 'money', 1000)
|
|
}
|
|
} else if (['5'].includes(type)) {
|
|
this.$set(this.formData, 'money', 2000)
|
|
} else if (['6'].includes(type)) {
|
|
this.$set(this.formData, 'money', 200)
|
|
}
|
|
},
|
|
openDialog() {
|
|
this.showSign = true
|
|
this.$nextTick(() => {
|
|
this.$refs.signature.getMySign()
|
|
})
|
|
},
|
|
async onSubmit() {
|
|
this.$refs.signature.submitSign()
|
|
|
|
if (!this.sign) {
|
|
this.$toast('请签名再提交')
|
|
return
|
|
}
|
|
|
|
const formData = JSON.parse(JSON.stringify(this.formData))
|
|
formData.files = JSON.stringify(formData.files)
|
|
|
|
this.$refs['addForm'].validate().then(async () => {
|
|
|
|
this.$toast.loading('提交中...')
|
|
|
|
const res = await $.post('/platform/fw/condolence/apply/doAdd', {
|
|
data: JSON.stringify(formData),
|
|
sign: this.sign
|
|
})
|
|
|
|
if (res.code === 0) {
|
|
this.$toast.success('申请成功');
|
|
setTimeout(() => {
|
|
location.replace('/mobile/condolence/apply')
|
|
}, 1000)
|
|
} else {
|
|
this.$toast.fail('申请失败');
|
|
}
|
|
})
|
|
},
|
|
},
|
|
created() {
|
|
this.formData.apply_time = moment().format('YYYY-MM-DD')
|
|
}
|
|
})
|
|
</script>
|
|
<!--#
|
|
}
|
|
#--> |