|
@@ -0,0 +1,302 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-button size="small" type="primary" @click="onShow" >编 辑</el-button>
|
|
|
+ <el-drawer title="编辑联系人" append-to-body :visible.sync="dialogFormVisible" size="664px">
|
|
|
+ <div class="drawer__panel">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-form :model="form" ref="form" :rules="rules" label-position="right" label-width="90px" size="small">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="姓名:" prop="name" :rules="[
|
|
|
+ { required: true, message: '联系人姓名不能为空'},
|
|
|
+ ]">
|
|
|
+ <el-input v-model="form.name" autocomplete="on" placeholder="请填写企业名称"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item>
|
|
|
+ <el-radio v-model="form.isTelephone" label="0" >手机号</el-radio>
|
|
|
+ <el-radio v-model="form.isTelephone" label="1">座机电话</el-radio>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" v-if="form.isTelephone == '1'">
|
|
|
+ <el-form-item label="联系方式:" prop="telephone" >
|
|
|
+ <el-input v-model="form.areaCode" style="width: 25%" autocomplete="on" placeholder="请填写区号"></el-input>
|
|
|
+ <span style="color: #999999">——</span>
|
|
|
+ <el-input v-model="form.telephone" style="width: 68%" autocomplete="on" placeholder="请填写座机电话"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" >
|
|
|
+ <el-form-item v-if="form.isTelephone == '0'" label="联系方式:" prop="phonenumber" :rules="[
|
|
|
+ { required: true, message: '手机号码不能为空'},
|
|
|
+ { pattern:/^1[3-9][0-9]\d{8}$/, message: '请输入正确手机号码',trigger: 'change' }
|
|
|
+ ]">
|
|
|
+ <el-input v-model="form.phonenumber" autocomplete="on" placeholder="请填写手机号码"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="微信:" prop="wechatnum">
|
|
|
+ <el-input v-model="form.wechatnum" autocomplete="on" placeholder="请填写微信号"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="邮箱:" prop="email" :rules="[
|
|
|
+ { pattern:/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/, message: '请输入正确邮箱',trigger: 'blur' }
|
|
|
+ ]">
|
|
|
+ <el-input v-model="form.email" autocomplete="on" placeholder="请填写邮箱"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="传真:" prop="fax">
|
|
|
+ <el-input v-model="form.fax" autocomplete="on" placeholder="请填写传真"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="单位:" prop="company">
|
|
|
+ <el-input v-model="form.company" autocomplete="on" placeholder="请填写单位"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="部门:" prop="depname">
|
|
|
+ <el-input v-model="form.depname" autocomplete="on" placeholder="请填写部门"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="职位:" prop="position">
|
|
|
+ <el-input v-model="form.position" autocomplete="on" placeholder="请填写职位"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="性别:" prop="sex">
|
|
|
+ <el-radio v-model="form.sex" label="男">男</el-radio>
|
|
|
+ <el-radio v-model="form.sex" label="女">女</el-radio>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="生日" prop="birthday">
|
|
|
+ <el-date-picker
|
|
|
+ style="width:100%"
|
|
|
+ v-model="form.birthday"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="家庭住址" prop="homeaddress">
|
|
|
+ <el-input v-model="form.homeaddress" autocomplete="on" placeholder="请填写家庭住址"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <!-- <el-col :span="12">
|
|
|
+ <el-form-item label="微信">
|
|
|
+ <el-input v-model="form.wechat" autocomplete="on" placeholder="输入联系人微信"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col> -->
|
|
|
+
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="群组" prop="sys_phonebookgroupid">
|
|
|
+
|
|
|
+ <el-select v-model="form.groupname" style="width:100%" v-if="form.groupname == '客户联系人' || form.groupname == '项目联系人'" disabled>
|
|
|
+ <el-option :value="form.groupname" :label="form.groupname"></el-option>
|
|
|
+ </el-select>
|
|
|
+
|
|
|
+ <el-select v-model="form.sys_phonebookgroupid" style="width:100%" v-else>
|
|
|
+ <el-option v-for="item in group" :key="item.index" :value="item.sys_phonebookgroupid" :label="item.groupname"></el-option>
|
|
|
+ </el-select>
|
|
|
+
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+<!-- <el-col :span="24">
|
|
|
+ <el-form-item label="标签" prop="tags">
|
|
|
+ <el-select v-model="form.tag" style="width:100%" multiple>
|
|
|
+ <el-option v-for="item in tagsList" :key="item.index" :value="item" :label="item"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>-->
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="标签" prop="tags">
|
|
|
+ <el-select v-model="form.tag" style="width:100%" multiple>
|
|
|
+ <el-option v-for="item in tagList" :key="item.index" :value="item.tag" :label="item.tag" :disabled="hasDisabledTag(item)"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="备注" prop="remarks">
|
|
|
+ <el-input v-model="form.remarks" autocomplete="on" placeholder="输入联系人备注"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-form>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="fixed__btn__panel">
|
|
|
+ <el-button size="small" style="width:120px" @click="dialogFormVisible = false">取 消</el-button>
|
|
|
+ <el-button size="small" style="width:120px" type="primary" @click="addGroup">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {mapGetters} from 'vuex'
|
|
|
+import {i18nGetResources} from "@wangeditor/editor";
|
|
|
+
|
|
|
+export default {
|
|
|
+ props:['data','tagList','allGroup','tagsList','group'],
|
|
|
+ data () {
|
|
|
+ var telephone = (rule,value,callback) =>{
|
|
|
+ if (this.form.areaCode === '' && this.form.telephone === ''){
|
|
|
+ callback(new Error('座机电话不能为空'))
|
|
|
+ } else {
|
|
|
+ var reg=/^0\d{2,3}-\d{7,8}$/
|
|
|
+ let telephone = this.form.areaCode + '-' + this.form.telephone
|
|
|
+ if (!reg.test(telephone)){
|
|
|
+ callback(new Error('请输入正确座机电话'))
|
|
|
+ }else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ dialogFormVisible:false,
|
|
|
+ form:{
|
|
|
+ "sys_phonebookid":0, //sys_phonebookid<=0时 为新增
|
|
|
+ "sys_phonebookgroupid":null,
|
|
|
+ "isTelephone":'0',
|
|
|
+ "name": "",
|
|
|
+ "phonenumber": "",
|
|
|
+ "company": "",
|
|
|
+ "depname": "",
|
|
|
+ "position": "",
|
|
|
+ "email": "",
|
|
|
+ "sex": "男",
|
|
|
+ "birthday": "",
|
|
|
+ "homeaddress": "",
|
|
|
+ "remarks": "",
|
|
|
+ "tag": [],
|
|
|
+ "areaCode":'',
|
|
|
+ "telephone":''
|
|
|
+ },
|
|
|
+ tags:[],
|
|
|
+ rules:{
|
|
|
+ telephone:[
|
|
|
+ { required: true, validator: telephone, trigger: 'change' }
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed:{
|
|
|
+ ...mapGetters({
|
|
|
+ sys_options:'sys_options'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ onShow () {
|
|
|
+ this.dialogFormVisible = true
|
|
|
+ this.form = Object.assign({},this.form,this.data)
|
|
|
+ console.log(this.form,'form可编辑')
|
|
|
+ this.form.tag = this.data.tag1
|
|
|
+ if ((this.form.phonenumber.indexOf('-')) != '-1'){
|
|
|
+ this.form.isTelephone = '1'
|
|
|
+ this.form.areaCode = this.data.phonenumber.substring(0,this.form.phonenumber.indexOf('-'))
|
|
|
+ this.form.telephone = this.data.phonenumber.substring(this.form.areaCode.length+1)
|
|
|
+ this.form.phonenumber = ''
|
|
|
+ }else {
|
|
|
+ this.form.isTelephone = '0'
|
|
|
+ this.form.areaCode = ''
|
|
|
+ this.form.telephone = ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addGroup () {
|
|
|
+ console.log(this.form,'form')
|
|
|
+ console.log(this.data,'data')
|
|
|
+ this.$refs['form'].validate(async (valid) => {
|
|
|
+ if (!valid) return false;
|
|
|
+ this.tags = this.form.tag
|
|
|
+ /* this.form.tag = []*/
|
|
|
+ if (this.form.isTelephone == '1'){
|
|
|
+ this.form.phonenumber = this.form.areaCode + "-" + this.form.telephone
|
|
|
+ }
|
|
|
+ if (this.form.groupname === '客户联系人'){
|
|
|
+ const res = await this.$api.requested({
|
|
|
+ "id": "20221018141802",
|
|
|
+ "content": this.form
|
|
|
+ })
|
|
|
+ this.tool.showMessage(res,async()=>{
|
|
|
+ let res2 = await this.$api.requested({
|
|
|
+ "id": 20220929090901,
|
|
|
+ "content": {
|
|
|
+ "ownertable":"plm_unit",
|
|
|
+ "ownerid":this.data.contactsid,
|
|
|
+ "datatag": this.tags
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.$emit('onEditSuccess',this.form)
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ })
|
|
|
+ }else if (this.form.groupname === '项目联系人'){
|
|
|
+
|
|
|
+ const res = await this.$api.requested({
|
|
|
+ "id": "20221018141802",
|
|
|
+ "content": this.form
|
|
|
+ })
|
|
|
+ this.tool.showMessage(res,async()=>{
|
|
|
+ let res2 = await this.$api.requested({
|
|
|
+ "id": 20220929090901,
|
|
|
+ "content": {
|
|
|
+ "ownertable":"sa_project_contacts",
|
|
|
+ "ownerid":this.data.sa_project_contactsid,
|
|
|
+ "datatag": this.tags
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.$emit('onEditSuccess',this.form)
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ })
|
|
|
+ }else {
|
|
|
+ const res = await this.$api.requested({
|
|
|
+ "id": "20220831164503",
|
|
|
+ "content": this.form
|
|
|
+ })
|
|
|
+ this.tool.showMessage(res,async()=>{
|
|
|
+ let res2 = await this.$api.requested({
|
|
|
+ "id": 20220929090901,
|
|
|
+ "content": {
|
|
|
+ "ownertable":"sys_phonebook",
|
|
|
+ "ownerid":this.data.sys_phonebookid,
|
|
|
+ "datatag": this.tags
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.$emit('onEditSuccess',this.form)
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ });
|
|
|
+ },
|
|
|
+ hasDisabledTag (item) {
|
|
|
+ let arr = []
|
|
|
+ let arr2 = []
|
|
|
+ arr = this.tagList.filter(item=>{
|
|
|
+ return this.tags.includes(item.tag)
|
|
|
+ })
|
|
|
+ arr.forEach(e=>{
|
|
|
+ arr2 = arr2.concat(e.mutextag)
|
|
|
+ })
|
|
|
+ arr2 = this.tags.length === 0?[]:arr2
|
|
|
+ let _isSame = arr2.some(tag=>item.tag === tag)
|
|
|
+ return _isSame
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ this.$store.dispatch('optiontypeselect','sex')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+</style>
|