From a4ad4789a091367fc2d63e0a6250a816335ea501 Mon Sep 17 00:00:00 2001 From: zuozhengqing <a13193816592@163.com> Date: 星期三, 20 十二月 2023 16:07:43 +0800 Subject: [PATCH] 销售明细单日期选择添加限制,菜单栏数据存储vuex --- src/views/sales/contractManage/index.vue | 281 ++++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 214 insertions(+), 67 deletions(-) diff --git a/src/views/sales/contractManage/index.vue b/src/views/sales/contractManage/index.vue index f6c722c..75bafd9 100644 --- a/src/views/sales/contractManage/index.vue +++ b/src/views/sales/contractManage/index.vue @@ -1,42 +1,68 @@ <template> <div class="contract-manage"> - <SearchCommonView - ref="searchCommonView" - :label-search="true" - :query-class-options="queryClassOptions" - :search-options="searchOptions" - /> - <div class="btn-pager"> - <PublicFunctionBtnView - :receive="false" - :submit-approval="true" - ::statistics="true" - :operates-list="operatesList" - /> - <PagerView class="page" /> - </div> - <TableCommonView ref="tableListRef" :table-list="tableList"> - <template slot="tableButton"> - <el-table-column label="鎿嶄綔" width="100"> - <template slot-scope="scope"> - <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button> + <div class="filter"> + <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" + :table-list="tableList" + @selCommonClick="selCommonClick" + @getSelectArray="getSelectArray" + @selTableCol="selTableCol" + > + <template slot="tableButton"> + <el-table-column label="鎿嶄綔" width="100"> + <template slot-scope="scope"> + <el-button @click="handleClick(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> <!-- 鏂板缓/缂栬緫 --> <AddContractManageDialog v-if="editConfig.visible" :edit-common-config="editConfig" /> + <!-- 鏈轰細璇︽儏 --> + <DetailContractManage v-if="contractDetail.visible" :contract-detail="contractDetail" /> </div> </template> <script> import AddContractManageDialog from "@/views/sales/contractManage/AddContractManageDialog" +import { getContractList, getDelContract } from "@/api/sales/contractManage" +import pageMixin from "@/components/makepager/pager/mixin/pageMixin" +import DetailContractManage from "@/views/sales/contractManage/DetailContractManage" export default { name: "ContractManage", props: {}, + mixins: [pageMixin], components: { - AddContractManageDialog + AddContractManageDialog, + DetailContractManage }, computed: { searchCommonHeight() { @@ -69,70 +95,156 @@ visible: false, title: "鏂板缓", infomation: {} - } + }, + contractDetail: { + visible: false, + infomation: {} + }, + selValueList: [], + search_map: {}, + tableColumn: [ + { label: "鍚堝悓鍚嶇О", prop: "contractName", min: 120, isCommonClick: true, default: true }, + { label: "璐熻矗浜�", prop: "member_name", min: 90 }, + { label: "瀹㈡埛鍚嶇О", prop: "client_name" }, + { label: "鍚堝悓鐘舵��", prop: "serviceContractStatus_name", min: 100 }, + { label: "鍒涘缓鏃堕棿", prop: "created_at" } + ], + showCol: ["鍚堝悓鍚嶇О", "璐熻矗浜�", "瀹㈡埛鍚嶇О", "鍚堝悓鐘舵��", "鍒涘缓鏃堕棿"], + keyword:'' } }, created() { this.setTable() + if (!this.isDetail) { + this.search_map = {} + } else { + this.search_map = { + [this.addConfig.id_name]: this.addConfig.client_name + } + } + this.getData() }, methods: { setTable() { this.tableList = { - tableInfomation: [ - { - documentNumber: "ZDYB02-2", - owner: "绯荤粺绠$悊鍛�", - approvalStatus: "瀹℃壒涓�", - creator: "绯荤粺绠$悊鍛�", - createTime: "2023-0703 11:22:12" - } - ], - tableColumn: [ - { label: "鍗曟嵁缂栧彿", prop: "documentNumber", min: 120 }, - { label: "璐熻矗浜�", prop: "owner", min: 90 }, - { label: "瀹℃壒鐘舵��", prop: "approvalStatus" }, - { label: "鍒涘缓浜�", prop: "creator", min: 100 }, - { label: "鍒涘缓鏃堕棿", prop: "createTime" } - ] + tableInfomation: [], + selectIndex: true, + 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 getContractList({ + keyword:this.keyword, + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + }) + .then((res) => { + console.log(res) + if (res.code === 200) { + if (res.data.list && res.data.list.length > 0) { + const list = res.data.list.map((item) => { + return { + ...item, + member_name: item.member.username, + client_name: item.client.name, + quotation_number: item.quotation.number, + serviceContractStatus_name: item.serviceContractStatus.name + } + }) + this.tableList.tableInfomation = list || [] + this.pagerOptions.totalCount = res.data.count + } else { + this.tableList.tableInfomation = [] + } + } else { + this.tableList.tableInfomation = [] + } + this.loading = false + }) + .catch((err) => { + console.log(err) + this.tableList.tableInfomation = [] + this.loading = false + }) + }, + // 鎼滅储 + onFilterSearch(searchText) { + this.keyword=searchText + this.pagerOptions.currPage = 1 + this.getData() }, // 鏂板缓 addBtnClick() { this.editConfig.visible = true this.editConfig.title = "鏂板缓" - this.editConfig.infomation = { - customName: "", - documentNumber: "ZDYBD01-3", - owner: "", - contractStatus: "", - salesQuotation: "", - approvalWorkflow: "", - approvalSteps: "", - approvalPerson: "", - approvalOpinion: "" - } + this.editConfig.infomation = { client_name: "", quotation_number: "" } }, // 缂栬緫 handleClick(row) { console.log(row) this.editConfig.visible = true this.editConfig.title = "缂栬緫" - this.editConfig.infomation = { - customName: "", - documentNumber: "TKD20230521-12", - owner: "", - contractStatus: "", - salesQuotation: "", - approvalWorkflow: "", - approvalSteps: "", - approvalPerson: "", - approvalOpinion: "" - } + this.editConfig.infomation = { ...row } + }, + // 鍒犻櫎 + delClick(id) { + // if (this.selValueList && this.selValueList.length > 0) { + this.$confirm("鏄惁纭鍒犻櫎?", "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(() => { + getDelContract(id).then((response) => { + if (response.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛") + this.getData() + } else { + this.$message.warning("鍒犻櫎澶辫触") + } + }) + }) + .catch(() => {}) + // } else { + // this.$message.warning("璇疯嚦灏戦�夋嫨涓�鏉¤褰�") + // } + }, + getSelectArray(val) { + console.log(val) + this.selValueList = [] + const list = val.map((item) => { + return item.id + }) + this.selValueList = list + }, + // 鍚堝悓绠$悊璇︽儏 + selCommonClick(row) { + console.log(row,"鍚堝悓璇︽儏") + this.contractDetail.visible = true + this.contractDetail.infomation = { ...row } } } } @@ -141,10 +253,45 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> .contract-manage { - .btn-pager { + 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