| | |
| | | </div> |
| | | </div> |
| | | <template> |
| | | <TableCommonView |
| | | ref="tableListRef" |
| | | :table-list="tableList" |
| | | @selCommonClick="selCommonClick" |
| | | @getSelectArray="getSelectArray" |
| | | <el-table |
| | | ref="tableSupplier" |
| | | border |
| | | :data="tableList.tableInfomation" |
| | | tooltip-effect="dark" |
| | | style="width: 100%" |
| | | :lazy="tableList.lazy" |
| | | highlight-current-row |
| | | @row-click="tableRowClick" |
| | | :header-cell-style="{ background: '#ECF4FF', color: '#666' }" |
| | | > |
| | | <template slot="tableButton"> |
| | | <el-table-column label="操作" width="120"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | v-if="scope.row.status === 0" |
| | | @click="enableClick(scope.row, '启用')" |
| | | type="text" |
| | | size="small" |
| | | >启用</el-button |
| | | > |
| | | <el-button v-else @click="enableClick(scope.row, '停用')" type="text" size="small">停用</el-button> |
| | | <el-button @click="modifyClick(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> |
| | | <el-table-column type="index" label="序号" width="50"> </el-table-column> |
| | | <el-table-column |
| | | v-for="(item, i) in tableList.tableColumn" |
| | | :key="i" |
| | | :prop="item.prop" |
| | | :label="item.label" |
| | | :width="item.width" |
| | | :min-width="item.min" |
| | | show-overflow-tooltip |
| | | :sortable="item.sortable" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <div v-if="item.status" :class="scope.row.status">{{ scope.row[item.prop] }}</div> |
| | | <span |
| | | v-else-if="item.isCommonClick && scope.row[item.prop]" |
| | | class="sel-name" |
| | | @click="selCommonClick(scope.row)" |
| | | >{{ scope.row[item.prop] }}</span |
| | | > |
| | | <span v-else>{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" width="100"> |
| | | <template slot-scope="scope"> |
| | | <el-button v-if="scope.row.status === 0" @click="enableClick(scope.row, '启用')" type="text" size="small" |
| | | >启用</el-button |
| | | > |
| | | <el-button v-else @click="enableClick(scope.row, '停用')" type="text" size="small">停用</el-button> |
| | | <el-button @click="modifyClick(scope.row)" type="text" size="small">修改</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div class="btn-pager"> |
| | | <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" /> |
| | | </div> |
| | |
| | | </div> |
| | | <template> |
| | | <TableCommonView |
| | | ref="tableListRef" |
| | | ref="tableListProduct" |
| | | :table-list="productTableList" |
| | | @selCommonClick="selCommonClick" |
| | | @getSelectArray="getSelectArray" |
| | |
| | | <el-button @click="raleteClick(scope.row)" type="text" size="small">相关供应商</el-button> |
| | | <el-button @click="editClick(scope.row)" type="text" size="small">修改</el-button> |
| | | <el-button @click="delClick(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> |
| | |
| | | import AddSupplier from "@/views/supplierManage/supplier/AddSupplier" |
| | | import RaleteSupplierList from "@/views/supplierManage/supplier/RaleteSupplierList" |
| | | import AddNewProduct from "@/views/supplierManage/supplier/AddNewProduct" |
| | | import { getProductList, deleteProduct } from "@/api/productManage/product" |
| | | |
| | | export default { |
| | | name: "SupplierManage", |
| | |
| | | currPage: 1, |
| | | pageSize: 10, |
| | | totalCount: 0 |
| | | } |
| | | }, |
| | | supplierId: 0 |
| | | } |
| | | }, |
| | | created() { |
| | |
| | | this.tableList = { |
| | | tableInfomation: [], |
| | | selectIndex: true, |
| | | ref: "tableListRef", |
| | | tableColumn: [ |
| | | { label: "供应商编号", prop: "number", min: 190, isCommonClick: true }, |
| | | { label: "供应商名称", prop: "name", min: 130 }, |
| | |
| | | }, |
| | | setProductTable() { |
| | | this.productTableList = { |
| | | tableInfomation: [ |
| | | { |
| | | number: "aaaaa" |
| | | } |
| | | ], |
| | | tableInfomation: [], |
| | | selectBox: true, |
| | | selectIndex: true, |
| | | tableColumn: [ |
| | | { label: "产品编码", prop: "number", min: 190 }, |
| | | { label: "产品名称", prop: "name", min: 130 }, |
| | | { label: "产品规格", prop: "contact_name", min: 130 }, |
| | | { label: "单位", prop: "contact_phone", min: 130 }, |
| | | { label: "采购价格", prop: "sales_resources", min: 130 }, |
| | | { label: "供货时长(天)", prop: "province", min: 130 }, |
| | | { label: "物流时长(天)", prop: "city", min: 130 } |
| | | { label: "产品规格", prop: "specifications", min: 130 }, |
| | | { label: "单位", prop: "unit", min: 130 }, |
| | | { label: "采购价格", prop: "purchasePrice", min: 130 }, |
| | | { label: "供货时长(天)", prop: "deliveryTime", min: 130 }, |
| | | { label: "物流时长(天)", prop: "shippingDuration", min: 130 } |
| | | ] |
| | | } |
| | | this.searchProductOptions = [] |
| | |
| | | } |
| | | }, |
| | | // 请求数据 |
| | | async getData(val, content, searchName) { |
| | | if (searchName === "供应商") { |
| | | this.getSupplierList(val, content) |
| | | } else if (searchName === "产品") { |
| | | this.getProductList(val, content) |
| | | } else { |
| | | this.getSupplierList() |
| | | this.getProductList() |
| | | } |
| | | async getData(val, content) { |
| | | this.getSupplierList(val, content) |
| | | }, |
| | | // 供应商列表 |
| | | async getSupplierList(val, content) { |
| | |
| | | }) |
| | | this.tableList.tableInfomation = list || [] |
| | | this.pagerOptions.totalCount = res.data.data.total |
| | | if (list && list.length > 0) { |
| | | this.supplierId = this.tableList.tableInfomation[0].ID |
| | | } else { |
| | | this.supplierId = 0 |
| | | } |
| | | this.$nextTick(() => { |
| | | this.$refs.tableSupplier.setCurrentRow(this.tableList.tableInfomation[0]) |
| | | }) |
| | | this.getProductList() |
| | | } |
| | | }) |
| | | }, |
| | | // 产品列表 |
| | | async getProductList(val, content) { |
| | | console.log(val, content) |
| | | // await getProductList({ |
| | | // [val]: content, |
| | | // page: this.productPagerOptions.currPage, |
| | | // pageSize: this.productPagerOptions.pageSize |
| | | // }).then((res) => { |
| | | // console.log(res.data) |
| | | // }) |
| | | await getProductList({ |
| | | [val]: content, |
| | | supplierId: this.supplierId, |
| | | page: this.productPagerOptions.currPage, |
| | | pageSize: this.productPagerOptions.pageSize |
| | | }).then((res) => { |
| | | console.log(res.data) |
| | | const list = res.data.data.list.map((item) => { |
| | | return { |
| | | ...item |
| | | } |
| | | }) |
| | | this.productTableList.tableInfomation = list || [] |
| | | this.productPagerOptions.totalCount = res.data.data.total |
| | | }) |
| | | }, |
| | | // 搜索供应商 |
| | | searchClick(val, content) { |
| | | console.log(val, content) |
| | | this.getData(val.value, content, "供应商") |
| | | this.getSupplierList(val.value, content) |
| | | }, |
| | | resetClick() { |
| | | this.getData("", "", "供应商") |
| | | this.getSupplierList() |
| | | }, |
| | | // 搜索产品 |
| | | searchProductClick(val, content) { |
| | | console.log(val, content) |
| | | this.getData(val.value, content, "产品") |
| | | this.getProductList(val.value, content) |
| | | }, |
| | | resetProductClick() { |
| | | this.getData("", "", "产品") |
| | | this.getProductList() |
| | | }, |
| | | // 新建供应商 |
| | | addBtnClick() { |
| | | this.editConfig.visible = true |
| | | this.editConfig.title = "新建" |
| | | this.editConfig.infomation = { fileId: 0 } |
| | | }, |
| | | // 启用供应商 |
| | | async enableClick(row, value) { |
| | |
| | | }, |
| | | // 修改供应商 |
| | | modifyClick(row) { |
| | | console.log(row) |
| | | this.editConfig.visible = true |
| | | this.editConfig.title = "修改" |
| | | this.editConfig.infomation = { ...row } |
| | | this.editConfig.infomation = { ...row, file_name: row.contract.fileName } |
| | | }, |
| | | // 相关供应商 |
| | | raleteClick(row) { |
| | |
| | | addNewProductClick() { |
| | | this.newProductConfig.visible = true |
| | | this.newProductConfig.title = "添加" |
| | | this.newProductConfig.infomation = { supplierId: this.supplierId } |
| | | }, |
| | | // 修改产品 |
| | | editClick(row) { |
| | | console.log(row) |
| | | this.newProductConfig.visible = true |
| | | // this.newProductConfig.title = "修改" |
| | | this.newProductConfig.title = "修改" |
| | | this.newProductConfig.infomation = { ...row } |
| | | }, |
| | | // 删除 |
| | | delClick() { |
| | | if (this.selValueList && this.selValueList.length > 0) { |
| | | this.$confirm("是否确认删除?", "警告", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | }) |
| | | .then(() => { |
| | | console.log("dddd") |
| | | // deleteSupplier({ id: this.selValueList }).then((response) => { |
| | | // if (response.code === 200) { |
| | | // this.$message.success("删除成功") |
| | | // this.getData() |
| | | // } else { |
| | | // this.$message.warning("删除失败") |
| | | // } |
| | | // }) |
| | | delClick(row) { |
| | | this.$confirm("是否确认删除?", "警告", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning" |
| | | }) |
| | | .then(() => { |
| | | console.log("dddd") |
| | | deleteProduct({ id: row.ID }).then((response) => { |
| | | if (response.code === 200) { |
| | | this.$message.success("删除成功") |
| | | this.getProductList() |
| | | } else { |
| | | this.$message.warning("删除失败") |
| | | } |
| | | }) |
| | | .catch(() => {}) |
| | | } else { |
| | | this.$message.warning("请至少选择一条记录") |
| | | } |
| | | }) |
| | | .catch(() => {}) |
| | | }, |
| | | getSelectArray(val) { |
| | | console.log(val) |
| | |
| | | return item.id |
| | | }) |
| | | this.selValueList = list |
| | | }, |
| | | tableRowClick(row) { |
| | | console.log(row) |
| | | this.supplierId = row.ID |
| | | this.getProductList() |
| | | }, |
| | | // 详情 |
| | | selCommonClick(row) { |
| | |
| | | margin-right: 20px; |
| | | } |
| | | } |
| | | .sel-name { |
| | | color: $color-primary; |
| | | cursor: pointer; |
| | | } |
| | | .btn-pager { |
| | | display: flex; |
| | | .page { |