czg_team/management
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

商品列表新增绑定耗材

Browse Source
This commit is contained in:
gyq
2024-09-24 13:47:09 +08:00
parent 673afeb5f3
commit 5c47408c96
7 changed files with 621 additions and 577 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
src/views/product/index.vue
View File

@@ -32,13 +32,15 @@
</el-row>
</div>
<div class="head-container" id="table_drag">
<el-table ref="table" :data="tableData.data" v-loading="tableData.loading" row-key="id">
<el-table-column prop="id" label="ID" width="50px"></el-table-column>
<el-table ref="table" :data="tableData.data" v-loading="tableData.loading" row-key="id"
:tree-props="{ children: 'skuList', hasChildren: 'hasChildren' }">
<el-table-column width="50px"></el-table-column>
<el-table-column label="商品信息">
<template v-slot="scope">
<div class="shop_info">
<el-image :src="scope.row.coverImg"
style="width: 50px;height: 50px;border-radius: 4px;background-color: #efefef;">
style="width: 50px;height: 50px;border-radius: 4px;background-color: #efefef;"
v-if="scope.row.coverImg">
<div class="img_error" slot="error">
<i class="icon el-icon-document-delete"></i>
</div>
@@ -51,52 +53,66 @@
</el-table-column>
<el-table-column label="售价">
<template v-slot="scope">
<span>￥{{ scope.row.lowPrice }}</span>
<span v-if="scope.row.typeEnum == '多规格'">~￥{{ scope.row.maxPrice }}</span>
<el-button type="text" v-if="scope.row.typeEnum == '多规格' && scope.row.skuList.length">
{{ scope.row.lowPrice }}
</el-button>
<el-button type="text" v-else @click="changePrice('salePrice', scope.row,)">
￥{{ scope.row.lowPrice }}
<i class="el-icon-edit"></i>
</el-button>
</template>
</el-table-column>
<el-table-column label="商品规格" prop="typeEnum">
</el-table-column>
<el-table-column label="商品规格" prop="typeEnum"></el-table-column>
<el-table-column label="库存">
<template v-slot="scope">
<span>{{ scope.row.stockNumber }}</span>
<el-button type="text" v-if="scope.row.typeEnum" @click="changePrice('stockNumber', scope.row,)">
{{ scope.row.stockNumber }}
<i class="el-icon-edit"></i>
</el-button>
</template>
</el-table-column>
<el-table-column label="耗材信息">
<template v-slot="scope">
<div v-if="scope.row.conInfos.length">{{ scope.row.conInfos.join(',') }}</div>
<el-button type="text" icon="el-icon-edit" v-else>绑定</el-button>
<div v-if="scope.row.conInfos && scope.row.conInfos.length">
<span v-for="item in scope.row.conInfos" :key="item.id">{{ item.conName }}、</span>
</div>
<el-button type="text" @click="showBindCons(scope.row)">
绑定
<i class="el-icon-edit"></i>
</el-button>
</template>
</el-table-column>
<el-table-column label="上架区域">
<el-table-column label="上架">
<template v-slot="scope">
<!-- <el-button type="text" icon="el-icon-edit" v-if="scope.row.isShowCash">收银端</el-button>
<el-button type="text" icon="el-icon-edit" v-if="scope.row.isShowMall">小程序</el-button>
<el-button type="text" icon="el-icon-edit"
v-if="!scope.row.isShowCash && !scope.row.isShowMall">未上架</el-button> -->
<el-switch v-model="scope.row.isGrounding" :active-value="1" :inactive-value="0"
@change="changeHot($event, scope.row)"></el-switch>
@change="changeGrounding($event, scope.row)"></el-switch>
</template>
</el-table-column>
<el-table-column label="排序" prop="sort" sortable />
<el-table-column label="更新时间" prop="createdAt">
<el-table-column label="更新时间" prop="createdAt" width="150">
<template v-slot="scope">
{{ dayjs(scope.row.createdAt).format('YYYY-MM-DD HH:mm:ss') }}
</template>
</el-table-column>
<el-table-column label="设为热门" prop="createdAt">
<!-- <el-table-column label="设为热门" prop="createdAt">
<template v-slot="scope">
<el-switch v-model="scope.row.isHot" :active-value="1" :inactive-value="0"
@change="changeHot($event, scope.row)"></el-switch>
</template>
</el-table-column>
<el-table-column label="操作" width="200">
</el-table-column> -->
<el-table-column label="操作" width="150">
<template v-slot="scope">
<el-button type="text" icon="el-icon-rank" v-if="isPcBowser">排序</el-button>
<router-link :to="{ path: '/product/add_shop', query: { goods_id: scope.row.id } }"
<!-- <el-button type="text" icon="el-icon-rank" v-if="isPcBowser">排序</el-button> -->
<!-- <router-link :to="{ path: '/product/add_shop', query: { goods_id: scope.row.id } }"
style="margin-left: 20px !important;">
<el-button type="text" icon="el-icon-edit">编辑</el-button>
</router-link> -->
<router-link :to="{ path: '/product/add_shop', query: { goods_id: scope.row.id } }">
<el-button type="text" icon="el-icon-edit">编辑</el-button>
</router-link>
<el-popconfirm title="确定删除吗？" @confirm="delTableHandle([scope.row.id])">
<el-button type="text" icon="el-icon-delete" style="margin-left: 20px !important;"
@@ -111,6 +127,20 @@
:page-size="tableData.size" @current-change="paginationChange"
layout="total, sizes, prev, pager, next, jumper"></el-pagination>
</div>
<!-- 绑定耗材 -->
<BindCons ref="bindCons" />
<!-- 编辑售价、库存 -->
<el-dialog :title="editorEumn[editorForm.key]" :visible.sync="editorVisable" :show-close="false" width="300px">
<el-form :model="editorForm">
<el-form-item>
<el-input-number v-model="editorForm.value" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="editorVisable = false">取 消</el-button>
<el-button type="primary" :loading="editorFormLoading" @click="editorConfirmChange">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
@@ -118,8 +148,12 @@
import Sortable from 'sortablejs'
import dayjs from 'dayjs'
import settings from '@/settings'
import { tbProductListV2, tbShopCategoryGet, tbProductDelete, tbProductIsHot, upProSort } from '@/api/shop'
import BindCons from './components/bindCons.vue'
import { tbProductListV2, tbShopCategoryGet, tbProductDelete, tbProductIsHot, upProSort, updateProductData } from '@/api/shop'
export default {
components: {
BindCons
},
data() {
return {
dayjs,
@@ -137,6 +171,21 @@ export default {
size: 30,
loading: false,
total: 0
},
editorEumn: {
grounding: '上下架',
pauseSale: '商品',
stockNumber: '库存数量',
salePrice: '售价'
},
editorVisable: false,
editorFormLoading: false,
editorForm: {
shopId: localStorage.getItem('shopId'),
isSku: '',
id: '',
key: '',
value: ''
}
}
},
@@ -156,6 +205,53 @@ export default {
}
},
methods: {
changeGrounding(event, row) {
this.editorForm.key = 'grounding'
this.editorForm.id = row.id
this.editorForm.isSku = !row.typeEnum
this.editorForm.value = event
this.editorConfirmChange()
},
// 确认修改
async editorConfirmChange() {
try {
this.editorFormLoading = true
const res = await updateProductData([this.editorForm])
this.editorFormLoading = false
this.$message.success('修改成功')
this.editorVisable = false
this.getTableData()
} catch (error) {
console.log(error);
this.editorFormLoading = false
}
},
// 修改售价
changePrice(type, row) {
this.editorVisable = true
this.editorForm.key = type
this.editorForm.id = row.id
this.editorForm.isSku = !row.typeEnum
switch (type) {
case 'salePrice':
// 修改售价
this.editorForm.value = row.lowPrice
break;
case 'stockNumber':
// 修改库存
this.editorForm.value = row.stockNumber
break;
default:
break;
}
},
// 显示绑定耗材
showBindCons(item) {
// console.log(item);
this.$refs.bindCons.show(item)
},
// 选择分类
queryHandle() {
localStorage.setItem('shopIndexQuery', JSON.stringify(this.query))