From 33dd4cb476136dbcb57ac71c9bb441d3418a507f Mon Sep 17 00:00:00 2001 From: songshankun <songshankun@foxmail.com> Date: 星期四, 21 九月 2023 20:24:31 +0800 Subject: [PATCH] style: 产品管理模块样式调整,迁移搜索组件 --- src/views/productManage/product/index.vue | 84 ++++++++++++++++++++++++++++++++---------- 1 files changed, 64 insertions(+), 20 deletions(-) diff --git a/src/views/productManage/product/index.vue b/src/views/productManage/product/index.vue index 60844cb..d6a3029 100644 --- a/src/views/productManage/product/index.vue +++ b/src/views/productManage/product/index.vue @@ -1,18 +1,30 @@ <template> - <div class="rightContent"> - <div class="top"> - <div class="supplier-search"> - <SearchCommonView - ref="searchCommonView" - :search-options="searchOptions" - @searchClick="searchClick" - @resetClick="resetClick" + <div class="product-manage"> + <div class="filter"> + <div class="filter-card"> +<!-- <SearchCommonView--> +<!-- ref="searchCommonView"--> +<!-- :search-options="searchOptions"--> +<!-- @searchClick="searchClick"--> +<!-- @resetClick="resetClick"--> +<!-- />--> + + <CommonSearch + :show-add="false" + :show-download="false" + :amount-view="false" + :show-action-btn="false" + :placeholder="'璇疯緭鍏ヤ骇鍝佸悕绉�/渚涘簲鍟�'" + @searchClick="onFilterSearch" /> + <div class="add-view"> - <!-- <el-button type="primary" size="mini" @click="addBtnClick">鏂板缓</el-button> --> + <!-- <el-button type="primary" size="mini" @click="addBtnClick">鏂板缓</el-button>--> </div> </div> - <template> + </div> + <div class="body"> + <div class="body-card"> <div class="list-view"> <TableCommonView ref="tableListRef" :table-list="tableList" @selCommonClick="selCommonClick"> <!-- <template slot="tableButton"> @@ -25,11 +37,11 @@ </template> --> </TableCommonView> </div> - <div class="btn-pager"> <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> </div> - </template> + </div> + </div> <!-- 鏂板缓/缂栬緫浜у搧 --> <AddProduct v-if="editConfig.visible" :add-common-config="editConfig" /> @@ -52,6 +64,7 @@ computed: {}, data() { return { + searchText:'', tableList: {}, searchOptions: [], commonDetail: { @@ -119,6 +132,15 @@ console.log(val, content) this.getData(val.value, content) }, + + onFilterSearch(val){ + this.searchText = val ?? '' + console.log(this.searchText) + + // TODO: 闇�瑕佹帴鍙f敮鎸� + throw new Error("鍔熻兘鏈疄鐜�") + }, + resetClick() { this.getData() }, @@ -165,14 +187,35 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> -.rightContent { +.product-manage{ height: 100%; - background: #f0f2f5; - padding: 10px; - .top { - margin-bottom: 20px; - height: calc(100% - 30px); - background: #fff; + overflow: hidden; + .filter{ + height: 80px; + display: flex; + align-items: center; + padding: 12px 20px 0 20px; + &-card{ + height: 80px; + display: flex; + align-items: center; + 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; + } + .supplier-search { display: flex; align-items: center; @@ -182,7 +225,8 @@ } } .list-view { - height: calc(100% - 120px); + height: calc(100% - 60px); + overflow: hidden; } .btn-pager { display: flex; -- Gitblit v1.8.0