From 089bf5d2378b3c4a61d795b2a92bede2c193b771 Mon Sep 17 00:00:00 2001
From: admin <344137771@qq.com>
Date: Tue, 06 Jan 2026 11:22:58 +0800
Subject: [PATCH] 1
---
src/components/prods-select/index.vue | 188 +++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 188 insertions(+), 0 deletions(-)
diff --git a/src/components/prods-select/index.vue b/src/components/prods-select/index.vue
new file mode 100644
index 0000000..644c914
--- /dev/null
+++ b/src/components/prods-select/index.vue
@@ -0,0 +1,188 @@
+<template>
+ <el-dialog title="选择商品"
+ :modal="false"
+ :close-on-click-modal="false"
+ :visible.sync="visible">
+ <el-table ref="prodTable"
+ :data="dataList"
+ border
+ v-loading="dataListLoading"
+ @selection-change="selectChangeHandle"
+ style="width: 100%;"
+ >
+ <el-table-column v-if="isSingle" width="50"
+ header-align="center"
+ align="center">
+ <template slot-scope="scope">
+ <div>
+ <el-radio :label="scope.row.prodId"
+ v-model="singleSelectProdId"
+ @change.native="getSelectProdRow(scope.row)"> </el-radio>
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column v-if="!isSingle"
+ type="selection"
+ header-align="center"
+ align="center"
+ width="50">
+ </el-table-column>
+ <el-table-column prop="prodName"
+ header-align="center"
+ align="center"
+ label="产品名称">
+ </el-table-column>
+ <el-table-column align="center"
+ width="140"
+ label="产品图片">
+ <template slot-scope="scope">
+ <img :src="scope.row.pic"
+ width="100"
+ height="100" />
+ </template>
+ </el-table-column>
+ </el-table>
+ <el-pagination @size-change="sizeChangeHandle"
+ @current-change="currentChangeHandle"
+ :current-page="pageIndex"
+ :page-sizes="[10, 20, 50, 100]"
+ :page-size="pageSize"
+ :total="totalPage"
+ layout="total, sizes, prev, pager, next, jumper">
+ </el-pagination>
+ <span slot="footer">
+ <el-button @click="visible = false">取消</el-button>
+ <el-button type="primary"
+ @click="submitProds()">确定</el-button>
+ </span>
+ </el-dialog>
+</template>
+
+<script>
+export default {
+ data () {
+ return {
+ visible: false,
+ dataForm: {
+ product: ''
+ },
+ singleSelectProdId: 0,
+ allData: [],
+ selectProds: [],
+ dataList: [],
+ pageIndex: 1,
+ pageSize: 10,
+ totalPage: 0,
+ dataListLoading: false,
+ dataListSelections: [],
+ addOrUpdateVisible: false
+ }
+ },
+ props: {
+ isSingle: {
+ default: false,
+ type: Boolean
+ }
+ },
+ activated () {
+ this.getDataList()
+ },
+ methods: {
+ // 获取数据列表
+ init (selectProds) {
+ this.selectProds = selectProds
+ this.visible = true
+ this.dataListLoading = true
+ if (this.selectProds) {
+ this.selectProds.forEach(row => {
+ this.dataListSelections.push(row)
+ })
+ }
+ this.getDataList()
+ },
+ getDataList () {
+ this.$http({
+ url: this.$http.adornUrl('/prod/prod/page'),
+ method: 'get',
+ params: this.$http.adornParams(
+ Object.assign(
+ {
+ current: this.pageIndex,
+ size: this.pageSize
+ },
+ {
+ prodName: this.dataForm.prodName
+ }
+ )
+ )
+ }).then(({ data }) => {
+ this.dataList = data.records
+ this.totalPage = data.total
+ this.dataListLoading = false
+ if (this.selectProds) {
+ this.$nextTick(() => {
+ this.selectProds.forEach(row => {
+ let index = this.dataList.findIndex((prodItem) => prodItem.prodId === row.prodId)
+ this.$refs.prodTable.toggleRowSelection(this.dataList[index])
+ })
+ })
+ }
+ })
+ },
+ // 每页数
+ sizeChangeHandle (val) {
+ this.pageSize = val
+ this.pageIndex = 1
+ this.getDataList()
+ },
+ // 当前页
+ currentChangeHandle (val) {
+ this.pageIndex = val
+ this.getDataList()
+ },
+ // 单选商品事件
+ getSelectProdRow (row) {
+ this.dataListSelections = [row]
+ },
+ // 多选点击事件
+ selectChangeHandle (selection) {
+ this.dataList.forEach((tableItem) => {
+ let selectedProdIndex = selection.findIndex((selectedProd) => {
+ if (!selectedProd) {
+ return false
+ }
+ return selectedProd.prodId === tableItem.prodId
+ })
+ let dataSelectedProdIndex = this.dataListSelections.findIndex((dataSelectedProd) => dataSelectedProd.prodId === tableItem.prodId)
+ if (selectedProdIndex > -1 && dataSelectedProdIndex === -1) {
+ this.dataListSelections.push(tableItem)
+ } else if (selectedProdIndex === -1 && dataSelectedProdIndex > -1) {
+ this.dataListSelections.splice(dataSelectedProdIndex, 1)
+ }
+ })
+ },
+ // 确定事件
+ submitProds () {
+ if (!this.dataListSelections.length) {
+ this.$message({
+ message: '请选择商品',
+ type: 'error',
+ duration: 1000,
+ onClose: () => {}
+ })
+ return
+ }
+ let prods = []
+ this.dataListSelections.forEach(item => {
+ let prodIndex = prods.findIndex((prod) => prod.prodId === item.prodId)
+ if (prodIndex === -1) {
+ prods.push({ prodId: item.prodId, prodName: item.prodName, pic: item.pic })
+ }
+ })
+ this.$emit('refreshSelectProds', prods)
+ this.dataListSelections = []
+ this.visible = false
+ }
+ }
+}
+</script>
--
Gitblit v1.9.3