From f2b7de3623f3e439c27fd0363d73a6d74a9b4aaf Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期三, 29 十一月 2023 15:39:40 +0800 Subject: [PATCH] 客户管理模块新建设置默认负责人为当前用户 --- src/views/client/contacts/AddContactsDialog.vue | 355 ++++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 252 insertions(+), 103 deletions(-) diff --git a/src/views/client/contacts/AddContactsDialog.vue b/src/views/client/contacts/AddContactsDialog.vue index 8e1b95d..0517286 100644 --- a/src/views/client/contacts/AddContactsDialog.vue +++ b/src/views/client/contacts/AddContactsDialog.vue @@ -5,13 +5,16 @@ :visible.sync="editConfig.visible" :width="dialogWidth" :before-close="handleClose" + :close-on-click-modal="false" + append-to-body + custom-class="iframe-dialog" > <el-form ref="form" :model="editConfig.infomation" :rules="rules" label-position="right" - label-width="308px" + label-width="110px" size="mini" > <!-- 淇℃伅 --> @@ -20,29 +23,58 @@ <div v-if="isUnflod" class="basic-info-title">鍩烘湰淇℃伅</div> <div class="basic-info-view"> <el-row> + <!-- <el-col :span="12" v-if="isUnflod"> + <el-form-item label="鑱旂郴浜虹紪鍙�" prop="number"> + <WordInput + v-if="codenumer && (explain != '' || isIdDisabled) && method == 0" + :codenumer="codenumer" + :sum="sum" + :disabled="this.editConfig.title !== '鏂板缓' || isIdDisabled" + :inputValue="inputValue" + @codeList="codeList" + /> + <span v-else-if="method == 0" style="color: #f56c6c" + >璇蜂紭鍏堥厤缃紪鐮佽鑼� <el-button type="text" @click="numberClick"> 閰嶇疆瑙勮寖 </el-button></span + > + <span v-else>鑷姩鐢熸垚</span> + </el-form-item> + </el-col> --> <el-col :span="12"> <el-form-item label="鑱旂郴浜哄鍚�" prop="name"> <el-input v-model="editConfig.infomation.name"></el-input> </el-form-item> </el-col> - <el-col :span="12" v-if="isUnflod"> - <el-form-item label="鑱旂郴浜虹紪鍙�" prop="number"> - <el-input v-model="editConfig.infomation.number"></el-input> - </el-form-item> - </el-col> <el-col :span="12"> - <el-form-item label="瀹㈡埛鍚嶇О" prop="client_id"> + <el-form-item label="瀹㈡埛鍚嶇О" prop="client_name"> <div class="custom-name"> - <el-input v-model="editConfig.infomation.client_id"></el-input> - <div class="common-select-btn"> - <i class="el-icon-circle-plus-outline"></i> + <el-autocomplete + v-model="editConfig.infomation.client_name" + :fetch-suggestions="querySearchAsync" + value-key="name" + @select="handleSelectClient" + style="width: 100%" + ></el-autocomplete> + <div class="common-select-btn" @click="selClientClick"> + <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i> + </div> + <div + v-if="editConfig.infomation.client_name && editConfig.infomation.client_name.length > 0" + class="common-select-btn" + @click="clearupClient" + > + <i class="el-icon-remove-outline" title="娓呴櫎"></i> </div> </div> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="鎵嬫満" prop="phone"> - <el-input v-model="editConfig.infomation.phone"></el-input> + <el-input + v-model="editConfig.infomation.phone" + maxlength="11" + show-word-limit + oninput="value=value.replace(/[^\d]/g,'')" + ></el-input> </el-form-item> </el-col> <el-col :span="12"> @@ -52,13 +84,18 @@ </el-col> <el-col :span="12"> <el-form-item v-if="isUnflod" label="閿�鍞礋璐d汉" prop="member_id"> - <el-select v-model="editConfig.infomation.member_id" placeholder="璇烽�夋嫨" size="mini"> + <el-select + v-model="editConfig.infomation.member_id" + placeholder="璇烽�夋嫨" + size="mini" + style="width: 100%" + > <el-option v-for="item in memberOptions" :key="item.id" :label="item.username" :value="item.id"> </el-option> </el-select> </el-form-item> </el-col> - <el-col :span="12"> + <el-col :span="12" style="height: 47px"> <el-form-item v-if="isUnflod" label="棣栬鑱旂郴浜�" prop="is_first"> <el-switch v-model="editConfig.infomation.is_first" active-color="#2E68DB" inactive-color="#AEB9CA"> </el-switch> @@ -71,7 +108,13 @@ </el-col> <el-col :span="12"> <el-form-item v-if="isUnflod" label="鐢熸棩" prop="birthday"> - <el-date-picker v-model="editConfig.infomation.birthday" type="date" placeholder="閫夋嫨鏃ユ湡"> + <el-date-picker + v-model="editConfig.infomation.birthday" + value-format="yyyy-MM-dd" + type="date" + style="width: 100%" + placeholder="閫夋嫨鏃ユ湡" + > </el-date-picker> </el-form-item> </el-col> @@ -98,7 +141,7 @@ <el-option v-for="item in countryOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> @@ -110,11 +153,12 @@ placeholder="璇烽�夋嫨" class="common-select-sel" size="mini" + @change="selProvinceChange" > <el-option v-for="item in provinceOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> @@ -126,15 +170,16 @@ placeholder="璇烽�夋嫨" class="common-select-sel" size="mini" + :disabled="cityOptions.length <= 0 ? true : false" > <el-option v-for="item in cityOptions" :key="item.id" :label="item.name" :value="item.id"> </el-option> </el-select> - <div class="common-select-btn"><i class="el-icon-setting"></i></div> + <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> </div> </el-form-item> </el-col> - <el-col :span="12"> + <!-- <el-col :span="12"> <el-form-item label="鍖哄煙" prop="region_id"> <div class="common-select"> <el-select @@ -149,7 +194,7 @@ <div class="common-select-btn"><i class="el-icon-setting"></i></div> </div> </el-form-item> - </el-col> + </el-col> --> <!-- <el-col :span="12"> <el-form-item label="閭紪" prop="postalCode"> <el-input v-model="editConfig.infomation.postalCode"></el-input> @@ -212,6 +257,12 @@ <el-button type="primary" size="small" @click="saveClick('form')">淇� 瀛�</el-button> <el-button size="small" @click="editConfig.visible = false">鍙� 娑�</el-button> </div> + <!-- 閫夋嫨瀹㈡埛 --> + <SelectClientDialog + v-if="editSelectClientConfig.editVisible" + :edit-common-config="editSelectClientConfig" + @selClient="selClient" + /> </el-dialog> </div> </template> @@ -219,8 +270,12 @@ <script> import { getAddContact, getUpdateContact } from "@/api/client/contacts" import { getAllData } from "@/api/client/client" +import SelectClientDialog from "@/views/other/commonDialog/SelectClientDialog" +import { getCityList } from "@/api/common/address" +import codeMixin from "@/components/makepager/mixin/codeMixin" export default { name: "AddContactsDialog", + mixins: [codeMixin], props: { editContactsConfig: { type: Object, @@ -228,39 +283,43 @@ return { visible: false, title: "鏂板缓", - infomation: { - name: "", - number: "", - client_id: "", - phone: "", - position: "", - member_id: "5", - is_first: false, - wechat: "1", - birthday: "", - email: "", - nextFollowupDate: "", - country_id: "", - province_id: "", - city_id: "", - region_id: "", - postalCode: "", - desc: "" - } + infomation: {} } } } }, - components: {}, - computed: {}, + components: { SelectClientDialog }, + computed: { + clientList() { + return this.$store.state.getClientName.clientList + } + }, data() { return { - dialogWidth: "80%", + dialogWidth: "50%", editConfig: this.editContactsConfig, rules: { - name: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], - number: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], - member_id: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }] + name: [{ required: true, message: "璇疯緭鍏ヨ仈绯讳汉濮撳悕", trigger: ["change", "blur"] }], + number: [{ required: true, message: "璇疯緭鍏�", trigger: ["change", "blur"] }], + client_name: [{ required: true, message: "璇烽�夋嫨瀹㈡埛鍚嶇О", trigger: ["change", "blur"] }], + member_id: [{ required: true, validator: this.validateMemberId, trigger: ["change", "blur"] }], + phone: [ + { required: false, message: "璇疯緭鍏ユ墜鏈哄彿", trigger: ["change", "blur"] }, + { len: 11, message: "闀垮害鍦�11涓瓧绗�", trigger: ["change", "blur"] }, + { + pattern: /^1(3\d|4[5-9]|5[0-35-9]|6[2567]|7[0-8]|8\d|9[0-35-9])\d{8}$/, + message: "璇疯緭鍏ユ纭殑鎵嬫満鍙�", + trigger: ["change", "blur"] + } + ], + email: [ + { required: false, message: "", trigger: ["change", "blur"] }, + { + pattern: /^[a-zA-Z0-9_\\.]+@[a-zA-Z0-9-]+[\\.a-zA-Z]+$/, + message: "璇疯緭鍏ユ纭殑閭鏍煎紡", + trigger: ["change", "blur"] + } + ] }, businessSourceOptions: [ { value: "1", label: "鍚庡彴娉ㄥ唽" }, @@ -273,31 +332,66 @@ { value: "8", label: "鍏徃鐢佃瘽" } ], memberOptions: [], - countryOptions: [], // 鍥藉 + countryOptions: [{ id: 1, name: "涓浗" }], // 鍥藉 provinceOptions: [], // 鐪佷唤 cityOptions: [], // 鍩庡競 regionOptions: [], // 鍖哄煙 unflodCollapseStr: "鏀惰捣", - isUnflod: true + isUnflod: true, + editSelectClientConfig: { + editVisible: false, + title: "", + infomation: {} + }, + clientId: this.editContactsConfig.infomation.client_id } }, created() { + this.$store.dispatch("geClient") + if (this.editConfig.title !== "鏂板缓" && this.editConfig.infomation.province_id !== 0) { + this.getCityList(this.editConfig.infomation.province_id, "edit") + } this.getCommonData() + // this.formInfo() + }, + watch: { + "editContactsConfig.visible"(val) { + if (val) { + // this.formInfo() + console.log("11111") + } + }, + "editContactsConfig.infomation.codeStandID"() { + // this.formInfo() + } }, methods: { + formInfo() { + this.objCode.type = "鑱旂郴浜虹紪鐮�" + this.objCode.codeStandID = "" + if (this.editConfig.infomation.codeStandID) { + this.objCode.codeStandID = this.editConfig.infomation.codeStandID + } + this.getRCodeStandardList() + }, getCommonData() { - getAllData() - .then((res) => { - console.log(res) - this.memberOptions = res.data.member - this.countryOptions = res.data.country - this.provinceOptions = res.data.province - this.cityOptions = res.data.city - this.regionOptions = res.data.region - }) - .catch((err) => { - console.log(err) - }) + this.editConfig.infomation.country_id = 1 + this.editConfig.infomation.province_id = + this.editConfig.infomation.province_id === 0 ? "" : this.editConfig.infomation.province_id + this.editConfig.infomation.city_id = + this.editConfig.infomation.city_id === 0 ? "" : this.editConfig.infomation.city_id + getAllData().then((res) => { + this.memberOptions = res.data.member + if (this.editConfig.title === "鏂板缓") { + let username = document.cookie.replace(/(?:(?:^|.*;\s*)username\s*=\s*([^;]*).*$)|^.*$/, "$1") + this.memberOptions.map((item) => { + if (item.username == username) { + this.editConfig.infomation.member_id = item.id + } + }) + } + this.provinceOptions = res.data.province + }) }, handleClose() { this.editConfig.visible = false @@ -354,21 +448,53 @@ id: this.editConfig.title === "鏂板缓" ? 0 : data.id, birthday: data.birthday || "", city_id: data.city_id || 0, - client_id: 0, + client_id: this.clientId || 0, country_id: data.country_id || 0, desc: data.desc || "", email: data.email || "", is_first: data.is_first || false, member_id: data.member_id || 0, name: data.name || "", - number: data.number || "", + // number: data.number || "", phone: data.phone || "", position: data.position || "", province_id: data.province_id || 0, region_id: data.region_id || 0, wechat: data.wechat || "" + // codeStandID: data.ID, } return params + }, + // 閫夋嫨瀹㈡埛鐩稿叧鏂规硶 + querySearchAsync(queryString, cb) { + var restaurants = this.clientList + var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants + cb(results) + }, + createStateFilter(queryString) { + return (state) => { + return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0 + } + }, + handleSelectClient(item) { + this.editConfig.infomation.client_name = item.name + this.clientId = item.id + }, + selClientClick() { + this.editSelectClientConfig.editVisible = true + }, + selClient(row) { + console.log(row) + this.clientId = row.id + this.$set(this.editConfig.infomation, "client_name", row.name) + }, + // 娓呴櫎宸查�夋嫨鐢ㄦ埛 + clearupClient() { + console.log(this.editConfig.infomation.client_name, "sssssssss") + // if (this.editConfig.infomation.client_name !== "") { + this.clientId = null + this.$set(this.editConfig.infomation, "client_name", "") + // } }, // 娣诲姞闄勪欢 addAnnexClick() {}, @@ -383,6 +509,30 @@ this.unflodCollapseStr = "鏀惰捣" this.isUnflod = true } + }, + // 閫夋嫨鐪佷唤 + selProvinceChange(val) { + this.getCityList(val, "sel") + }, + async getCityList(val, value) { + await getCityList({ province_id: val }).then((res) => { + console.log(res) + if (res.data.code === 200) { + this.cityOptions = res.data.data.list + if (value === "sel") { + this.editConfig.infomation.city_id = "" + } + } + }) + }, + // 閿�鍞礋璐d汉鑷畾涔夋牎楠岃鍒� + validateMemberId(rule, value, callback) { + console.log(this.editConfig.infomation.member_id, "閿�鍞礋璐d汉鑷畾涔夋牎楠岃鍒�") + if (this.editConfig.infomation?.member_id > 0) { + callback() + } else { + callback(new Error("璇疯緭鍏ラ攢鍞礋璐d汉")) + } } } } @@ -390,58 +540,57 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> -.add-contacts { - .basic-info { - .basic-info-title { - background-color: #f4f8fe; - padding-left: 10px; - font-size: 15px; - font-weight: bold; - color: #666; - height: 42px; - line-height: 42px; - } - .basic-info-view { - margin-top: 10px; - padding-right: 40px; - .custom-name { - display: flex; - .common-select-btn { - margin-left: 5px; - font-size: 16px; +::v-deep { + .iframe-dialog .el-dialog__body { + .basic-info { + .basic-info-title { + background-color: #f4f8fe; + padding-left: 10px; + font-size: 15px; + font-weight: bold; + color: #666; + height: 42px; + line-height: 42px; + } + .basic-info-view { + margin-top: 10px; + padding-right: 40px; + .custom-name, + .common-select { + display: flex; + .common-select-btn { + margin-left: 5px; + font-size: 18px; + cursor: pointer; + } + } + .common-select { + .common-select-sel { + width: 100%; + } } } - .common-select { + .annex-view { display: flex; - .common-select-sel { - width: 270px; - } - .common-select-btn { - margin-left: 5px; - font-size: 16px; - cursor: pointer; + color: #6166d3; + .setFormat { + margin-left: 10px; } } } - .annex-view { + .unflod-collapse { display: flex; + height: 30px; + justify-content: center; + align-items: center; color: #6166d3; - .setFormat { - margin-left: 10px; - } + cursor: pointer; } - } - .unflod-collapse { - display: flex; - height: 30px; - justify-content: center; - align-items: center; - color: #6166d3; - } - .dialog-footer { - background-color: #f5f5f5; - height: 55px; - line-height: 55px; + .dialog-footer { + background-color: #f5f5f5; + height: 55px; + line-height: 55px; + } } } </style> -- Gitblit v1.8.0