yos_web/src/HManagement/task/modules/addCopy.vue

<template>
  <div>
    <el-button size="small" type="primary" @click="dialogTableVisible = true">
        创建任务
    </el-button>
    <el-dialog title="创建任务" append-to-body :visible.sync="dialogTableVisible" width="700px">
			<el-alert
				v-if="errormsg"
				class="normal-margin"
				:title="errormsg"
				type="error">
			</el-alert>
			<el-input class="normal-margin" v-model="form.title" placeholder="输入任务标题" type="text" show-word-limit maxlength="40" size="small"></el-input>
			<el-input  class="normal-margin" v-model="form.remarks" placeholder="输入任务内容" :autosize="{minRows:6}" type="textarea" show-word-limit maxlength="100" size="small"></el-input>
			<div class="flex-align-center flex-between normal-margin">
				<p class="task__label"><i class="el-icon-time"></i>&emsp;开始：</p>
				<el-date-picker
					v-model="form.starttime"
					type="date"
					placeholder="选择日期"
					value-format="yyyy-MM-dd"
					size="small">
				</el-date-picker>
				&emsp;- &emsp;
				<p class="task__label">结束：</p>
				<el-date-picker
					v-model="form.endtime"
					type="date"
					placeholder="选择日期"
					value-format="yyyy-MM-dd"
					size="small">
				</el-date-picker>
			</div>
			<div class="normal-margin flex-align-center">
				<p class="task__label"><i class="el-icon-bell"></i>&emsp;提醒时间&emsp;</p>
				<el-input :disabled="!form.endtime" v-model="form.remindday" size="small" style="width:90px"></el-input>
				<p>&emsp;天</p>
			</div>
			<div class="normal-margin">
				<p class="task__label"><i class="el-icon-upload2"></i>&emsp;上传附件</p>
				<upload
					ref="upload"
					:folderid="folderid"
					:bindData="bindData"
					type="button">
				</upload>
			</div>
			<!-- <div class="normal-margin">
				<p class="mt-10 task__label">关联项目/客户</p>
				<el-input placeholder="请输入内容" disabled v-model="input3" class="input-with-select" size="small">
					<el-select v-model="form.nat" slot="prepend" style="width:100px" placeholder="请选择">
						<el-option label="不关联" value="1"></el-option>
						<el-option label="项目" value="2"></el-option>
						<el-option label="客户" value="3"></el-option>
					</el-select>
				</el-input>
			</div> -->
			<div>
				<p class="mt-10 task__label">执行人员</p>
				<div class="flex-align-center flex-between">
					<el-popover
						placement="right"
						trigger="manual"
						width="400"
						v-model="visible">
						<member ref="member" :param="param" :radio="true" @onSelect="setLeader" @onCancel="visible1 = false"></member>
						<el-input placeholder="请输入内容" readonly v-model="leader.name" class="input-with-select" size="small" slot="reference" @focus="showMenber">
							<p slot="prepend">主 办</p>
						</el-input>
					</el-popover>
					
					<!-- &emsp;
					<el-input placeholder="请输入内容" v-model="input3" class="input-with-select" size="small">
						<p slot="prepend">协 办</p>
					</el-input> -->
				</div>
			</div>
			<div slot="footer" class="dialog-footer">
        <el-button size="small" style="width:120px" @click="dialogTableVisible = false">取 消</el-button>
        <el-button type="warning" size="small" style="width:120px" @click="validateInput">创 建</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import member from '@/template/menber/index.vue'

import upload from '@/components/upload/preview_upload.vue';
export default {
	props:['ownertable'],
	components:{
		upload,
		member
	},
	data () {
		return {
			visible:false,
			dialogTableVisible:false,
			folderid:JSON.parse(sessionStorage.getItem('folderid')).appfolderid,
			form:{
				"sys_taskid":0,
        "title":"",
        "remarks":"",
        "starttime":"",
        "remindday":0,
        "ownertable":"",
        "ownerid":0,
        "endtime":"",
				"leaderuserid":""
			},
			// 查询可选择人员参数
			param:{
        id:'20221018122201',
        content: {
          "ownertable":'sys_task',
          "ownerid":0,
          "pageSize":20,
          "where":{
            "condition":"",
            "withoutselect":0,
            
          }
        }
      },

			errormsg:'',
			bindData:{},
			leader:{}
		}
	},
	methods:{
		validateInput () {
			if (!this.form.title) {
				this.errormsg = '请输入标题'
				return false
			} else if (!this.form.starttime) {
				this.errormsg = '请选择开始日期'
				return false
			} else {
				this.submit()
			}
		},
		setLeader (val) {
			this.leader = val[0]
			this.form.leaderuserid = val[0].userid
			this.visible = false
		},
		async submit () {
			const res = await this.$api.requested({
        "id": 20221211112101,
        "content":this.form
      })
      this.tool.showMessage(res,()=>{
				this.param.content.ownerid = res.data.sys_taskid
        this.bindData = {
          "ownertable": 'sys_task',
          "ownerid": res.data.sys_taskid,
          "usetype": 'default',
        }
        this.$refs['upload'].toUpload()
        this.$emit('onSuccess')
				this.dialogTableVisible = false
				this.refresh()
				this.errormsg = ''
      })
		},
		refresh () {
			this.form = {
				"sys_taskid":0,
        "title":"任务标题",
        "remarks":"任务说明",
        "starttime":"",
        "remindday":0,
        "ownertable":"",
        "ownerid":0,
        "endtime":""
			}
		},
		showMenber () {
			this.visible = true
			// this.validateInput()
		}
	}
}

</script>
<style scoped>
.task__label{
	color:rgb(173, 172, 172);
}
</style>