first commit
This commit is contained in:
@@ -0,0 +1,271 @@
|
||||
<!--#
|
||||
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>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user