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

<template>
  <div>
    <el-button size="small" type="primary" @click="dialogTableVisible = true">
        创建任务
    </el-button>
    <el-drawer
        title="创建任务"
        :visible.sync="dialogTableVisible"
        size="700px"
        direction="rtl"
        append-to-body
        :show-close="false"
        @close="onClose">
      <div class="drawer__panel">
        <el-row :gutter="10">
          <el-form :model="form" :rules="rules" ref="form" label-width="125px" label-position="right" size="mini">
            <el-col :span="24">
              <el-form-item label="任务标题:" prop="title">
                <el-input v-model="form.title" placeholder="请输入任务标题" ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="20">
              <el-form-item label="关联应用数据:" prop="tableName">
                <el-input v-model="form.tableName" placeholder="请选择关联应用数据" @focus="$refs.applicationRef.dialogTableVisible = true;$refs.applicationRef.listData()" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-button type="primary" size="mini" @click="$refs.followRef.dialogTableVisible = true;$refs.followRef.listData()" :disabled="followParam.content.ownerid === ''">同步跟进内容</el-button>
            </el-col>
            <el-col :span="24">
              <el-form-item label="任务内容:" prop="remarks">
                <el-input  class="normal-margin" v-model="form.remarks" placeholder="输入任务内容" :autosize="{minRows:6}" type="textarea" show-word-limit maxlength="100" size="small"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="开始:" prop="starttime">
                <el-date-picker
                    v-model="form.starttime"
                    type="date"
                    placeholder="选择日期"
                    value-format="yyyy-MM-dd"
                    size="small">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="结束:" prop="endtime">
                <el-date-picker
                    v-model="form.endtime"
                    type="date"
                    placeholder="选择日期"
                    value-format="yyyy-MM-dd"
                    size="small">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="提醒时间：结束前" prop="remindday">
                <el-input :disabled="!form.endtime" v-model="form.remindday" size="small" style="width:90px"></el-input>
                <span>&emsp;天</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="上传附件:" prop="remindday">
                <upload
                    ref="upload"
                    :folderid="folderid"
                    :bindData="bindData"
                    type="button">
                </upload>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="执行人:" prop="leaderuserid">
                <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">
                  </el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="协助人:" prop="remindday">
                <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">
                  </el-input>
                </el-popover>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
      </div>
      <div class="fixed__btn__panel">
        <el-button size="small" style="width:120px" @click="onClose">取 消</el-button>
        <el-button type="primary" size="small" style="width:120px" @click="validateInput">确 定</el-button>
      </div>
    </el-drawer>
    <applicationData ref="applicationRef" @selectApplication="selectApplication"></applicationData>
    <followData ref="followRef" :param="followParam" @follow="follow"></followData>
  </div>
</template>
<script>
import member from '@/template/menber/index.vue'

import upload from '@/components/upload/preview_upload.vue';
import applicationData from "@/HManagement/task/components/applicationData";
import followData from "@/HManagement/task/components/followData";
export default {
	props:['ownertable'],
	components:{
		upload,
		member,
    applicationData,
    followData
	},
	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":"",
        "tableName":'',
        "team":{
          "justuserids":true,
          "userids":[],
        }
			},
      rules: {
        title: [
          {required: true, message: '请输入任务标题', trigger: 'blur'},
        ],
        starttime: [
          {required: true, message: '请选择开始时间', trigger: 'change'},
        ],
        leaderuserid: [
          {required: true, message: '请选择执行人', trigger: 'change'},
        ],
      },
			// 查询可选择人员参数
			param:{
        id:'20221018122201',
        content: {
          "ownertable":'sys_task',
          "ownerid":0,
          "pageSize":20,
          "where":{
            "condition":"",
            "withoutselect":0,

          }
        }
      },
			errormsg:'',
			bindData:{},
			leader:{},
      assist:[],
      assistPerson:'',
      /*跟进列表*/
      followParam:{
        "id": 20231207130504,
        "content": {
          "ownertable": "",
          "ownerid": ""
        },
      }
		}
	},
	methods:{
		validateInput () {
			/*if (!this.form.title) {
				this.errormsg = '请输入标题'
				return false
			} else if (!this.form.starttime) {
				this.errormsg = '请选择开始日期'
				return false
			} else {
				this.submit()
			}*/
      this.$refs.form.validate((valid)=>{
        if (!valid) return false
        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
        }
      })
    },
    onClose(){
      this.dialogTableVisible = false
      this.leader = {}
      this.assistPerson = ''
      this.assist = []
      this.$refs.form.resetFields()
    },
    selectApplication(ownerid,ownertable){
      console.log("11111",ownerid)
      this.followParam.content.ownertable = ownertable
      this.followParam.content.ownerid = ownerid
      this.form.ownertable = ownertable
      this.form.ownerid = ownerid
      this.form.tableName = ownertable === 'sat_orderclue'?'销售线索':ownertable === 'sa_customers'?'我的客户':ownertable === 'sa_porject'?'项目商机':''
    },
    follow(data){
      this.form.remarks = data
    }
	}
}

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