You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

237 lines
7.5 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div>
<xy-dialog ref="dialog" :width="60" :is-show.sync="isShow" :type="'form'" :title="'数据填报'" :form="form"
:rules='rules' @submit="submit">
<template v-slot:business_id>
<div class="xy-table-item">
<div class="xy-table-item-label" style="font-weight: bold">
<span style="color: red;font-weight: bold;padding-right: 4px;">*</span>业务类型
</div>
<div class="xy-table-item-content">
<el-input v-model="business_name" disabled placeholder="请输入业务名称" style="width: 100%;"></el-input>
</div>
</div>
</template>
<template v-slot:area_id>
<div class="xy-table-item">
<div class="xy-table-item-label" style="font-weight: bold">
<span style="color: red;font-weight: bold;padding-right: 4px;">*</span>填报区域:
</div>
<div class="xy-table-item-content">
<el-select style="width:100%" :disabled="(stateObj.is_admin)?false:true" v-model="form.area_id" placeholder="请选择">
<el-option v-for="item in list_areas" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</div>
</div>
</template>
<template v-slot:year>
<div class="xy-table-item">
<div class="xy-table-item-label" style="font-weight: bold">
<span style="color: red;font-weight: bold;padding-right: 4px;">*</span>填报年份:
</div>
<div class="xy-table-item-content">
<el-date-picker style="width:100%" format="yyyy" value-format="yyyy" v-model="form.year" type="year"
placeholder="选择年">
</el-date-picker>
</div>
</div>
</template>
<template v-slot:all_year>
<div class="xy-table-item">
<div class="xy-table-item-label" style="font-weight: bold">
<span style="color: red;font-weight: bold;padding-right: 4px;"></span>年度总预算:
</div>
<div class="xy-table-item-content">
<el-input v-model="form.all_year" type="number" placeholder="请输入年度总预算" style="width: 100%;"></el-input>
</div>
</div>
</template>
<template v-slot:quarter_1>
<div class="xy-table-item">
<div class="xy-table-item-label" style="font-weight: bold">
<span style="color: red;font-weight: bold;padding-right: 4px;"></span>第一季度预算:
</div>
<div class="xy-table-item-content">
<el-input v-model="form.quarter_1" type="number" placeholder="请输入第一季度预算" style="width: 100%;"></el-input>
</div>
</div>
</template>
<template v-slot:quarter_2>
<div class="xy-table-item">
<div class="xy-table-item-label" style="font-weight: bold">
<span style="color: red;font-weight: bold;padding-right: 4px;"></span>第二季度预算:
</div>
<div class="xy-table-item-content">
<el-input v-model="form.quarter_2" type="number" placeholder="请输入第二季度预算" style="width: 100%;"></el-input>
</div>
</div>
</template>
<template v-slot:quarter_3>
<div class="xy-table-item">
<div class="xy-table-item-label" style="font-weight: bold">
<span style="color: red;font-weight: bold;padding-right: 4px;"></span>第三季度预算:
</div>
<div class="xy-table-item-content">
<el-input v-model="form.quarter_3" type="number" placeholder="请输入第三季度预算" style="width: 100%;"></el-input>
</div>
</div>
</template>
<template v-slot:quarter_4>
<div class="xy-table-item">
<div class="xy-table-item-label" style="font-weight: bold">
<span style="color: red;font-weight: bold;padding-right: 4px;"></span>第四季度预算:
</div>
<div class="xy-table-item-content">
<el-input v-model="form.quarter_4" type="number" placeholder="请输入第四季度预算" style="width: 100%;"></el-input>
</div>
</div>
</template>
</xy-dialog>
</div>
</template>
<script>
import {
save,
show,
} from "@/api/system/baseForm.js"
import state from '@/store/modules/user.js'
export default {
components: {
},
data() {
return {
isShow: false,
type: 'add',
id: '',
stateObj: {},
business_name: '', //业务名
business_id: '', // 业务id
area_id: '',
table_name: 'budgets',
list_areas: [],
form: {
business_id: '',
area_id: '',
year: '',
all_year: 0,
quarter_1:0,
quarter_2:0,
quarter_3:0,
quarter_4:0,
},
rules: {
business_id: [{
required: true,
message: '请选择业务'
}],
area_id: [{
required: true,
message: '请选择区域'
}],
year: [{
required: true,
message: '请选择年份'
}],
}
}
},
created() {
this.stateObj = state.state
},
methods: {
// 获取 业务类型数据
setBusinessId(id){
this.form.business_id = id
},
async getBusiness() {
const res = await show({
id: this.business_id,
table_name: 'businesses',
json_data_fields: ['area_ids'],
})
this.business_name = res.name
this.list_areas = res.area_ids_details ? res.area_ids_details : []// 初始化 填报数据
if(this.type==='add'){
this.form.area_id = this.stateObj.area_id ? this.stateObj.area_id : ''
}
},
submit() {
if (this.id) {
this.form.id = this.id
}
if (this.type == 'add') {
this.form.id = ''
}
save({
table_name: this.table_name,
...this.form
}).then(res => {
this.$message({
type: 'success',
message: this.type === 'add' ? '新增成功' : '编辑成功'
})
this.isShow = false
this.$emit('refresh')
})
},
getDetail() {
show({
id: this.id,
table_name: this.table_name,
}).then(res => {
this.form = this.base.requestToForm(res, this.form)
this.business_id = res.business_id
this.form.area_id = res.area_id ? res.area_id : []
})
},
},
watch: {
isShow(newVal) {
if (newVal) {
this.getBusiness()
if (this.type === 'editor') {
this.getDetail()
}else{
this.form.year = this.$moment(new Date).format("YYYY")
}
} else {
this.id = ''
this.business_id = ''
this.business_name = ''
this.type = "add"
this.form = {
business_id: '',
area_id: '',
year: '',
all_year: 0,
quarter_1:0,
quarter_2:0,
quarter_3:0,
quarter_4:0,
}
this.$refs['dialog'].reset()
}
},
}
}
</script>
<style scoped lang="scss">
// ::v-deep .area_ids,
// ::v-deep .name{
// flex-basis: 100%;
// }
</style>