291 lines
		
	
	
		
			9.6 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			291 lines
		
	
	
		
			9.6 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <ai-detail>
 | |
|     <template #title>
 | |
|       <ai-title :title="parentTaskCode ? '创建子任务' : '创建任务'" isShowBottomBorder isShowBack @onBackClick="onBack(true)"> </ai-title>
 | |
|     </template>
 | |
|     <template #content>
 | |
|       <ai-card title="任务信息">
 | |
|         <template slot="content">
 | |
|           <el-form ref="formData" :rules="rules" :model="formData" label-width="90px">
 | |
|             <!-- 任务类型 -->
 | |
|             <el-form-item label="任务类型:" prop="type" style="width: 30%">
 | |
|               <ai-select v-model="formData.type" placeholder="任务类型" :selectList="$dict.getDict('workTaskType')"></ai-select>
 | |
|             </el-form-item>
 | |
| 
 | |
|             <!-- 发起人 -->
 | |
|             <!-- <div class="especial">
 | |
|               <span class="icon">*</span>
 | |
|               <span class="people">发起人:</span>
 | |
|               <ai-wechat-selecter isShowUser :instance="instance" v-model="formData.sponsorUserList" :isMultiple="false" :disable="sponsorUserListDisable">
 | |
|               </ai-wechat-selecter>
 | |
|               <span class="hint">(只能选择一人)</span>
 | |
|             </div> -->
 | |
| 
 | |
|             <!-- 任务标题 -->
 | |
|             <el-form-item label="任务标题:" prop="taskTitle">
 | |
|               <el-input v-model="formData.taskTitle" placeholder="请输入任务标题" clearable :maxlength="30" show-word-limit></el-input>
 | |
|             </el-form-item>
 | |
| 
 | |
|             <!-- 任务说明 -->
 | |
|             <el-form-item label="任务说明:" prop="taskDescription">
 | |
|               <el-input v-model="formData.taskDescription" placeholder="请输入任务说明" clearable :maxlength="1000" type="textarea" show-word-limit :rows="3"></el-input>
 | |
|             </el-form-item>
 | |
| 
 | |
|             <!-- 截止日期 -->
 | |
|             <el-form-item label="截止日期:" prop="lastTime">
 | |
|               <el-date-picker v-model="formData.lastTime"  :picker-options="pickerOptions0" type="date" placeholder="请选择"  value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
 | |
|             </el-form-item>
 | |
| 
 | |
|             <!-- 任务通知 -->
 | |
|             <el-form-item label="任务通知:" prop="isNofity">
 | |
|               <el-radio-group v-model="formData.isNofity">
 | |
|                 <el-radio :label="item.label" v-for="(item, i) in isNofityList" :key="i">{{ item.name }}</el-radio>
 | |
|               </el-radio-group>
 | |
|             </el-form-item>
 | |
| 
 | |
|             <!-- 任务文件 -->
 | |
|             <el-form-item label="任务文件:" prop="taskFiles">
 | |
|               <ai-uploader :instance="instance" @change="handleChange" isShowTip fileType="file"
 | |
|                            acceptType=".zip,.rar,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.txt,.jpg,.png" :limit="9"></ai-uploader>
 | |
|             </el-form-item>
 | |
| 
 | |
|             <!-- 执行人 -->
 | |
|             <div class="especial">
 | |
|               <span class="icon">*</span>
 | |
|               <span class="people">执行人:</span>
 | |
|               <ai-wechat-selecter slot="append" isShowUser :instance="instance" v-model="formData.userInfoList" :disable="userInfoListDisable"></ai-wechat-selecter>
 | |
|             </div>
 | |
| 
 | |
|             <!-- 督办人 -->
 | |
|             <div class="especial">
 | |
|               <span class="icon"> </span>
 | |
|               <span class="people">督办人:</span>
 | |
|               <ai-wechat-selecter slot="append" isShowUser :instance="instance" v-model="formData.checkUserList" :disable="checkUserListDisable"></ai-wechat-selecter>
 | |
|             </div>
 | |
| 
 | |
|             <div class="especial">
 | |
|               <span class="icon"> </span>
 | |
|               <span class="people">抄送人:</span>
 | |
|               <ai-wechat-selecter slot="append" isShowUser :instance="instance" v-model="formData.sendUserList" :disable="sendUserListDisable"></ai-wechat-selecter>
 | |
|             </div>
 | |
|           </el-form>
 | |
|         </template>
 | |
|       </ai-card>
 | |
|     </template>
 | |
|     <template  #footer>
 | |
|       <el-button class="delete-btn footer-btn" @click="onBack">取消</el-button>
 | |
|       <el-button class="footer-btn" type="primary" @click="submit('formData')">提交</el-button>
 | |
|     </template>
 | |
|   </ai-detail>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| export default {
 | |
|   name: 'Add',
 | |
|   // 组件
 | |
|   components: {},
 | |
|   props: {
 | |
|     instance: Function,
 | |
|     params: Object,
 | |
|     dict: Object,
 | |
|     parentTaskCode: String, //创建子任务 父任务code
 | |
|   },
 | |
|   data() {
 | |
|     return {
 | |
|       formData: {
 | |
|         type: '',
 | |
|         taskTitle: '',
 | |
|         taskDescription: '',
 | |
|         lastTime: '',
 | |
|         isNofity: '0',
 | |
|         taskFiles: [],
 | |
|         checkUserList: [], //督办人
 | |
|         id: '',
 | |
|         parentTaskCode: '', //上级任务编号
 | |
|         sponsorUserList: [], // 发起人列表
 | |
|         userInfoList: [], // 执行人列表
 | |
|         sendUserList: [], //抄送人列表
 | |
|       },
 | |
|       rules: {
 | |
|         type: [{ required: true, message: '请输入任务标题', trigger: 'change' }],
 | |
|         taskTitle: [{ required: true, message: '请输入任务标题', trigger: 'change' }],
 | |
|         taskDescription: [{ required: true, message: '请输入任务说明', trigger: 'change' }],
 | |
|         lastTime: [{required: true, message: '请选择', trigger: 'change'}],
 | |
|         isNofity: [{ required: true, message: '请选择任务通知', trigger: 'change' }],
 | |
|       },
 | |
|       isAdd: true,
 | |
|       showDetail: false,
 | |
|       pickerOptions0: {
 | |
|         disabledDate(time) {
 | |
|           return time.getTime() < Date.now() - 8.64e7;
 | |
|         }
 | |
|       },
 | |
|       showEdit1: false
 | |
|     }
 | |
|   },
 | |
|   // 计算
 | |
|   computed: {
 | |
|     isNofityList() {
 | |
|       return [
 | |
|         { name: '是', label: '1' },
 | |
|         { name: '否', label: '0' },
 | |
|       ]
 | |
|     },
 | |
|     sponsorUserListDisable() {
 | |
|       return this.formData.userInfoList.concat(this.formData.checkUserList).concat(this.formData.sendUserList)
 | |
|     },
 | |
|     userInfoListDisable() {
 | |
|       return this.formData.sponsorUserList.concat(this.formData.checkUserList).concat(this.formData.sendUserList)
 | |
|     },
 | |
|     checkUserListDisable() {
 | |
|       return this.formData.userInfoList.concat(this.formData.sponsorUserList).concat(this.formData.sendUserList)
 | |
|     },
 | |
|     sendUserListDisable() {
 | |
|       return this.formData.userInfoList.concat(this.formData.checkUserList).concat(this.formData.sponsorUserList)
 | |
|     }
 | |
|   },
 | |
|   // 监听
 | |
|   watch: {},
 | |
|   // 实例创建后
 | |
|   created() {
 | |
|     this.dict.load('workTaskType').then(() => {})
 | |
|   },
 | |
|   mounted() {
 | |
|     if(this.params.id) {
 | |
|       this.getDetail()
 | |
|     }
 | |
|   },
 | |
|   // 方法
 | |
|   methods: {
 | |
|     handleChange(e) {
 | |
|       this.formData.taskFiles = e
 | |
|     },
 | |
|     // 提交
 | |
|     submit() {
 | |
|       var fileIds = []
 | |
|       if(this.formData.taskFiles.length) {
 | |
|         this.formData.taskFiles.map((item) => {
 | |
|           fileIds.push(item.id)
 | |
|         })
 | |
|       }
 | |
|       this.$refs['formData'].validate((valid) => {
 | |
|         if (valid) {
 | |
|           if(!this.formData.userInfoList.length) {
 | |
|             this.$message.error('请选择执行人')
 | |
|             return
 | |
|           }
 | |
|           this.formData.lastTime =this.formData.lastTime?this.formData.lastTime.substring(0,10) + ' 23:59:59':"";
 | |
|           this.instance.post(`/app/appworktaskinfo/addOrUpdate`, {
 | |
|             ...this.formData,
 | |
|             fileIds: fileIds,
 | |
|             taskFiles: '',
 | |
|             id: null,
 | |
|             parentTaskCode: this.parentTaskCode || ''
 | |
|           }).then((res) => {
 | |
|             if (res.code == 0) {
 | |
|               this.$message.success('提交成功')
 | |
|               setTimeout(() => {
 | |
|                 this.onBack(true)
 | |
|               }, 600)
 | |
|             }
 | |
|           })
 | |
|         }
 | |
|       })
 | |
|     },
 | |
|     getDetail() {
 | |
|       this.instance.post(`/app/appworktaskinfo/queryDetailById?id=${this.params.id}`, null).then((res) => {
 | |
|         if (res.code == 0) {
 | |
|           this.showDetail = true
 | |
|           this.formData = {...res.data}
 | |
|           this.formData.taskFiles = this.formData.fileList || []
 | |
| 
 | |
|           //选人置空 避免字段不一致
 | |
|           this.formData.checkUserList = []
 | |
|           this.formData.sponsorUserList = []
 | |
|           this.formData.userInfoList = []
 | |
|           this.formData.sendUserList = []
 | |
|           this.formData.isNofity = '0'
 | |
|         }
 | |
|       });
 | |
|     },
 | |
| 
 | |
|     // 返回按钮
 | |
|     onBack(isRefresh) {
 | |
|       if(this.parentTaskCode) {
 | |
|         this.$emit('back')
 | |
|       }else {
 | |
|         this.$emit('change', {
 | |
|           type: 'list',
 | |
|           isRefresh: !!isRefresh,
 | |
|         })
 | |
|       }
 | |
|     },
 | |
|     downFileAll () {
 | |
|       if (this.form.files.length > 0) {
 | |
|         this.instance.post('/app/appofficialdocumentinfo/downLoadAllFileForDetail', null, {
 | |
|           responseType: 'blob',
 | |
|           params: {
 | |
|             id: this.form.id
 | |
|           }
 | |
|         }).then((res) => {
 | |
|           const link = document.createElement('a')
 | |
|           let blob = new Blob([res], { type: 'application/vnd.ms-excel' })
 | |
|           link.style.display = 'none'
 | |
|           link.href = URL.createObjectURL(blob)
 | |
|           var num = ''
 | |
|           for (let i = 0; i < 10; i++) {
 | |
|             num += Math.ceil(Math.random() * 10)
 | |
|           }
 | |
|           link.setAttribute('download', '公文文件' + '.zip')
 | |
|           document.body.appendChild(link)
 | |
|           link.click()
 | |
|           document.body.removeChild(link)
 | |
|         })
 | |
|       } else {
 | |
|         this.$message.error('暂无附件提供下载')
 | |
|       }
 | |
|     },
 | |
|   },
 | |
| }
 | |
| </script>
 | |
| 
 | |
| <style scoped lang="scss">
 | |
|   .especial {
 | |
|     margin-bottom: 12px;
 | |
|     .icon {
 | |
|       vertical-align: top;
 | |
|       display: inline-block;
 | |
|       padding-top: 5px;
 | |
|       margin-left: 20px;
 | |
|       color: #f46;
 | |
|     }
 | |
|     .people {
 | |
|       display: inline-block;
 | |
|       font-size: 14px;
 | |
|       color: #666;
 | |
|       margin-right: 16px;
 | |
|       vertical-align: top;
 | |
|     }
 | |
|     .AiWechatSelecter {
 | |
|       display: inline-block;
 | |
|       margin-left: 3px;
 | |
|     }
 | |
|     .hint {
 | |
|       font-size: 14px;
 | |
|       color: #999;
 | |
|       margin-left: 16px;
 | |
|     }
 | |
|     .mar-r40{
 | |
|       margin-right: 40px;
 | |
|     }
 | |
|     .w80{
 | |
|       width: 80px;
 | |
|       text-align: right;
 | |
|       color: #888;
 | |
|     }
 | |
|   }
 | |
|   .AiWechatSelecter{
 | |
|     width: calc(100% - 120px);
 | |
|   }
 | |
| </style>
 |