<template>
|
<el-dialog
|
:visible.sync="dialogVisible"
|
title="专项检查任务下发"
|
append-to-body
|
:close-on-click-modal="false"
|
width="60%"
|
center
|
@close="resetForm('workForm')"
|
>
|
<!-- <el-upload-->
|
<!-- class="upload-demo"-->
|
<!-- action-->
|
<!-- :http-request="uploadFile"-->
|
<!-- :on-preview="handlePreview"-->
|
<!-- :on-remove="handleRemove"-->
|
<!-- :before-upload="beforeUpload"-->
|
<!-- :before-remove="beforeRemove"-->
|
<!-- multiple-->
|
<!-- :limit="1"-->
|
<!-- :on-exceed="handleExceed"-->
|
<!-- accept=".pdf, .doc, .docx"-->
|
<!-- :file-list="fileList">-->
|
<!-- <div style="display: flex;align-items: center">-->
|
<!-- <el-button type="primary" style="margin-right: 80px">检查内容上传</el-button>-->
|
<!-- <div slot="tip" class="el-upload__tip">只能上传doc/docx文件</div>-->
|
<!-- </div>-->
|
<!-- </el-upload>-->
|
<el-form :model="workForm" :rules="rules" ref="workForm" label-width="80px">
|
<el-form-item label="专项检查任务名称:" label-width="180px" prop="taskName">
|
<el-input v-model="workForm.taskName"></el-input>
|
</el-form-item>
|
<div class="form-part">
|
<h3>省级检查指标</h3>
|
<!-- <p>批发企业:</p>-->
|
<el-divider content-position="left">批发企业</el-divider>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="完成检查不低于:" label-width="140px" prop="provinceWholesaleCheckTarget">
|
<el-input v-model="workForm.provinceWholesaleCheckTarget" class="input-with-select">
|
<el-select v-model="workForm.provinceWholesaleCheckTargetUnit" slot="append">
|
<el-option label="家" :value="1"></el-option>
|
<el-option label="%" :value="2"></el-option>
|
</el-select>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="完成期限:" label-width="140px" prop="provinceWholesaleCheckDeadline">
|
<el-date-picker
|
v-model="workForm.provinceWholesaleCheckDeadline"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
placeholder="请选择截止日期">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<!-- <p>零售企业:</p>-->
|
<el-divider content-position="left">零售企业</el-divider>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="完成检查不低于:" label-width="140px" prop="provinceRetailCheckTarget">
|
<el-input v-model="workForm.provinceRetailCheckTarget" class="input-with-select">
|
<el-select v-model="workForm.provinceRetailCheckTargetUnit" slot="append">
|
<el-option label="家" :value="1"></el-option>
|
<el-option label="%" :value="2"></el-option>
|
</el-select>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="完成期限:" label-width="140px" prop="provinceRetailCheckDeadline">
|
<el-date-picker
|
v-model="workForm.provinceRetailCheckDeadline"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
placeholder="请选择截止日期">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
<div class="form-part">
|
<h3>地(州、市)级检查指标</h3>
|
<!-- <p>批发企业:</p>-->
|
<el-divider content-position="left">批发企业</el-divider>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="完成检查不低于:" label-width="140px" prop="cityWholesaleCheckTarget">
|
<el-input v-model="workForm.cityWholesaleCheckTarget" class="input-with-select">
|
<template slot="append">%</template>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="完成期限:" label-width="140px" prop="cityWholesaleCheckDeadline">
|
<el-date-picker
|
v-model="workForm.cityWholesaleCheckDeadline"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
placeholder="请选择截止日期">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<!-- <p>零售企业:</p>-->
|
<el-divider content-position="left">零售企业</el-divider>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="完成检查不低于:" label-width="140px" prop="cityRetailCheckTarget">
|
<el-input v-model="workForm.cityRetailCheckTarget" class="input-with-select">
|
<template slot="append">%</template>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="完成期限:" label-width="140px" prop="cityRetailCheckDeadline">
|
<el-date-picker
|
v-model="workForm.cityRetailCheckDeadline"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
placeholder="请选择截止日期">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
<div class="form-part">
|
<h3>区县级检查指标</h3>
|
<!-- <p>批发企业:</p>-->
|
<el-divider content-position="left">批发企业</el-divider>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="完成检查不低于:" label-width="140px" prop="areaWholesaleCheckTarget">
|
<el-input v-model="workForm.areaWholesaleCheckTarget" class="input-with-select">
|
<template slot="append">%</template>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="完成期限:" label-width="140px" prop="areaWholesaleCheckDeadline">
|
<el-date-picker
|
v-model="workForm.areaWholesaleCheckDeadline"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
placeholder="请选择截止日期">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<!-- <p>零售企业:</p>-->
|
<el-divider content-position="left">零售企业</el-divider>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="完成检查不低于:" label-width="140px" prop="areaRetailCheckTarget">
|
<el-input v-model="workForm.areaRetailCheckTarget" class="input-with-select">
|
<template slot="append">%</template>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="完成期限:" label-width="140px" prop="areaRetailCheckDeadline">
|
<el-date-picker
|
v-model="workForm.areaRetailCheckDeadline"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
placeholder="请选择截止日期">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
<el-form-item label="企业自查期限:" label-width="140px" prop="enterpriseSelfCheckDeadline">
|
<el-date-picker
|
v-model="workForm.enterpriseSelfCheckDeadline"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
placeholder="选择日期">
|
</el-date-picker>
|
</el-form-item>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<!-- <el-button type="warning" @click="cancleSend" plain>取消</el-button>-->
|
<el-button @click="resetForm('workForm')">重置</el-button>
|
<el-button type="primary" v-stop-re-click @click="confirmSend('workForm')">确认下发</el-button>
|
</span>
|
</el-dialog>
|
</template>
|
|
<script>
|
import {computePageCount} from "@/utils";
|
import{sendCheckTask, uploadFile, delateFile} from "@/api/specialCheck"
|
export default {
|
name: "sendWork",
|
data(){
|
return{
|
dialogVisible:false,
|
workForm: {
|
taskName: '',
|
provinceWholesaleCheckTarget: null,
|
provinceWholesaleCheckTargetUnit: 1,
|
provinceWholesaleCheckDeadline: '',
|
provinceRetailCheckTarget: null,
|
provinceRetailCheckTargetUnit: 1,
|
provinceRetailCheckDeadline: '',
|
cityWholesaleCheckTarget: null,
|
cityWholesaleCheckDeadline: '',
|
cityRetailCheckTarget: null,
|
cityRetailCheckDeadline: '',
|
areaWholesaleCheckTarget: null,
|
areaWholesaleCheckDeadline: '',
|
areaRetailCheckTarget: null,
|
areaRetailCheckDeadline: '',
|
enterpriseSelfCheckDeadline: ''
|
},
|
rules: {
|
taskName: [{ required: true, message: '请输入任务名称', trigger: 'blur' }],
|
provinceWholesaleCheckTarget: [{ required: true, message: '请输入指标', trigger: 'blur' }],
|
provinceWholesaleCheckDeadline: [{ required: true, message: '请选择日期', trigger: 'blur' }],
|
provinceRetailCheckTarget: [{ required: true, message: '请输入指标', trigger: 'blur' }],
|
provinceRetailCheckDeadline: [{ required: true, message: '请选择日期', trigger: 'blur' }],
|
cityWholesaleCheckTarget: [{ required: true, message: '请输入指标', trigger: 'blur' }],
|
cityWholesaleCheckDeadline: [{ required: true, message: '请选择日期', trigger: 'blur' }],
|
cityRetailCheckTarget: [{ required: true, message: '请输入指标', trigger: 'blur' }],
|
cityRetailCheckDeadline: [{ required: true, message: '请选择日期', trigger: 'blur' }],
|
areaWholesaleCheckTarget: [{ required: true, message: '请输入指标', trigger: 'blur' }],
|
areaWholesaleCheckDeadline: [{ required: true, message: '请选择日期', trigger: 'blur' }],
|
areaRetailCheckTarget: [{ required: true, message: '请输入指标', trigger: 'blur' }],
|
areaRetailCheckDeadline: [{ required: true, message: '请选择日期', trigger: 'blur' }],
|
enterpriseSelfCheckDeadline: [{ required: true, message: '请选择日期', trigger: 'blur' }]
|
}
|
}
|
},
|
watch: {
|
},
|
methods:{
|
//上传文件的事件
|
// async uploadFile(item){
|
// const t = this
|
// const loading = this.$loading({
|
// lock: true,
|
// text: '正在上传文件...',
|
// spinner: 'el-icon-loading'
|
// });
|
// //上传文件的需要formdata类型;所以要转
|
// let FormDatas = new FormData()
|
// FormDatas.append('taskDescFile',item.file);
|
// const res = await uploadFile(FormDatas)
|
// if(res.data.code == '200'){
|
// loading.close();
|
// t.$message({
|
// type:'success',
|
// message: '上传成功'
|
// })
|
// t.fileList.push(item.file)
|
// console.log(t.fileList,'fileList')
|
// t.workForm.taskDescFileName = res.data.result
|
// }else{
|
// loading.close();
|
// t.$message({
|
// type:'warning',
|
// message:res.data.message
|
// })
|
// }
|
// axios({
|
// method: 'post',
|
// url: 'http://192.168.0.29:8100/checkTask/upload/taskDescFile',
|
// headers:this.headers,
|
// timeout: 30000,
|
// data: FormDatas
|
// }).then(res=>{
|
// if(res.data.id != '' || res.data.id != null){
|
// this.fileList.push(item.file);//成功过后手动将文件添加到展示列表里
|
// let i = this.fileList.indexOf(item.file)
|
// this.fileList[i].id = res.data.id;//id也添加进去,最后整个大表单提交的时候需要的
|
// if(this.fileList.length > 0){//如果上传了附件就把校验规则给干掉
|
// this.fileflag = false;
|
// this.$set(this.rules.url,0,'')
|
// }
|
// //this.handleSuccess();
|
// }
|
// })
|
// },
|
//上传文件之前
|
// beforeUpload(file){
|
// const t = this
|
// if (file.type != "" || file.type != null || file.type != undefined){
|
// //截取文件的后缀,判断文件类型
|
// console.log(t.fileType,file.name,'666')
|
// const FileExt = file.name.replace(/.+\./, "").toLowerCase();
|
// // //计算文件的大小
|
// // const isLt5M = file.size / 1024 / 1024 < 50; //这里做文件大小限制
|
// // //如果大于50M
|
// // if (!isLt5M) {
|
// // this.$showMessage('上传文件大小不能超过 50MB!');
|
// // return false;
|
// // }
|
// //如果文件类型不在允许上传的范围内
|
// if(t.fileType.indexOf(FileExt) !== -1){
|
// return true;
|
// }
|
// else {
|
// t.$message.error("上传文件格式不正确!");
|
// return false;
|
// }
|
// }
|
// },
|
// async handleRemove(file, fileList) {
|
// const t = this
|
// const res = await delateFile({taskDescFileName: t.workForm.taskDescFileName})
|
// if(res.data.code == '200'){
|
// t.$message({
|
// type:'success',
|
// message: '删除成功'
|
// })
|
// t.fileList = []
|
// }else{
|
// t.$message({
|
// type:'warning',
|
// message:res.data.message
|
// })
|
// }
|
// },
|
// handlePreview(file) {
|
// console.log(file);
|
// },
|
// handleExceed(files, fileList) {
|
// this.$message.warning(`当前限制选择 1 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`);
|
// },
|
// beforeRemove(file, fileList) {
|
// return this.$confirm(`确定移除 ${ file.name }?`);
|
// },
|
confirmSend(formName){
|
const t = this
|
t.$refs[formName].validate((valid) => {
|
if (valid) {
|
this.$confirm('确认将任务下发到所有单位,一经下发不可修改撤回,请谨慎核对!', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
center: true,
|
cancelButtonClass: 'canBtn',
|
confirmButtonClass: 'sendBtn'
|
}).then(async () => {
|
const loading = this.$loading({
|
lock: true,
|
text: '正在下发...',
|
spinner: 'el-icon-loading'
|
});
|
let res = await sendCheckTask(t.workForm)
|
if(res.data.code === "200"){
|
loading.close();
|
t.$message({
|
type:'success',
|
message: '任务下发成功'
|
})
|
}else{
|
loading.close();
|
t.$message({
|
type:'warning',
|
message:res.data.message
|
})
|
}
|
// t.fileList = []
|
t.dialogVisible = false
|
t.$parent.getSpecialCheckTask();
|
}).catch(() => {
|
this.$message({
|
type: 'info',
|
message: '已取消下发'
|
});
|
});
|
} else {
|
return false;
|
}
|
});
|
},
|
// cancleSend(){
|
// this.resetForm('workForm')
|
// this.dialogVisible = false
|
// },
|
async resetForm(formName) {
|
const t = this
|
// if(t.workForm.taskDescFileName !== null){
|
// const res = await delateFile({taskDescFileName: t.workForm.taskDescFileName})
|
// if(res.data.code == '200'){
|
// t.$message({
|
// type:'success',
|
// message: '已取消下发'
|
// })
|
// }else{
|
// t.$message({
|
// type:'warning',
|
// message:res.data.message
|
// })
|
// }
|
// }
|
t.$refs[formName].resetFields()
|
// t.fileList = []
|
}
|
},
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
|
.input-with-select .el-select {
|
width: 120px;
|
}
|
|
.el-date-editor.el-input{
|
width: 100%;
|
}
|
.el-divider__text{
|
background-color: #fafafa;
|
color: #034EA2;
|
}
|
|
.form-part{
|
background: #fafafa;
|
padding: 10px 15px;
|
border-radius: 8px;
|
margin-bottom: 20px;
|
|
&:last-of-type{
|
margin-bottom: 0;
|
}
|
&>h3{
|
text-align: center;
|
color: #034EA2;
|
}
|
|
&>p{
|
font-weight: bolder;
|
font-size: 15px;
|
padding-left: 20px;
|
color: #034EA2;
|
}
|
}
|
</style>
|
<style>
|
.canBtn{
|
width: 30%;
|
font-size: 16px;
|
}
|
.sendBtn{
|
width: 30%;
|
font-size: 16px;
|
background-color: #ff5555 !important;
|
border-color: rgba(0,0,0,0);
|
}
|
</style>
|