From 61883fcf237024ceb7622daf5b23434e3eb1be74 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期一, 16 十月 2023 10:38:50 +0800 Subject: [PATCH] 产品获取值修改 --- src/views/client/contacts/index.vue | 319 +++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 249 insertions(+), 70 deletions(-) diff --git a/src/views/client/contacts/index.vue b/src/views/client/contacts/index.vue index bf3e1e8..562033e 100644 --- a/src/views/client/contacts/index.vue +++ b/src/views/client/contacts/index.vue @@ -1,33 +1,91 @@ <template> <div class="contacts-view"> - <SearchCommonView ref="searchCommonView" :query-class-options="queryClassOptions" :search-options="searchOptions" /> - <div class="btn-pager"> - <PublicFunctionBtnView :operates-list="operatesList" /> - <PagerView class="page" /> + <div v-if="isDetail" class="detail-top"> + <DetailListCommonBtn :query-class-options="queryClassOptions" /> </div> - <TableCommonView ref="tableListRef" v-loading="loading" :table-list="tableList"> - <template slot="tableButton"> - <el-table-column label="鎿嶄綔" width="120" fixed="right"> - <template slot-scope="scope"> - <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button> - <el-button type="text" size="small">璺熻繘</el-button> + <div class="filter" v-else> + <div class="filter-card"> + <CommonSearch + :show-add="false" + :show-download="false" + :amount-view="false" + :show-action-btn="false" + placeholder="璇疯緭鍏ヨ仈绯讳汉鍚嶇О" + @searchClick="onFilterSearch" + > + <template slot="leftButton"> + <el-button size="small" type="primary" @click="addBtnClick">鏂板缓</el-button> + <!-- <el-button size="small" @click="delClick">鍒犻櫎</el-button> --> </template> - </el-table-column> - </template> - </TableCommonView> + </CommonSearch> + </div> + </div> + + <div class="body"> + <div class="body-card"> + <div class="list-view"> + <TableCommonView + ref="tableListRef" + v-loading="loading" + :table-list="tableList" + @selContactsClick="selContactsClick" + @selClientClick="selClientClick" + @getSelectArray="getSelectArray" + @selTableCol="selTableCol" + > + <template slot="tableButton"> + <el-table-column label="鎿嶄綔" width="120" fixed="right"> + <template slot-scope="scope"> + <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button> + <!-- <el-button @click="followupClick(scope.row)" type="text" size="small">璺熻繘</el-button> --> + <el-button @click="delClick(scope.row.id)" type="text" size="small">鍒犻櫎</el-button> + </template> + </el-table-column> + </template> + </TableCommonView> + </div> + <div class="btn-pager"> + <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> + </div> + </div> + </div> + <!-- 鏂板缓/缂栬緫鑱旂郴浜� --> <AddContactsDialog v-if="editConfig.visible" :edit-contacts-config="editConfig" /> + <!-- 鑱旂郴浜鸿鎯� --> + <DetailContacts v-if="contactsDeail.visible" :contacts-detail="contactsDeail" /> + <!-- 瀹㈡埛璇︽儏 --> + <DetailClientManage v-if="clientDeail.visible" :client-manage-detail="clientDeail" /> + <!-- 鏂板缓/缂栬緫璺熻繘璁板綍 --> + <AddFollowupRecordsDialog v-if="editFollowupConfig.visible" :edit-contacts-config="editFollowupConfig" /> </div> </template> <script> import AddContactsDialog from "@/views/client/contacts/AddContactsDialog" -import { getContactList } from "@/api/client/contacts" +import { getContactList, getDeleteContact } from "@/api/client/contacts" +import pageMixin from "@/components/makepager/pager/mixin/pageMixin" +import AddFollowupRecordsDialog from "@/views/client/followupRecords/AddFollowupRecordsDialog" export default { name: "ContactsView", - props: {}, + props: { + isDetail: { + type: Boolean, + default: false + }, + addConfig: { + type: Object, + default: () => { + return {} + } + } + }, + mixins: [pageMixin], components: { - AddContactsDialog + AddContactsDialog, + DetailContacts: () => import("@/views/client/contacts/DetailContacts"), + DetailClientManage: () => import("@/views/client/client/DetailClientManage"), + AddFollowupRecordsDialog }, computed: {}, data() { @@ -56,37 +114,82 @@ visible: false, title: "鏂板缓", infomation: {} - } + }, + contactsDeail: { + visible: false, + infomation: {} + }, + clientDeail: { + visible: false, + infomation: {} + }, + selValueList: [], + editFollowupConfig: { + visible: false, + title: "鏂板缓", + infomation: {} + }, + search_map: {}, + tableColumn: [ + { label: "鑱旂郴浜哄鍚�", prop: "name", min: 100, isContactClick: true, default: true }, // 鑱旂郴浜哄鍚� + { label: "瀹㈡埛鍚嶇О", prop: "client_name", min: 190, isClientClick: true }, // 瀹㈡埛鍚嶇О + { label: "鑱旂郴浜虹紪鍙�", prop: "number", min: 100 }, // 鑱旂郴浜虹紪鍙� + { label: "鑱屽姟", prop: "position", min: 120 }, // 鑱屽姟 + { label: "鎵嬫満", prop: "phone", min: 100 }, // 鎵嬫満鍙风爜 + { label: "閿�鍞礋璐d汉", prop: "member_name", min: 120 }, // 閿�鍞礋璐d汉 + { label: "棣栬鑱旂郴浜�", prop: "is_first", isFirst: true, min: 90 } // 棣栬鑱旂郴浜� + ], + showCol: ['鑱旂郴浜哄鍚�','瀹㈡埛鍚嶇О','鑱旂郴浜虹紪鍙�','鑱屽姟','鎵嬫満','閿�鍞礋璐d汉','棣栬鑱旂郴浜�'] } }, created() { this.setTable() - this.getData() + if (!this.isDetail) { + this.search_map = {} + } else { + this.search_map = { + [this.addConfig.id_name]: this.addConfig.client_name + } + } + this.getData(this.search_map) }, methods: { setTable() { this.tableList = { + selectIndex: true, tableInfomation: [], - tableColumn: [ - { label: "鑱旂郴浜哄鍚�", prop: "name", min: 100 }, // 鑱旂郴浜哄鍚� - { label: "瀹㈡埛鍚嶇О", prop: "client_name", min: 190 }, // 瀹㈡埛鍚嶇О - { label: "鑱旂郴浜虹紪鍙�", prop: "number", min: 100 }, // 鑱旂郴浜虹紪鍙� - { label: "鑱屽姟", prop: "position", min: 120 }, // 鑱屽姟 - { label: "鎵嬫満", prop: "phone", min: 100 }, // 鎵嬫満鍙风爜 - { label: "閿�鍞礋璐d汉", prop: "member_id", min: 120 }, // 閿�鍞礋璐d汉 - { label: "棣栬鑱旂郴浜�", prop: "is_first", min: 90 } // 棣栬鑱旂郴浜� - ] + allcol: [], + showcol: this.showCol, + tableColumn:this.setColumnVisible(this.showCol) } + this.tableList.allcol = this.tableList.tableColumn.filter(ele=>!ele.default).map(ele=>ele.label); this.searchOptions = [] for (let i = 0; i < this.tableList.tableColumn.length; i++) { const label = this.tableList.tableColumn[i].label - this.searchOptions.push({ value: (i + 1).toString(), label: label }) + const value = this.tableList.tableColumn[i].prop + this.searchOptions.push({ value: value, label: label }) } + }, + setColumnVisible(showCol){ + return this.tableColumn.map(ele=>{ + return { + ...ele, + isShowColumn:showCol.includes(ele.label) + } + }) + }, + selTableCol(val) { + this.showcol = val; + this.tableList.tableColumn = this.setColumnVisible(val); }, // 璇锋眰鏁版嵁 async getData() { this.loading = true - await getContactList() + await getContactList({ + search_map: this.search_map, + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + }) .then((res) => { console.log(res) if (res.code === 200) { @@ -95,10 +198,12 @@ return { ...item, client_name: item.Client.name, - is_first: item.is_first ? "鏄�" : "鍚�" + client_id: item.Client.id, + member_name: item.member.username } }) this.tableList.tableInfomation = list || [] + this.pagerOptions.totalCount = res.data.count } else { this.tableList.tableInfomation = [] } @@ -113,53 +218,92 @@ this.loading = false }) }, + // 鎼滅储 + onFilterSearch(searchText){ + this.search_map.name = searchText ?? '' + this.pagerOptions.currPage = 1 + this.getData() + }, // 鏂板缓 addBtnClick() { this.editConfig.visible = true this.editConfig.title = "鏂板缓" - this.editConfig.infomation = { - name: "", - number: "", - client_id: "", - phone: "", - position: "", - member_id: "", - is_first: false, - wechat: "", - birthday: "", - email: "", - nextFollowupDate: "", - country_id: "", - province_id: "", - city_id: "", - region_id: "", - postalCode: "", - desc: "" - } + console.log(this.addIdConfig) + this.editConfig.infomation = { ...this.addConfig } }, // 缂栬緫 handleClick(row) { console.log(row) this.editConfig.visible = true this.editConfig.title = "缂栬緫" - this.editConfig.infomation = { - id: row.id, - birthday: row.birthday, - city_id: row.city_id, - client_id: 0, - country_id: row.country_id, - desc: row.desc, - email: row.email, - is_first: row.is_first || false, - member_id: row.member_id, - name: row.name, - number: row.number, - phone: row.phone, - position: row.position, - province_id: row.province_id, - region_id: row.region_id, - wechat: row.wechat + this.editConfig.infomation = { ...row } + }, + // 鍒犻櫎 + delClick(id) { + if(!id){ + if (this.selValueList && this.selValueList.length == 0) { + this.$message.warning("璇疯嚦灏戦�夋嫨涓�鏉¤褰�") + return true; + } } + this.$confirm("鏄惁纭鍒犻櫎?", "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(() => { + let params={ids: this.selValueList } + if(id){ + params={ids: [id]} + } + getDeleteContact(params).then((response) => { + if (response.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛") + this.getData() + } else { + this.$message.warning("鍒犻櫎澶辫触") + } + }) + }) + .catch(() => {}) + }, + getSelectArray(val) { + console.log(val) + this.selValueList = [] + const list = val.map((item) => { + return item.id + }) + this.selValueList = list + }, + // 鑱旂郴浜鸿鎯� + selContactsClick(row) { + console.log(row) + this.contactsDeail.visible = true + this.contactsDeail.infomation = { ...row, contact_name: row.name } + }, + // 瀹㈡埛鍚嶇О璇︽儏 + selClientClick(row) { + console.log(row) + this.clientDeail.visible = true + this.clientDeail.infomation = { + ...row.Client, + client_name: row.Client.name, + client_level: row.Client.client_level.name, + client_status: row.Client.client_status.name, + contact_name: row.name + } + }, + // 璺熻繘 + followupClick(row) { + console.log(row) + this.editFollowupConfig.title = "鏂板缓" + this.editFollowupConfig.infomation = { + ...row, + client_name: row.Client.name, + number: "", + codeStandID:'' + } + this.editFollowupConfig.visible = true } } } @@ -167,11 +311,46 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> -.contacts-view { - .btn-pager { +.contacts-view{ + height: 100%; + overflow: hidden; + .filter{ + height: 80px; display: flex; - .page { - margin-left: auto; + align-items: center; + padding: 12px 20px 0 20px; + &-card{ + height: 80px; + display: flex; + align-items: center; + box-sizing: border-box; + padding: 10px 20px; + flex: 1; + border-radius: 12px; + background-color: #fff; + } + } + .body{ + box-sizing: border-box; + padding: 10px 20px; + border-radius: 12px; + height: calc(100% - 92px); + .body-card { + background-color: #fff; + border-radius: 12px; + height: 100%; + overflow: hidden; + } + .list-view { + height: calc(100% - 60px); + overflow: hidden; + } + .btn-pager { + display: flex; + margin-top: 10px; + .page { + margin-left: auto; + } } } } -- Gitblit v1.8.0