Files
2026-09-20 15:46:34 +08:00

224 lines
8.1 KiB
HTML

<!--#
layout("/layouts/platform.html"){
#-->
<style>
#app{
padding: 10px;
height: 100%;
overflow-y: auto;
}
.el-divider {
background-color: #409EFF;
}
.el-divider__text {
color: #409EFF;
}
input[type="number"] {
-moz-appearance: textfield;
}
.flexbox {
display: flex;
}
.flexbox .el-form-item {
width: 50%;
}
.el-form .el-select, .el-form .el-date-editor {
width: 100%;
}
.el-loading-spinner{
font-size: 30px;
}
.el-collapse-item__arrow{
color: red;
font-size: 20px;
}
</style>
<div id="app" v-cloak>
<el-card style="width:100%;">
<div slot="header" style="font-size: 20px;">
困难补助申请
</div>
<el-form :model="formData" label-width="100px" ref="addForm" :rules="formRules">
<el-divider content-position="left">基本信息</el-divider>
<el-form-item label="申请人">
<el-input placeholder="姓名" value="${@shiro.getPrincipalProperty('username')}"
readonly="true"></el-input>
</el-form-item>
<div class="flexbox">
<el-form-item label="受补助人" prop="sq_sqr">
<el-select v-model="formData.sq_sqr"
@change="sqrChange"
filterable
remote
reserve-keyword
placeholder="输入工号或者姓名查找"
:remote-method="querySqr">
<el-option v-for="o in sqrlist" :label="o.username+'-'+o.loginname" :value="o.id"
:key="o.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="性别" prop="sq_sex">
<el-select v-model="formData.sq_sex">
<el-option value="男" label="男"></el-option>
<el-option value="女" label="女"></el-option>
</el-select>
</el-form-item>
</div>
<div class="flexbox">
<el-form-item label="出生年月" prop="sq_birthday">
<el-date-picker value-format="yyyy-MM-dd" v-model="formData.sq_birthday">
</el-date-picker>
</el-form-item>
<el-form-item label="单位" prop="sq_sqrdw">
<el-input v-model="formData.sq_sqrdw" readonly></el-input>
</el-form-item>
</div>
<div class="flexbox">
<el-form-item label="职称(务)" prop="sq_zwzc">
<el-input placeholder="职称" v-model="formData.sq_zwzc"></el-input>
</el-form-item>
<el-form-item label="联系电话" prop="sq_mobile">
<el-input placeholder="联系电话" v-model="formData.sq_mobile"></el-input>
</el-form-item>
</div>
<div>
<el-form-item label="申请理由" prop="sq_knbzsqly">
<el-input placeholder="请填写困难补助申请理由" type="textarea" :autosize="{ minRows: 4, maxRows: 8}"
maxlength="1000" v-model.trim="formData.sq_knbzsqly"></el-input>
</el-form-item>
</div>
<div>
<sign prefix="knbfsh" :qz.sync="formData.sqrqz"></sign>
</div>
<!-- <div>-->
<!-- <el-form-item label="附件">-->
<!-- <el-upload-->
<!-- name="file"-->
<!-- ref="upload"-->
<!-- action=""-->
<!-- :on-change="handleChange"-->
<!-- :auto-upload="false"-->
<!-- :multiple="false"-->
<!-- :file-list="fileList">-->
<!-- <el-button size="mini" type="primary">选择文件</el-button>-->
<!-- </el-upload>-->
<!-- </el-form-item>-->
<!-- </div>-->
</el-form>
<div style="text-align: right;margin-top: 20px;">
<el-button type="primary" @click="doAdd">确 定</el-button>
</div>
</el-card>
</div>
<script>
const rules = {
sq_sqr: [{required: true, message: '请填写申请人', trigger: ['blur', 'change']}],
sq_sex: [{required: true, message: '请选择申请人性别', trigger: ['blur', 'change']}],
sq_birthday: [{required: true, message: '请填写申请人生日', trigger: ['blur', 'change']}],
sq_zwzc: [{required: true, message: '请填写申请人职务(职称)', trigger: ['blur', 'change']}],
sq_mobile: [{required: true, message: '请填写申请人手机号', trigger: ['blur', 'change']}],
sq_knbzsqly: [{required: true, message: '请填写申请理由', trigger: ['blur', 'change']}]
}
let vue = new Vue({
el: '#app',
data() {
return {
formData: {
sqrqz:'',
sq_sqr:'',
sq_sqrdw:'',
sq_sex:'',
sq_birthday:'',
sq_zwzc:'',
sq_mobile:'',
sq_knbzsqly:''
},
addDialogVisible: false,
formRules: rules,
fileList: [],
sqrlist: [],
}
},
components: {
'sign': httpVueLoader('/components/sign/sign.vue?v=2.0.0'),
},
methods: {
async querySqr(key) {
const data = await selectUser(key,10)
this.sqrlist = data.list
},
sqrChange(val){
let u = this.sqrlist.find(u=>u.id === val)
console.log(u)
this.$set(this.formData,'sq_sex',u.sex)
this.$set(this.formData,'sq_xgh',u.loginname)
this.$set(this.formData,'sq_birthday','')
this.$set(this.formData,'sq_zwzc',u.zc)
this.$set(this.formData,'sq_mobile',u.mobile)
this.$set(this.formData,'sq_sqrdw',u.dwname)
},
handleChange(file, fileList) {
if (file.size === 0) {
this.$message.warning("您选择的是空文件!");
for (let i = 0; i < fileList.length; i++) {
if (file === fileList[i]) {
fileList.splice(i, 1);
}
}
}
this.fileList = fileList;
},
doAdd() {
this.$refs["addForm"].validate(valid => {
if (valid) {
let formData = new FormData();
formData.append("sqxx", JSON.stringify(this.formData));
this.fileList.forEach(function (val) {
formData.append("file", val.raw, val.raw.name);
})
$.ajax({
url: base + "/platform/zgfw/knbfsq/doAdd",
type: "post",
data: formData,
processData: false,
contentType: false
}).then(res=>{
clearInterval(qzInterval)
if(res.code===0){
this.$message({
message: res.msg,
type: 'success',
onClose:()=>{
window.location.href='/platform/zgfw/knbfsqxx'
}
})
}
})
}
})
}
}
})
</script>
<!--#
}
#-->