| | |
| | | :show-add="true" |
| | | add-title="新建" |
| | | @addCommonClick="addBtnClick" |
| | | :show-download="false" |
| | | :show-download="true" |
| | | :amount-view="false" |
| | | :show-action-btn="false" |
| | | :placeholder="'请输入供应商名称'" |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | <div class="bottom"> |
| | | <div class="simple-filter"> |
| | |
| | | :show-add="false" |
| | | :show-download="false" |
| | | :amount-view="false" |
| | | :show-screen="false" |
| | | :show-action-btn="false" |
| | | :placeholder="'请输入产品名称'" |
| | | @searchClick="onProductFilterSearch" |
| | |
| | | computed: {}, |
| | | data() { |
| | | return { |
| | | searchSupplierName: '', |
| | | searchSupplierName: "", |
| | | tableList: {}, // 供应商列表 |
| | | productTableList: {}, // 产品列表 |
| | | selValueList: [], |
| | |
| | | totalCount: 0 |
| | | }, |
| | | supplierId: 0, |
| | | showCol:['供应商编号','供应商名称','供应商类型','所属行业','联系人','联系电话','状态'], |
| | | showCol: ["供应商编号", "供应商名称", "供应商类型", "所属行业", "联系人", "联系电话", "状态"], |
| | | tableColumn: [ |
| | | { label: "供应商编号", prop: "number", min: 190, isCommonClick: true }, |
| | | { label: "供应商名称", prop: "name", min: 130, default: true }, |
| | |
| | | { label: "状态", prop: "status_name", min: 130 }, |
| | | { label: "创建时间", prop: "created_at", min: 130 } |
| | | ], |
| | | showProductCol:['产品编码','产品名称','产品规格','单位','采购价格','供货时长(天)','物流时长(天)'], |
| | | showProductCol: ["产品编码", "产品名称", "产品规格", "单位", "采购价格", "供货时长(天)", "物流时长(天)"], |
| | | productColumn:[ |
| | | { label: "产品编码", prop: "number", min: 190 }, |
| | | { label: "产品名称", prop: "name", min: 130, default: true }, |
| | |
| | | }, |
| | | methods: { |
| | | setColumnVisible(showCol){ |
| | | return this.tableColumn.map(ele=>{ |
| | | return this.tableColumn.map((ele) => { |
| | | return { |
| | | ...ele, |
| | | isShowColumn: showCol.includes(ele.label) |
| | |
| | | }) |
| | | }, |
| | | setProductColumnVisible(showCol){ |
| | | return this.productColumn.map(ele=>{ |
| | | return this.productColumn.map((ele) => { |
| | | return { |
| | | ...ele, |
| | | isShowColumn:showCol.includes(ele.label) |
| | |
| | | ref: "tableListRef", |
| | | showcol: this.showCol, |
| | | allcol: [], |
| | | tableColumn: this.setColumnVisible(this.showCol), |
| | | tableColumn: this.setColumnVisible(this.showCol) |
| | | } |
| | | this.tableList.allcol = this.tableList.tableColumn.filter(ele=>!ele.default).map(ele=>ele.label); |
| | | 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++) { |
| | |
| | | } |
| | | }, |
| | | selTableCol(val) { |
| | | this.showcol = val; |
| | | this.tableList.tableColumn = this.setColumnVisible(val); |
| | | this.showcol = val |
| | | this.tableList.tableColumn = this.setColumnVisible(val) |
| | | }, |
| | | setProductTable() { |
| | | this.productTableList = { |
| | |
| | | selectIndex: true, |
| | | showcol: this.showProductCol, |
| | | allcol: [], |
| | | tableColumn: this.setProductColumnVisible(this.showProductCol), |
| | | tableColumn: this.setProductColumnVisible(this.showProductCol) |
| | | } |
| | | this.searchProductOptions = [] |
| | | for (let i = 0; i < this.productTableList.tableColumn.length; i++) { |
| | |
| | | this.searchProductOptions.push({ value: value, label: label }) |
| | | } |
| | | |
| | | this.productTableList.allcol = this.productTableList.tableColumn.filter(ele=>!ele.default).map(ele=>ele.label); |
| | | console.log('this.productTableList',this.productTableList) |
| | | this.productTableList.allcol = this.productTableList.tableColumn |
| | | .filter((ele) => !ele.default) |
| | | .map((ele) => ele.label) |
| | | console.log("this.productTableList", this.productTableList) |
| | | }, |
| | | selProductTableCol(val) { |
| | | this.showProductCol = val; |
| | | this.productTableList.tableColumn = this.setProductColumnVisible(val); |
| | | this.showProductCol = val |
| | | this.productTableList.tableColumn = this.setProductColumnVisible(val) |
| | | }, |
| | | // 请求数据 |
| | | getData() { |
| | |
| | | }) |
| | | |
| | | // 重新获取供应商列表后应该重置产品列表页码 |
| | | this.productPagerOptions.currPage = 1; |
| | | this.productPagerOptions.currPage = 1 |
| | | // 如果供应商列表为空,则可提供产品列表也应为空 |
| | | if (list.length){ |
| | | this.getProductList() |
| | | }else { |
| | | this.productTableList.tableInfomation=[] |
| | | this.productPagerOptions.currPage = 1; |
| | | this.productPagerOptions.currPage = 1 |
| | | this.productPagerOptions.totalCount = 0 |
| | | } |
| | | } |
| | |
| | | }, |
| | | // 搜索供应商 |
| | | onFilterSearch(searchText){ |
| | | this.searchSupplierName = searchText ??'' |
| | | this.searchSupplierName = searchText ?? "" |
| | | this.pagerOptions.currPage = 1 |
| | | this.getSupplierList() |
| | | }, |
| | | // 搜索产品 |
| | | onProductFilterSearch(searchText){ |
| | | this.productPagerOptions.currPage = 1 |
| | | this.getProductList('name', searchText) |
| | | this.getProductList("name", searchText) |
| | | }, |
| | | // 新建供应商 |
| | | addBtnClick() { |
| | |
| | | left: 0; |
| | | } |
| | | } |
| | | |
| | | </style> |