From 8003ace3fff94312edeca29c0e1607b903b807e6 Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期四, 11 四月 2024 18:54:31 +0800 Subject: [PATCH] 获取产量登记详情的接口联调+2个数组重新排版成表格所需数据 --- src/views/productManage/silkRegisterForm/index.vue | 257 +++++++++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 246 insertions(+), 11 deletions(-) diff --git a/src/views/productManage/silkRegisterForm/index.vue b/src/views/productManage/silkRegisterForm/index.vue index 21ef008..533285e 100644 --- a/src/views/productManage/silkRegisterForm/index.vue +++ b/src/views/productManage/silkRegisterForm/index.vue @@ -1,21 +1,256 @@ <template> - <div class="container"></div> + <div class="silkRegister-form"> + <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" type="primary" @click="printClick">鎵撳嵃</el-button> + </template> + </CommonSearch> + </div> + </div> + + <div class="body"> + <div class="body-card"> + <div class="list-view"> + <TableCommonView + ref="tableListRef" + v-loading="loading" + :table-list="tableList" + @selTableCol="selTableCol" + > + <template slot="tableButton"> + <el-table-column label="鎿嶄綔" width="90" fixed="right"> + <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> + </div> </template> <script> +import { getRegisterList,getDeleteRegister } from "@/api/productManage/silkRegisterForm.js" +import pageMixin from "@/components/makepager/pager/mixin/pageMixin" + export default { - name: "silkRegisterForm", - props: {}, - components: {}, - mixins: [], - computed: {}, - data() { - return {} + name: "SilkRegisterForm", + props: { }, - created() {}, - methods: {} + mixins: [pageMixin], + components: { + }, + data() { + return { + tableList: {}, + loading: false, + searchOptions: [], + keyword: '', + tableColumn: [ + { label: "缂栧彿", prop: "number", min: 120, default: true }, // 涓婚 + { label: "钀戒笣鏃堕棿", prop: "finishDate", min: 190, }, // 瀹㈡埛鍚嶇О + { label: "杞︾粍", prop: "workshopGroup", min: 100, }, // 鑱旂郴浜哄鍚� + { label: "瑙勬牸", prop: "spec", min: 100 }, // 瀹㈡埛鐘舵�� + { label: "杞﹂棿", prop: "name", min: 100 }, // 鑱旂郴鏂瑰紡 + { label: "搴勫彛", prop: "market", min: 130 }, // 鑱旂郴浜烘棩鏈� + { label: "寮�濮嬪洖鏁�", prop: "startCircle", min: 130 }, // 涓嬫鍥炶鏃ユ湡 + { label: "缁撴潫鍥炴暟", prop: "endCircle", min: 110 }, // 璐熻矗浜� + ], + showCol: [ + "缂栧彿", + "钀戒笣鏃堕棿", + "杞︾粍", + "瑙勬牸", + "杞﹂棿", + "搴勫彛", + "寮�濮嬪洖鏁�", + "缁撴潫鍥炴暟", + ] + } + }, + created() { + this.setTable() + this.getData(this.keyword) + }, + computed: { + }, + methods: { + setTable() { + this.tableList = { + selectIndex: true, + tableInfomation: [], + 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 + 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 getRegisterList({ + keyword: this.keyword, + page: this.pagerOptions.currPage, + pageSize: this.pagerOptions.pageSize + }) + .then((res) => { + console.log(res) + if (res.code === 200) { + if (res.data && res.data.length > 0) { + // const list = res.data.map((item) => { + // return { + // ...item, + // client_name: item.client.name, + // contact_name: item.contact.name, + // client_status: item.client_status.name, + // phone: item.contact.phone, + // member_name: item.member.username, + // contact_information_name: item.contact_information.name + // } + // }) + this.tableList.tableInfomation = res.data || [] + this.pagerOptions.totalCount = res.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.$router.push({ + path:"/productManage/silkRegisterForm/addPage?activeName=first", + }); + }, + // 鎵撳嵃 + printClick(){ + + }, + // 缂栬緫 + handleClick(row) { + this.$router.push({ + path:"/productManage/silkRegisterForm/addPage", + query:{ + id:row.ID, + activeName:'first', + inspectID:row.finenessCheckID, + } + }); + }, + // 鍒犻櫎 + delClick(id) { + this.$confirm("璇风‘璁ゆ槸鍚﹀垹闄わ紝鍒犻櫎鎿嶄綔涓嶅彲鎾ら攢?", "璀﹀憡", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning" + }) + .then(() => { + getDeleteRegister({ id: id }).then((response) => { + if (response.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛") + this.getData() + } else { + this.$message.warning("鍒犻櫎澶辫触") + } + }) + }) + .catch(() => {}) + }, + } } </script> <!-- Add "scoped" attribute to limit CSS to this component only --> -<style lang="scss" scoped></style> +<style lang="scss" scoped> +.silkRegister-form { + height: 100%; + overflow: hidden; + .filter { + height: 80px; + display: flex; + 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; + } + } + } +} +</style> -- Gitblit v1.8.0