yos_web/src/HManagement/task/modules/addcopy1.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" @close="leaderShow = false;assistShow = false">
			<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;提醒时间：结束前&nbsp;</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="leaderShow">
						<member ref="member" :param="param" :radio="true" @onSelect="setLeader" @onCancel="leaderShow = 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>
          <el-popover
              placement="right"
              trigger="manual"
              width="400"
              v-model="assistShow">
            <member ref="memberAssist" :param="param" :implement="form.leaderuserid" :radio="false" @onSelect="setAssist" @onCancel="assistShow = false"></member>
            <el-input placeholder="请输入内容" readonly v-model="assistPerson" class="input-with-select" size="small" slot="reference" @focus="showMenberAssist">
              <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 {
      leaderShow:false,
      assistShow:false,
			dialogTableVisible:false,
			folderid:JSON.parse(sessionStorage.getItem('folderid')).appfolderid,
			form:{
				"sys_taskid":0,
        "title":"",
        "remarks":"",
        "starttime":"",
        "remindday":0,
        "ownertable":"",
        "ownerid":0,
        "endtime":"",
				"leaderuserid":"",
        "team":{
          "justuserids":true,
          "userids":[],
        }
			},
			// 查询可选择人员参数
			param:{
        id:'20221018122201',
        content: {
          "ownertable":'sys_task',
          "ownerid":0,
          "pageSize":20,
          "where":{
            "condition":"",
            "withoutselect":0,

          }
        }
      },
			errormsg:'',
			bindData:{},
			leader:{},
      assist:[],
      assistPerson:''
		}
	},
	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.leaderShow = false
		},
    setAssist (val) {
      console.log(val)
      this.assistPerson = ''
      this.assist = []
      val.forEach((item,index)=>{
        if (index === 0){
          this.assistPerson = item.name
        }else {
          this.assistPerson = this.assistPerson + ',' + item.name
        }
        this.assist[index] = item.userid
      })
      this.assistShow = false
    },
		async submit () {
      this.form.team.userids = this.assist
			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 = ''
       /* this.insertAssist(res.data.sys_taskid)*/
      })
		},
		refresh () {
			this.form = {
				"sys_taskid":0,
        "title":"",
        "remarks":"",
        "starttime":"",
        "remindday":0,
        "ownertable":"",
        "ownerid":0,
        "endtime":""
			}
		},
		showMenber () {
			this.leaderShow = true
      this.assistShow = false
      this.$refs.member.listData()
			// this.validateInput()
		},
    showMenberAssist () {
      this.assistShow = true
      this.leaderShow = false
      this.$refs.memberAssist.listData()
      // this.validateInput()
    },
    async insertAssist(id){
      const res = await this.$api.requested({
        "id": 20220930103601,
        "content": {
          "ownertable":"sys_task",
          "ownerid":id,
          "userids":this.assist,
          "justuserids":true
        }
      })
    }
	}
}

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