提交 aa2028b1 authored 作者: 刘旭's avatar 刘旭

重构需求

上级 5986ea5a
...@@ -19,7 +19,8 @@ ...@@ -19,7 +19,8 @@
"lodash": "^4.17.21", "lodash": "^4.17.21",
"node-sass": "^7.0.1", "node-sass": "^7.0.1",
"pinia": "^2.0.21", "pinia": "^2.0.21",
"vue": "^3.2.37", "vue": "^3.2.45",
"vue-draggable-next": "^2.1.1",
"vue-i18n": "^9.1.9", "vue-i18n": "^9.1.9",
"vuex": "^4.0.2" "vuex": "^4.0.2"
}, },
......
...@@ -377,6 +377,10 @@ export default { ...@@ -377,6 +377,10 @@ export default {
defaultSelect: { defaultSelect: {
Type: Object, Type: Object,
}, },
// 默认选中不全的SKU
defaultNotAllSelect: {
Type: Object,
},
// 是否使用缓存 // 是否使用缓存
useCache: { useCache: {
Type: Boolean, Type: Boolean,
...@@ -614,6 +618,7 @@ export default { ...@@ -614,6 +618,7 @@ export default {
); );
Object.assign(that.selectShop, select_sku_info); Object.assign(that.selectShop, select_sku_info);
that.defaultSelectSku(); that.defaultSelectSku();
that.notAllSelected()
that.complete = true; that.complete = true;
}, },
async open() { async open() {
...@@ -670,7 +675,7 @@ export default { ...@@ -670,7 +675,7 @@ export default {
that.updateGoodsInfo(goodsInfo); that.updateGoodsInfo(goodsInfo);
that.updateValue(true); that.updateValue(true);
} else { } else {
console.log(goodsInfo, 'goodsInfo111'); // console.log(goodsInfo, 'goodsInfo111');
that.toast('未获取到商品信息', 'none'); that.toast('未获取到商品信息', 'none');
that.$emit('input', false); that.$emit('input', false);
return false; return false;
...@@ -973,10 +978,46 @@ export default { ...@@ -973,10 +978,46 @@ export default {
let color = that[name] ? that[name] : themeColor[theme][name]; let color = that[name] ? that[name] : themeColor[theme][name];
return color; return color;
}, },
// 选中不全的规格
notAllSelected() {
let that = this
let { defaultNotAllSelect } = that
if (defaultNotAllSelect && defaultNotAllSelect.sku && defaultNotAllSelect.sku.length > 0) {
that.selectNotAllSku(defaultNotAllSelect);
}
},
selectNotAllSku(obj = {}) {
let that = this;
let { sku: skuArr, num: selectNum } = obj;
let specListArr = that.goodsInfo[that.specListName];
if (skuArr && specListArr.length === skuArr.length) {
// 先清空
let skuClickArr = [];
for (let index = 0; index < skuArr.length; index++) {
let skuName = skuArr[index];
let specList = specListArr[index].list;
let index1 = index;
let index2 = that.getListIndex(specList, 'name', skuName);
if (index2 != -1) {
skuClickArr.push({
spec: specList[index2],
index1: index1,
index2: index2,
});
}
}
if (skuClickArr.length != 0) {
that.init(true);
skuClickArr.map(item => {
that.skuClick(item.spec, item.index1, item.index2);
});
}
}
if (selectNum > 0) that.selectNum = selectNum;
},
defaultSelectSku() { defaultSelectSku() {
let that = this; let that = this;
let { defaultSelect } = that; let { defaultSelect } = that;
// console.log(defaultSelect, 'defaultSelect');
if (defaultSelect && defaultSelect.sku && defaultSelect.sku.length > 0) { if (defaultSelect && defaultSelect.sku && defaultSelect.sku.length > 0) {
that.selectSku(defaultSelect); that.selectSku(defaultSelect);
} }
...@@ -997,6 +1038,7 @@ export default { ...@@ -997,6 +1038,7 @@ export default {
let skuClickArr = []; let skuClickArr = [];
let clickKey = true; let clickKey = true;
for (let index = 0; index < skuArr.length; index++) { for (let index = 0; index < skuArr.length; index++) {
// console.log(skuArr.length[index]);
let skuName = skuArr[index]; let skuName = skuArr[index];
let specList = specListArr[index].list; let specList = specListArr[index].list;
let index1 = index; let index1 = index;
......
{ {
"easycom": { "easycom": {
"autoscan": true, "autoscan": true,
"custom": { "custom": {
"^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue" "^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue"
} }
}, },
"pages": [ "pages": [
{
{ "path": "pages/index/index",
"path": "pages/index/index", "style": {
"style": { "navigationBarTitleText": "深圳市永信达科技有限公司"
"navigationBarTitleText": "深圳市永信达科技有限公司" }
} },
}, { {
"path": "pages/category/index", "path": "pages/category/index",
"style": { "style": {
"navigationBarTitleText": "分类", "navigationBarTitleText": "分类",
"onReachBottomDistance": 55 "onReachBottomDistance": 55
} }
}, { },
"path": "pages/message/index", {
"style": { "path": "pages/message/index",
"navigationBarTitleText": "消息" "style": {
} "navigationBarTitleText": "消息"
}, { }
"path": "pages/message/chat", },
"style": { {
"navigationBarTitleText": "聊天窗口" "path": "pages/message/chat",
} "style": {
}, { "navigationBarTitleText": "聊天窗口"
"path": "pages/productLine/productLine", }
"style": { },
"navigationBarTitleText": "产品线", {
"navigationStyle": "custom" "path": "pages/productLine1/index",
} "style": {
}, { "navigationBarTitleText": "产品线1",
"path": "pages/productLine/importProductLine", "navigationStyle": "custom"
"style": { }
"navigationBarTitleText": "导入产品线" },
} {
}, { "path": "pages/cart/index",
"path": "pages/cart/index", "style": {
"style": { "navigationBarTitleText": "购物车",
"navigationBarTitleText": "购物车", "navigationStyle": "custom"
"navigationStyle": "custom" }
} },
}, { {
"path": "pages/goods/index", "path": "pages/goods/index",
"style": { "style": {
"navigationBarTitleText": "商品详情" "navigationBarTitleText": "商品详情"
} }
}, { },
"path": "pages/profile/index", {
"style": { "path": "pages/profile/index",
"navigationBarTitleText": "我的" "style": {
} "navigationBarTitleText": "我的"
}, { }
"path": "pages/login/login", },
"style": { {
"navigationBarTitleText": "登录" "path": "pages/login/login",
} "style": {
}, { "navigationBarTitleText": "登录"
"path": "pages/category/items", }
"style": { },
"navigationBarTitleText": "", {
"navigationBarBackgroundColor": "#fff", "path": "pages/category/items",
"onReachBottomDistance": 55 "style": {
} "navigationBarTitleText": "",
}, { "navigationBarBackgroundColor": "#fff",
"path": "pages/order/checkout", "onReachBottomDistance": 55
"style": { }
"navigationBarTitleText": "", },
"navigationBarBackgroundColor": "#fff" {
} "path": "pages/order/checkout",
}, { "style": {
"path": "pages/profile/address", "navigationBarTitleText": "",
"style": { "navigationBarBackgroundColor": "#fff"
"navigationBarTitleText": "用户地址", }
"navigationBarBackgroundColor": "#fff" },
} {
}, { "path": "pages/profile/address",
"path": "pages/profile/addSite", "style": {
"style": { "navigationBarTitleText": "用户地址",
"navigationBarTitleText": "设置用户地址", "navigationBarBackgroundColor": "#fff"
"navigationBarBackgroundColor": "#fff" }
} },
}, { {
"path": "pages/category/new", "path": "pages/profile/addSite",
"style": { "style": {
"navigationBarTitleText": "新品首发", "navigationBarTitleText": "设置用户地址",
"navigationBarBackgroundColor": "#fff", "navigationBarBackgroundColor": "#fff"
"onReachBottomDistance": 55 }
} },
}, { {
"path": "pages/category/hot", "path": "pages/category/new",
"style": { "style": {
"navigationBarTitleText": "人气推荐", "navigationBarTitleText": "新品首发",
"navigationBarBackgroundColor": "#fff", "navigationBarBackgroundColor": "#fff",
"onReachBottomDistance": 55 "onReachBottomDistance": 55
} }
}, { },
"path": "pages/category/topicList", {
"style": { "path": "pages/category/hot",
"navigationBarTitleText": "专题精选", "style": {
"navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "人气推荐",
"onReachBottomDistance": 55 "navigationBarBackgroundColor": "#fff",
} "onReachBottomDistance": 55
}, { }
"path": "pages/category/topic", },
"style": { {
"navigationBarTitleText": "精选详情", "path": "pages/category/topicList",
"navigationBarBackgroundColor": "#fff" "style": {
} "navigationBarTitleText": "专题精选",
}, { "navigationBarBackgroundColor": "#fff",
"path": "pages/index/search", "onReachBottomDistance": 55
"style": { }
"navigationStyle": "custom" },
} {
}, { "path": "pages/category/topic",
"path": "pages/order/orderList", "style": {
"style": { "navigationBarTitleText": "精选详情",
"navigationBarTitleText": "订单", "navigationBarBackgroundColor": "#fff"
"navigationBarBackgroundColor": "#fff" }
} },
}, { {
"path": "pages/profile/collection", "path": "pages/index/search",
"style": { "style": {
"navigationBarTitleText": "我的收藏", "navigationStyle": "custom"
"navigationBarBackgroundColor": "#fff", }
"onReachBottomDistance": 55 },
} {
}, { "path": "pages/order/orderList",
"path": "pages/profile/setting", "style": {
"style": { "navigationBarTitleText": "订单",
"navigationBarTitleText": "", "navigationBarBackgroundColor": "#fff"
"navigationBarBackgroundColor": "#fff" }
} },
}, { {
"path": "pages/order/downPdf", "path": "pages/profile/collection",
"style": { "style": {
"navigationBarTitleText": "订单详情", "navigationBarTitleText": "我的收藏",
"navigationBarBackgroundColor": "#fff" "navigationBarBackgroundColor": "#fff",
} "onReachBottomDistance": 55
}, { }
"path": "pages/order/quotation", },
"style": { {
"navigationBarTitleText": "填写报价单", "path": "pages/profile/setting",
"navigationBarBackgroundColor": "#fff" "style": {
} "navigationBarTitleText": "",
}, { "navigationBarBackgroundColor": "#fff"
"path": "pages/profile/consignee", }
"style": { },
"navigationBarTitleText": "客户", {
"navigationBarBackgroundColor": "#fff" "path": "pages/order/downPdf",
} "style": {
}, { "navigationBarTitleText": "订单详情",
"path": "pages/profile/addConsignee", "navigationBarBackgroundColor": "#fff"
"style": { }
"navigationBarTitleText": "添加客户", },
"navigationBarBackgroundColor": "#fff" {
} "path": "pages/order/quotation",
}, { "style": {
"path": "pages/order/editQuotation", "navigationBarTitleText": "填写报价单",
"style": { "navigationBarBackgroundColor": "#fff"
"navigationBarTitleText": "重新报价", }
"navigationBarBackgroundColor": "#fff" },
} {
}, { "path": "pages/profile/consignee",
"path": "pages/productLine/productLineDetails", "style": {
"style": { "navigationBarTitleText": "客户",
"navigationBarTitleText": "产品线详情", "navigationBarBackgroundColor": "#fff"
"navigationBarBackgroundColor": "#fff" }
} },
}, { {
"path": "pages/profile/about", "path": "pages/profile/addConsignee",
"style": { "style": {
"navigationBarTitleText": "关于", "navigationBarTitleText": "添加客户",
"navigationBarBackgroundColor": "#fff" "navigationBarBackgroundColor": "#fff"
} }
} },
], {
"tabBar": { "path": "pages/order/editQuotation",
"selectedColor": "#333", "style": {
"color": "#707070", "navigationBarTitleText": "重新报价",
"backgroundColor": "#fff", "navigationBarBackgroundColor": "#fff"
"borderStyle": "white", }
"height": "50px", },
"list": [{ {
"pagePath": "pages/index/index", "path": "pages/productLine/productLineDetails",
"iconPath": "/static/tabbar/home.png", "style": {
"selectedIconPath": "/static/tabbar/home_fill.png", "navigationBarTitleText": "产品线详情",
"text": "首页" "navigationBarBackgroundColor": "#fff"
}, }
{ },
"pagePath": "pages/category/index", {
"iconPath": "/static/tabbar/category.png", "path": "pages/profile/about",
"selectedIconPath": "/static/tabbar/category_fill.png", "style": {
"text": "分类" "navigationBarTitleText": "关于",
}, "navigationBarBackgroundColor": "#fff"
{ }
"pagePath": "pages/productLine/productLine", }
"iconPath": "/static/tabbar/message.png", ],
"selectedIconPath": "/static/tabbar/message_fill.png", "tabBar": {
"text": "产品线" "selectedColor": "#333",
}, "color": "#707070",
{ "backgroundColor": "#fff",
"pagePath": "pages/cart/index", "borderStyle": "white",
"iconPath": "/static/tabbar/cart.png", "height": "50px",
"selectedIconPath": "/static/tabbar/cart_fill.png", "list": [
"text": "购物车" {
}, "pagePath": "pages/index/index",
{ "iconPath": "/static/tabbar/home.png",
"pagePath": "pages/profile/index", "selectedIconPath": "/static/tabbar/home_fill.png",
"iconPath": "/static/tabbar/profile.png", "text": "首页"
"selectedIconPath": "/static/tabbar/profile_fill.png", },
"text": "我的" {
} "pagePath": "pages/category/index",
] "iconPath": "/static/tabbar/category.png",
}, "selectedIconPath": "/static/tabbar/category_fill.png",
"globalStyle": { "text": "分类"
"navigationBarTextStyle": "black", },
"navigationBarTitleText": "uni-app", {
"navigationBarBackgroundColor": "#F8F8F8", "pagePath": "pages/productLine1/index",
"backgroundColor": "#F8F8F8" "iconPath": "/static/tabbar/message.png",
} "selectedIconPath": "/static/tabbar/message_fill.png",
"text": "产品线"
},
{
"pagePath": "pages/cart/index",
"iconPath": "/static/tabbar/cart.png",
"selectedIconPath": "/static/tabbar/cart_fill.png",
"text": "购物车"
},
{
"pagePath": "pages/profile/index",
"iconPath": "/static/tabbar/profile.png",
"selectedIconPath": "/static/tabbar/profile_fill.png",
"text": "我的"
}
]
},
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
}
} }
...@@ -279,7 +279,7 @@ let togoods = (data: any) => { ...@@ -279,7 +279,7 @@ let togoods = (data: any) => {
}); });
else else
uni.reLaunch({ uni.reLaunch({
url: '../productLine/productLine?id=' + data.goodsId + '&cartId=' + data.id, url: '../productLine1/index?id=' + data.goodsId + '&cartId=' + data.id,
}); });
}; };
......
...@@ -2,10 +2,10 @@ ...@@ -2,10 +2,10 @@
<template> <template>
<view class="app"> <view class="app">
<vk-data-goods-sku-popup v-if="flag" ref="skuPopupRef" v-model="skuKey" border-radius="20" <vk-data-goods-sku-popup v-if="flag" ref="skuPopupRef" v-model="skuKey" border-radius="20"
:localdata="goodsInfo" :mode="skuMode" :defaultSelect="defaultSelect" @open="onOpenSkuPopup" :localdata="goodsInfo" :mode="skuMode" :defaultSelect="defaultSelect"
@close="SkuPopup" @add-cart="addCarts" @buy-now="buyNow" @change="onChange" @num-change="numChange" :defaultNotAllSelect="defaultNotAllSelect" @open="onOpenSkuPopup" @close="SkuPopup" @add-cart="addCarts"
@add-product="addProduct" @plus="onPlus" @confirm="onConfirm" @blur="onBlur" @select-parts="selectParts" @buy-now="buyNow" @change="onChange" @num-change="numChange" @add-product="addProduct" @plus="onPlus"
@selectAll="selectAll"> @confirm="onConfirm" @blur="onBlur" @select-parts="selectParts" @selectAll="selectAll">
</vk-data-goods-sku-popup> </vk-data-goods-sku-popup>
</view> </view>
</template> </template>
...@@ -37,7 +37,8 @@ let props = defineProps({ ...@@ -37,7 +37,8 @@ let props = defineProps({
} }
}) })
let flag = ref(true) let flag = ref(true)
let defaultSelect = ref() let defaultSelect = ref() //默认选中规格
let defaultNotAllSelect = ref() // 默认选中但不全的规格
let goodsInfoCopy = ref() // 规格全选后避免丢失所填的自定义规格 let goodsInfoCopy = ref() // 规格全选后避免丢失所填的自定义规格
watch([selectedGoodsItem, selectedGoodsSum], (newVal) => { watch([selectedGoodsItem, selectedGoodsSum], (newVal) => {
...@@ -96,6 +97,7 @@ let selectAll = (data: any) => { ...@@ -96,6 +97,7 @@ let selectAll = (data: any) => {
}) })
if (arr.length === 1) { if (arr.length === 1) {
skuKey.value = false skuKey.value = false
defaultNotAllSelect.value = {}
defaultSelect.value = { sku: goodsInfo.value.sku_list[arr[0]].sku_name_arr, num: 1 } defaultSelect.value = { sku: goodsInfo.value.sku_list[arr[0]].sku_name_arr, num: 1 }
setTimeout(() => skuKey.value = true); setTimeout(() => skuKey.value = true);
} }
...@@ -328,7 +330,6 @@ const addProduct = (selectShop: any) => { ...@@ -328,7 +330,6 @@ const addProduct = (selectShop: any) => {
detailId.value = undefined detailId.value = undefined
} }
// 获取分组id // 获取分组id
const getProductId = (specText: any) => { const getProductId = (specText: any) => {
let productId; let productId;
...@@ -355,6 +356,7 @@ const handleClose = () => { ...@@ -355,6 +356,7 @@ const handleClose = () => {
specStore.$reset() specStore.$reset()
emits('selected', '') emits('selected', '')
defaultSelect.value = {} defaultSelect.value = {}
defaultNotAllSelect.value = {}
goodsInfo.value = {} goodsInfo.value = {}
skuPopupRef.value.init() skuPopupRef.value.init()
} }
...@@ -374,6 +376,7 @@ defineExpose({ ...@@ -374,6 +376,7 @@ defineExpose({
partsIds, partsIds,
goodsInfoCopy, goodsInfoCopy,
defaultSelect, defaultSelect,
defaultNotAllSelect,
init, init,
handleClose, handleClose,
onPlus onPlus
......
<template>
<u-popup v-model="show" mode="bottom" length="90%" :mask-close-able="false" closeable @close="handleClose">
<!-- 搜索 -->
<view style="width: 90%; height: 50px; position: fixed; top: 0; z-index: 1; background-color: #fff;">
<uni-search-bar placeholder="输入搜索商品" bgColor="#EEEEEE" clearButton="auto" cancelButton="none"
@confirm="search" />
</view>
<view class="content">
<view class="right-cates">
<u-tabs name="name" :list="categoryList" v-model="current" @change="tabsChange"></u-tabs>
<goodsItem v-for="item in currentSubCategoryData" :src="item.picUrl" :name="item.name"
:brief="item.brief" :counterPrice="item.counterPrice" :retailPrice="item.retailPrice"
@tap="cateGoryGoods(item)" />
<view style="padding: 20rpx;">
<u-loadmore :status="status" icon-type="flower" :load-text="loadText" @loadmore="loadmore" />
</view>
</view>
</view>
</u-popup>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { getCatalogIndex, getGoodsList } from '@/api/category';
import goodsItem from '@/components/goodsItem.vue';
// 选择tabs的下标
let current = ref(0);
// tabs下的商品数据
let currentSubCategoryData = ref([] as any);
// tabs数据
let categoryList = ref([] as any);
// 查询参数
const listQuery = ref({
categoryId: 0,
page: 1,
limit: 10,
});
// 自定义加载状态
let loadText = ref({
loadmore: '点击加载更多',
loading: '努力加载中',
nomore: '实在没有了',
});
let status = ref('loadmore');
let total = ref(0);
let props = defineProps({
show: {
type: Boolean,
default: false,
},
});
let emits = defineEmits(['close', 'categoryData']);
const search = (val: any) => {
uni.navigateTo({ url: '../index/search?keyword=' + val.value });
};
// 开始添加产品线产品
let cateGoryGoods = (data: any) => {
emits('categoryData', data);
handleClose();
};
// 监听tabs
let tabsChange = (e: any) => {
currentSubCategoryData.value = [];
current.value = e;
listQuery.value.categoryId = categoryList.value[e].id;
initGoodsList(listQuery.value);
};
// 点击加载数据
let loadmore = () => {
// 判断是否还有下一页数据
if (listQuery.value.page * listQuery.value.limit >= total.value)
return (status.value = 'nomore');
// // 判断是否正在请求其它数据,如果是,则不发起额外的请求
if (status.value === 'loading') return;
listQuery.value.page += 1;
initGoodsList(listQuery.value);
console.log('点击加载');
};
// 获取商品数据
const initGoodsList = (data: any) => {
status.value = 'loading';
getGoodsList(data).then((res: any) => {
if (res.data.code === 200) {
if (res.data.data.total > 10) status.value = 'loadmore';
else status.value = 'nomore';
total.value = res.data.data.total;
currentSubCategoryData.value = [...currentSubCategoryData.value, ...res.data.data.list];
}
});
};
let initIndex = () => {
getCatalogIndex().then((res: any) => {
if (res.data.code === 200) {
categoryList.value = res.data.data.categoryList;
if (listQuery.value.categoryId === 0)
listQuery.value.categoryId = categoryList.value[0].id;
initGoodsList(listQuery.value);
}
});
};
let handleClose = () => {
emits('close', false);
};
defineExpose({
initIndex,
});
</script>
<style lang="scss" scoped>
.content {
margin-top: 13%;
.right-cates {
width: 100%;
height: 100%;
background-color: #fff;
}
}
</style>
...@@ -5,11 +5,7 @@ ...@@ -5,11 +5,7 @@
<view class="right-cates"> <view class="right-cates">
<view class="right-cates-list"> <view class="right-cates-list">
<u-cell-group> <u-cell-group>
<u-cell-item icon="" :title="item.goodsName" :arrow="false" <u-cell-item icon="" :title="item.goodsName" :arrow="false" v-for="item in lineList">
v-for="(item, index) in lineList">
<!-- <template #title>
{{ item.goodsName }}
</template> -->
<template #right-icon> <template #right-icon>
<view style="margin-left: 30rpx;"> <view style="margin-left: 30rpx;">
<u-tag v-show="item.size" :text="item.size" type="info" size="mini" <u-tag v-show="item.size" :text="item.size" type="info" size="mini"
...@@ -18,7 +14,6 @@ ...@@ -18,7 +14,6 @@
style="margin-right: 10rpx;" /> style="margin-right: 10rpx;" />
<u-tag v-show="item.Segs" :text="item.Segs" type="info" size="mini" /> <u-tag v-show="item.Segs" :text="item.Segs" type="info" size="mini" />
</view> </view>
</template> </template>
</u-cell-item> </u-cell-item>
</u-cell-group> </u-cell-group>
...@@ -98,6 +93,7 @@ onReady(() => { ...@@ -98,6 +93,7 @@ onReady(() => {
lineList.value = [] lineList.value = []
setTitleRef.value.title = '' setTitleRef.value.title = ''
uni.$on('importProductLineData', (res: any) => { uni.$on('importProductLineData', (res: any) => {
console.log(res.data, 'res.data');
if (res.data.lineId) { if (res.data.lineId) {
if (res.data.userHasCollect === 1) { if (res.data.userHasCollect === 1) {
collectData.value = { collectData.value = {
...@@ -150,6 +146,7 @@ let matchSpecifications = () => { ...@@ -150,6 +146,7 @@ let matchSpecifications = () => {
} }
} }
}) })
console.log(lineList.value);
} }
// 处理要修改的数据 // 处理要修改的数据
......
...@@ -321,7 +321,6 @@ let sheetEdit = (index: number) => { ...@@ -321,7 +321,6 @@ let sheetEdit = (index: number) => {
if (lineId.value) { if (lineId.value) {
data.updateTime = null; data.updateTime = null;
lineEdit.value = data; lineEdit.value = data;
// console.log(lineEdit.value, 'xiugaua');
if (lineEdit.value.deleted && !lineEdit.value.isSubmit) if (lineEdit.value.deleted && !lineEdit.value.isSubmit)
return uni.showToast({ return uni.showToast({
title: '请勿修改失效商品', title: '请勿修改失效商品',
...@@ -592,6 +591,8 @@ let initCategory = (data: any) => { ...@@ -592,6 +591,8 @@ let initCategory = (data: any) => {
// 保存到产品线 // 保存到产品线
let addProduct = (data: any, productId: number, specifications: any, specificationCustom: any) => { let addProduct = (data: any, productId: number, specifications: any, specificationCustom: any) => {
let index = lineList.value.length - 1; let index = lineList.value.length - 1;
console.log(index, 'sada');
lineList.value.splice(index, 0, { lineList.value.splice(index, 0, {
name: data.goods_name, name: data.goods_name,
url: data.image, url: data.image,
...@@ -629,8 +630,6 @@ let initDetails = (id: number) => { ...@@ -629,8 +630,6 @@ let initDetails = (id: number) => {
else specStore.$reset() // 重置数据 else specStore.$reset() // 重置数据
goodsSkuRef.value.skuKey = true; goodsSkuRef.value.skuKey = true;
goodsSkuRef.value.skuMode = 5; goodsSkuRef.value.skuMode = 5;
// 设置自定义规格的
// console.log(res.data.data, '商品详情数据'); // console.log(res.data.data, '商品详情数据');
} }
}); });
......
<template>
<u-popup v-model="show" mode="bottom" length="80%" :mask-close-able="false" closeable @close="handleClose">
<view class="u-wrap">
<!-- 搜索 -->
<view style="width: 90%; height: 50px; position: fixed; top: 0; z-index: 1; background-color: #fff;">
<uni-search-bar placeholder="输入搜索商品" bgColor="#EEEEEE" clearButton="auto" cancelButton="none"
@confirm="search" />
</view>
<view class="u-menu-wrap">
<scroll-view scroll-y scroll-with-animation class="u-tab-view menu-scroll-view" :scroll-top="scrollTop">
<view v-for="(item, index) in categoryList" :key="item.id" class="u-tab-item"
:class="[current == index ? 'u-tab-item-active' : '']" :data-current="index"
@tap.stop="swichMenu(index, item.id)">
<text class="u-line-1">{{ item.name }}</text>
</view>
</scroll-view>
<view class="right-cates">
<block v-for="(item, index) in currentSubCategoryData" :key="item.id">
<view class="item-container" @tap="cateGoryGoods(item)">
<u-image width="100rpx" height="100rpx" :src="
item.picUrl.split('http').length > 1
? item.picUrl
: baseUrl + item.picUrl
"></u-image>
<view class="content">
<view class="title">
<text>{{ item.name }}</text>
<text style="color: #646566;">{{ item.brief }}</text>
</view>
</view>
</view>
</block>
</view>
</view>
</view>
</u-popup>
<search-popup ref="searchPopupRef" :show="showSearchPopup" @search-close="searchClose"
@cateGoryGoods="cateGoryGoods" />
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { getCatalogIndex, getGoodsList } from '@/api/category';
import config from '@/utils/config';
import searchPopup from './searchPopup.vue';
let baseUrl = config.baseUrl;
const scrollTop = ref(0); //tab标题的滚动条位置
const current = ref(0); // 预设当前项的值
const menuHeight = ref(0); // 左边菜单的高度
const menuItemHeight = ref(0); // 左边菜单item的高度
const categoryList = ref([] as any); //右侧tabber数据
const currentSubCategoryData = ref([] as any); //初始tabber数据
const listQuery = ref({
categoryId: 0,
page: 1,
limit: 10,
});
let status = ref('loadmore');
let total = ref(0);
let emits = defineEmits(['close', 'categoryData']);
const showSearchPopup = ref(false);
const searchPopupRef = ref();
let props = defineProps({
show: {
type: Boolean,
default: false,
},
});
const search = (val: any) => {
// if (!val.value) return;
searchPopupRef.value.searchQuery.keyword = val.value;
searchPopupRef.value.initList();
showSearchPopup.value = true;
};
const cateGoryGoods = (row: any) => {
emits('categoryData', row);
handleClose();
};
// 点击左边的栏目切换
const swichMenu = async (index: any, id: number) => {
currentSubCategoryData.value = [];
current.value = index;
listQuery.value.categoryId = categoryList.value[index].id;
initGoodsList(listQuery.value);
// 如果为0,意味着尚未初始化
if (menuHeight.value == 0 || menuItemHeight.value == 0) {
await getElRect('menu-scroll-view', 'menuHeight');
await getElRect('u-tab-item', 'menuItemHeight');
}
// 将菜单菜单活动item垂直居中
scrollTop.value =
index * menuItemHeight.value + menuItemHeight.value / 2 - menuHeight.value / 2;
};
// 获取一个目标元素的高度
const getElRect = (elClass?: any, dataVal?: any) => {
new Promise((resolve: any, reject: any) => {
const query = uni.createSelectorQuery().in(this);
query
.select('.' + elClass)
.fields({ size: true }, (res: any) => {
// 如果节点尚未生成,res值为null,循环调用执行
if (!res) {
setTimeout(() => {
getElRect(elClass);
}, 10);
return;
}
dataVal = res.height;
})
.exec();
});
};
const initIndex = () => {
getCatalogIndex().then((res: any) => {
if (res.data.code === 200) {
categoryList.value = res.data.data.categoryList;
if (listQuery.value.categoryId === 0)
listQuery.value.categoryId = categoryList.value[0].id;
initGoodsList(listQuery.value);
// console.log(categoryList.value, '分类数据');
}
});
};
const initGoodsList = (data: any) => {
status.value = 'loading';
getGoodsList(data).then((res: any) => {
if (res.data.code === 200) {
if (res.data.data.total > 10) status.value = 'loadmore';
else status.value = 'nomore';
total.value = res.data.data.total;
currentSubCategoryData.value = [...currentSubCategoryData.value, ...res.data.data.list];
}
});
};
let handleClose = () => {
emits('close', false);
};
const searchClose = () => {
showSearchPopup.value = false;
};
defineExpose({
initIndex,
currentSubCategoryData,
});
</script>
<style lang="scss" scoped>
// :deep(.uni-scroll-view-content) {
// background-color: #f6f6f6;
// }
.right-cates {
width: 100%;
height: 100%;
background-color: #fff;
padding: 0 24rpx;
.item-container {
box-sizing: border-box;
width: 100%;
height: 160rpx;
padding: 12rpx 0;
display: flex;
justify-content: flex-start;
align-items: center;
border-bottom: 1rpx solid #f5f5f5;
.content {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-left: 20rpx;
.title {
display: flex;
flex-direction: column;
}
.price {
.new-price {
font-size: 32rpx;
}
.old-price {
margin-left: 10rpx;
color: #969799;
font-size: 20rpx;
text-decoration: line-through;
}
}
}
}
}
.u-wrap {
height: calc(100vh);
/* #ifdef H5 */
height: calc(100vh - var(--window-top));
/* #endif */
display: flex;
flex-direction: column;
border-left: #f6f6f6 solid 1px;
border-right: #f6f6f6 solid 1px;
}
.u-search-box {
padding: 18rpx 30rpx;
}
.u-menu-wrap {
flex: 1;
display: flex;
overflow: hidden;
margin-top: 100rpx;
}
.u-search-inner {
background-color: rgb(234, 234, 234);
border-radius: 100rpx;
display: flex;
align-items: center;
padding: 10rpx 16rpx;
}
.u-search-text {
font-size: 26rpx;
color: $u-tips-color;
margin-left: 10rpx;
}
.u-tab-view {
width: 200rpx;
height: 100%;
}
.u-tab-item {
height: 110rpx;
background: #f6f6f6;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
font-size: 26rpx;
color: #444;
font-weight: 400;
line-height: 1;
padding-left: 20rpx;
}
.u-tab-item-active {
position: relative;
color: #000;
font-size: 30rpx;
font-weight: 600;
background: #fff;
padding-left: 20rpx;
}
.u-tab-item-active::before {
content: '';
position: absolute;
border-left: 4px solid $u-type-primary;
height: 32rpx;
left: 0;
top: 39rpx;
}
.u-tab-view {
height: 100%;
}
.right-box {
background-color: rgb(250, 250, 250);
}
.page-view {
padding: 16rpx;
}
.class-item {
margin-bottom: 30rpx;
background-color: #fff;
padding: 16rpx;
border-radius: 8rpx;
}
.item-title {
font-size: 26rpx;
color: $u-main-color;
font-weight: bold;
}
.item-menu-name {
font-weight: normal;
font-size: 24rpx;
color: $u-main-color;
}
.item-container {
display: flex;
flex-wrap: wrap;
}
.thumb-box {
width: 33.333333%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
margin-top: 20rpx;
}
.item-menu-image {
width: 120rpx;
height: 120rpx;
}
</style>
<template>
<view class="drag-and-drop-sort-B" :style="[containerSize]">
<template v-if="controlsPositionArray.length !== 0">
<view v-for="(item, index) in controlsArray" :key="index" class="_item" :style="{
background: '#fff',
transition: curretnControlsIndex === index ? 'initial' : '.3s',
'z-index': curretnControlsIndex === index ? 1 : 0,
width: controlsSize.width + 'px',
height: controlsSize.height + 'px',
top: controlsPositionArray[index].top + 'px',
left: controlsPositionArray[index].left + 'px',
}">
<view @touchstart="handleTouchstart($event, index)" @touchmove.prevent="handleTouchmove($event, index)"
@touchend="handleTouchend" @tap="handleTap(index, item)" style="width: 100%; height: 100%;">
<!-- 自定义内容 -->
<view class="item"
style="display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;"
:style="{ backgroundColor: item.show ? '#fff' : '#f5f5f5' }">
<slot :row="item" :index="index"></slot>
</view>
</view>
</view>
</template>
<!-- <u-action-sheet
:list="sheetList"
v-model="sheetShow"
:cancel-btn="false"
class="action-sheet"
@click="sheetChange"
></u-action-sheet> -->
</view>
</template>
<script>
export default {
name: 'drag-and-drop-sort',
props: {
// 容器大小
// containerSize: {
// type: Object,
// default: () => ({ wdith: '120px', height: '40px' }),
// },
// 控件的大小
controlsSize: {
type: Object,
default: () => ({ width: 0, height: 0 }),
},
// 数据列表
controlsList: {
type: Array,
default: () => [],
},
// 是否为导入方式进入
isUpload: {
type: Boolean,
default: false,
},
},
emits: ['sheet-del', 'sheet-edit', 'sheet-copy', 'height-change'],
data() {
return {
sheetShow: false,
sheetList: [
{
text: '修改规格',
},
{
text: '复制',
},
{
text: '删除',
},
],
// 控件列表
controlsArray: [],
// 每行最大存放的个数
maxWidthCount: 1,
// 控件的间距
margin: {
margin_x: 0,
margin_y: 2,
},
// 记录所有控件的初始位置
recordInitControlsPoisitonList: [],
// 控件的数据
controlsPositionArray: [],
// 记录当前手指的位置
recordPosition: {
x: 0,
y: 0,
},
// 记录当前操作的控件数据
recordControlsPositionItem: {},
// 当前操作的控件的下标
curretnControlsIndex: -1,
containerSize: {
wdith: '80px',
height: '',
},
systemInfo: undefined,
sheetIndex: 0,
};
},
mounted() {
this.init();
},
methods: {
init() {
// 获取系统信息
this.systemInfo = uni.getSystemInfoSync();
// 获取控件列表
this.controlsArray = this.controlsList;
// 初始化控件的位置
this.controlsPositionArray = this.initControlsPosition();
},
/** 初始化各个控件的位置 */
initControlsPosition() {
// 用于返回出去的新数组
let tempArray = [];
// 设置控件位置
for (let i = 0, j = 0; i < this.controlsList.length; i++, j++) {
tempArray[i] = {
left: this.margin.margin_x,
top:
j * (this.controlsSize.height + this.margin.margin_y) +
this.margin.margin_y,
};
}
// 记录数据 - 进行深拷贝
this.recordInitControlsPoisitonList = [...tempArray];
// 返回数据
// console.log(tempArray, 'tempArray');
return tempArray;
},
// 点击操作
handleTap(index, item) {
let that = this;
if (that.isUpload) return
// console.log(that.controlsArray, index);
if (index == that.controlsArray.length - 1) return;
that.controlsArray.forEach((item, i) => {
if (i !== index) item.show = false;
});
that.controlsArray[index].show = true;
// that.sheetShow = true;
that.sheetIndex = index;
uni.showActionSheet({
itemList: ['修改规格', '复制', '删除'],
success: function (res) {
that.sheetChange(res.tapIndex, item);
},
fail: function (res) {
console.log(res.errMsg);
},
});
},
// 点击选择操作
sheetChange(index, item) {
let that = this;
switch (index) {
case 0:
that.$emit('sheet-edit', that.sheetIndex);
break;
case 1:
that.$emit('sheet-copy', that.sheetIndex);
break;
case 2:
that.$emit('sheet-del', that.sheetIndex, item);
break;
}
},
/** 处理手指触摸后移动 */
handleTouchmove(event, index) {
if (this.isUpload) return
if (index == this.controlsArray.length - 1) return;
const { pageX, pageY } = event.touches[0];
// 获取移动的差
this.controlsPositionArray[this.curretnControlsIndex] = {
left:
this.controlsPositionArray[this.curretnControlsIndex].left +
(pageX - this.recordPosition.x),
top:
this.controlsPositionArray[this.curretnControlsIndex].top +
(pageY - this.recordPosition.y),
};
// 记录位置
this.recordPosition = { x: pageX, y: pageY };
// 判断当前移动的位置是否需要进行排序
if (
this.controlsPositionArray[this.curretnControlsIndex].top >=
this.recordInitControlsPoisitonList[this.recordInitControlsPoisitonList.length - 1]
.top
)
return;
if (
this.curretnControlsIndex !== this.controlsPositionArray.length - 1 &&
this.controlsPositionArray[this.curretnControlsIndex].top >
this.controlsPositionArray[this.curretnControlsIndex + 1].top
) {
// 向下移动
// 交换位置
this._handleChangeControlsPosition(0, this.curretnControlsIndex + 1);
}
// 向上移动
else if (
this.curretnControlsIndex !== 0 &&
this.controlsPositionArray[this.curretnControlsIndex].top <
this.controlsPositionArray[this.curretnControlsIndex - 1].top
) {
// 交换位置
this._handleChangeControlsPosition(0, this.curretnControlsIndex - 1);
}
},
/** 处理手指触摸开始事件 */
handleTouchstart(event, index) {
if (this.isUpload) return
if (index == this.controlsArray.length - 1) return;
const { pageX, pageY } = event.touches[0];
// 记录一些数据
this.curretnControlsIndex = index;
this.recordPosition = { x: pageX, y: pageY };
this.recordControlsPositionItem = this.controlsPositionArray[index];
},
/** 处理手指松开事件 */
handleTouchend(event) {
// 将操控的控件归位
this.controlsPositionArray[
this.curretnControlsIndex
] = this.recordInitControlsPoisitonList[this.curretnControlsIndex];
this.curretnControlsIndex = -1;
},
// 达到最后一个返回原位
handleReturn(index) {
let i = this.controlsArray.length - 2;
let arr = this.controlsArray[index];
this.controlsArray.splice(i, 1);
this.controlsArray.splice(index, 0, arr);
},
/**
* 处理交换控件位置的方法 -
* @param {number} index 需要与第几个下标交换位置
* */
_handleChangeControlsPosition(type, index) {
// 记录当前操控的控件数据
let tempControls = this.controlsArray[this.curretnControlsIndex];
// 设置原来位置的数据
this.controlsArray[this.curretnControlsIndex] = this.controlsArray[index];
// 将临时存放的数据设置好
this.controlsArray[index] = tempControls;
// 调整控件位置数据
this.controlsPositionArray[index] = this.controlsPositionArray[
this.curretnControlsIndex
];
this.controlsPositionArray[this.curretnControlsIndex] = this.recordControlsPositionItem;
// 改变当前选中的位置
this.curretnControlsIndex = index;
// 记录新位置的数据
this.recordControlsPositionItem = this.recordInitControlsPoisitonList[
this.curretnControlsIndex
];
},
},
watch: {
controlsArray: {
handler: function () {
let that = this;
this.controlsPositionArray = that.initControlsPosition();
},
deep: true,
immediate: true,
},
// 监听数组, 大于15条时,增加高度
controlsList: {
handler: function () {
let that = this;
// that.$emit('height-change');
// if (that.controlsPositionArray.length > 17) that.$emit('height-change', 28);
// else that.$emit('height-change', 40);
},
deep: true,
immediate: true,
},
},
};
</script>
<style scoped lang="scss">
$sheet-heigth: var(--window-bottom);
.drag-and-drop-sort-B {
position: relative;
._item {
position: absolute;
}
}
// .action-sheet {
// position: fixed;
// bottom: 50px;
// z-index: 99;
// overflow-y: scroll;
// -webkit-overflow-scrolling: touch;
// }
</style>
<template>
<view style="width: 100%;">
<view class="u-wrap">
<view class="u-menu-wrap">
<view class="right-cates">
<view class="right-cates-list">
<u-cell-group>
<u-cell-item icon="" :title="item.goodsName" :arrow="false" v-for="item in lineList">
<template #right-icon>
<view style="margin-left: 30rpx;">
<u-tag v-show="item.size" :text="item.size" type="info" size="mini"
style="margin-right: 10rpx;" />
<u-tag v-show="item.SDTrack" :text="item.SDTrack" type="info" size="mini"
style="margin-right: 10rpx;" />
<u-tag v-show="item.Segs" :text="item.Segs" type="info" size="mini" />
</view>
</template>
</u-cell-item>
</u-cell-group>
<view style="height: 50px;" />
</view>
</view>
</view>
<!-- 导航 -->
<uni-goods-nav class="goods-nav" :fill="true" :options="options" :buttonGroup="buttonGroup" @click="onClick"
@buttonClick="buttonClick" />
</view>
<!-- 设置标题 -->
<set-title ref="setTitleRef" />
<!-- model提示框 -->
<u-modal v-model="model.show" :content="model.content" show-cancel-button @confirm="onConfirm"></u-modal>
</view>
</template>
<script lang="ts" setup>
import { ref, nextTick } from 'vue';
import { onBackPress, onReady } from '@dcloudio/uni-app';
import {
addProductLineCart,
productLineCollect,
delProductLineCollect,
getLineSpecification,
getProductLineReAdd
} from '@/api/productLine';
import config from '@/utils/config';
import setTitle from './components/setTitle.vue';
let baseUrl = config.baseUrl;
let lineList: any = ref([]); //右侧tabber数据
let setTitleRef = ref();
let star = ref(); // 控制收藏
let model = ref({
show: false,
content: '确定重置所选产品?',
});
let options = ref([
{
icon: star.value ? 'star-filled' : 'star',
text: '收藏',
},
{
icon: 'plusempty',
text: '设置名称',
},
]);
let buttonGroup = ref([
{
text: '加入购物车',
backgroundColor: '#ff0000',
color: '#fff',
},
{
text: '立即购买',
backgroundColor: '#ffa200',
color: '#fff',
},
]);
let lineId = ref(); // 修改的产品线id
let lineName = ref(); // 修改的产品线名称
let collectData = ref({})
let specificationData = ref([] as any)
onReady(() => {
lineList.value = []
setTitleRef.value.title = ''
uni.$on('importProductLineData', (res: any) => {
console.log(res.data, 'res.data');
if (res.data.lineId) {
if (res.data.userHasCollect === 1) {
collectData.value = {
type: 2,
valueId: res.data.lineId,
}
star.value = true;
options.value[0].icon = 'star-filled';
}
lineId.value = res.data.lineId
lineName.value = res.data.lineName
} else lineId.value = null // 判断是否为导入产品线
let dataArr = [] as any
// 集合goodsId数组
res.data.cartList.map((item: any) => {
if (item.goodsId) dataArr.push(item.goodsId)
})
// 获取规格键值集合
getLineSpecification(dataArr).then((res: any) => {
if (res.data.code === 200) specificationData.value = res.data.data
})
handleEditProductLineData(res.data)
})
})
// 匹配规格 SDTrack: 单轨/双轨 size: 长度(MM) Segs: 分段数
let matchSpecifications = () => {
lineList.value.forEach((line: any) => {
for (let spec in specificationData.value) {
if (line.goodsId == spec) {
for (let item in specificationData.value[spec])
if (item === "长度(MM)" || item === "单轨/双轨" || item === "分段数") {
specificationData.value[spec][item].map((i: any) => {
let index = line.specifications.indexOf(i.value)
if (index !== -1) {
switch (i.specification) {
case '长度(MM)':
line['size'] = i.value
break;
case '单轨/双轨':
line['SDTrack'] = i.value
break;
case '分段数':
line['Segs'] = i.value
break;
}
}
})
}
}
}
})
}
// 处理要修改的数据
let handleEditProductLineData = (editData: any) => {
lineList.value = []
// 处理子组件数据更新延迟问题
nextTick(() => {
// 合并数据
lineList.value = [...editData.cartList, ...lineList.value]
setTimeout(() => {
matchSpecifications()
}, 50)
getImageInfo()
});
}
// 获取图片尺寸
let getImageInfo = () => {
lineList.value.forEach((item: any) => {
uni.getImageInfo({
src: baseUrl + item.url,
success(res: any) {
item['imageWidth'] = res.width * 0.3
item['imageHeight'] = res.height * 0.3
}
})
})
}
// 商品加入购物车等左侧事件
let onClick = (e: any) => {
if (e.index === 1) {
setTitleRef.value.showTitle = true;
if (lineName.value) setTitleRef.value.title = lineName.value
} else {
// 收藏
if (!star.value) {
if (JSON.stringify(collectData.value) === '{}') {
// 初次收藏
if (lineName.value) setTitleRef.value.title = lineName.value
complete().then((data: any) => {
productLineCollect(data).then((res: any) => {
if (res.data.code === 200) {
collectData.value = {
type: 2,
valueId: res.data.data.valueId,
}
star.value = true;
options.value[0].icon = 'star-filled';
uni.showToast({
title: '收藏成功',
icon: 'none',
});
}
});
});
} else {
// 收藏取消后收藏
delProductLineCollect(collectData.value).then((res: any) => {
if (res.data.code === 200) {
star.value = true;
options.value[0].icon = 'star-filled';
uni.showToast({
title: '收藏成功',
icon: 'none',
});
}
});
}
} else {
// 取消收藏
delProductLineCollect(collectData.value).then((res: any) => {
if (res.data.code === 200) {
star.value = false;
options.value[0].icon = 'star';
uni.showToast({
title: '取消收藏',
icon: 'none',
});
}
});
}
}
};
// 商品加入购物车等右侧事件
let buttonClick = (e: any) => {
switch (e.index) {
case 0:
addCart();
break;
case 1:
buyNow();
break;
}
};
// 加入购物车
let addCart = () => {
if (lineName.value) setTitleRef.value.title = lineName.value
complete().then((data: any) => {
// 判断是否有失效商品
if (
data.item.some((item: any) => {
return !item.isSubmit && item.deleted;
})
)
return uni.showToast({
title: '请先删除带红色图标的失效商品',
icon: 'none',
});
// console.log(data, '加入购物车成功');
// 添加到购物车
data['isUpload'] = true
if (lineId.value) {
data['lineId'] = lineId.value
getProductLineReAdd(data).then((res: any) => {
if (res.data.code === 200) {
uni.showToast({
title: '保存购物车成功',
icon: 'none',
});
lineList.value = []
setTitleRef.value.title = ''
setTimeout(() => {
uni.reLaunch({ url: './productLine' })
}, 50)
}
})
} else addProductLineCart(data).then((res: any) => {
if (res.data.code === 200) {
uni.showToast({
title: '加入购物车成功',
icon: 'none',
});
lineList.value = []
setTitleRef.value.title = ''
setTimeout(() => {
uni.reLaunch({ url: './productLine' })
}, 50)
}
});
});
};
// 立即购买
let buyNow = () => {
if (lineName.value) setTitleRef.value.title = lineName.value
complete().then((data: any) => {
// 判断是否有失效商品
if (
data.item.some((item: any) => {
return !item.isSubmit && item.deleted;
})
)
return uni.showToast({
title: '请先删除带红色图标的失效商品',
icon: 'none',
});
data['isUpload'] = true
addProductLineCart(data).then((res: any) => {
if (res.data.code === 200) {
if (!uni.getStorageSync('addressId')) {
uni.setStorage({
key: 'addressId',
data: 0,
});
}
let storage: any = {
cartId: 0,
couponId: 0,
};
Object.keys(storage).forEach((prop: any) => {
const el: any = storage[prop];
uni.setStorage({
key: prop,
data: el,
});
});
uni.navigateTo({
url: '../order/checkout?type=' + 'productline' + '&buyNowId=' + res.data.data,
});
}
});
});
};
// 点击 收藏,加入购物车,立即购买 前逻辑
let complete = () => {
return new Promise((resolve, reject) => {
if (lineList.value.length === 0)
return uni.showToast({
title: '请先选择产品',
icon: 'none',
});
if (!setTitleRef.value.title)
return uni.showToast({
title: '请先设置标题',
icon: 'none',
});
let lineData: any = [...lineList.value]; // 拷贝
lineData.length = lineData.length - 1; // 删除最后一个数据
let data = {
item: lineData,
title: setTitleRef.value.title,
};
resolve(data);
})
};
// 重置产品线
let reset = () => (model.value.show = true);
//确认重置
let onConfirm = () => {
model.value.show = false;
};
// 返回刷新页面
onBackPress((options: any) => {
// if (options.from === 'backbutton') {
// uni.navigateBack()
// }
setTimeout(() => {
uni.reLaunch({ url: './productLine' })
}, 50)
})
</script>
<style lang="scss" scoped>
$nav-heigth: var(--window-bottom);
:deep(.u-cell_title) {
// min-width: 100px;
// max-width: 200px;
width: 150px;
}
.add {
position: absolute;
width: 180px;
height: 40px;
background-color: #fff;
z-index: 0;
text-align: center;
line-height: 45px;
margin-top: 20rpx;
}
.left-cates {
width: 190px;
}
.right-cates {
flex: 1;
display: flex;
flex-direction: row;
justify-content: center;
// align-items: center;
background-color: #fff;
min-height: 100vh;
.right-cates-list {
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
text-align: center;
align-items: center;
}
}
.u-wrap {
// height: calc(100vh);
/* #ifdef H5 */
// height: calc(100vh - var(--window-top));
// min-height: 100vh;
// max-height: 2000px;
/* #endif */
display: flex;
flex-direction: column;
}
.u-menu-wrap {
flex: 1;
display: flex;
overflow: hidden;
justify-content: space-between;
}
.goods-nav {
position: fixed;
bottom: $nav-heigth;
width: 100%;
display: inline;
transform: none;
z-index: 999;
}
:deep(.uni-tab__cart-box) {
max-width: 420px;
border-left: #f6f6f6 solid 1px;
border-right: #f6f6f6 solid 1px;
}
</style>
<template>
<u-popup
v-model="show"
mode="bottom"
length="90%"
:mask-close-able="false"
closeable
@close="handleClose"
>
<view>
<view
style="width: 90%; height: 50px; position: fixed; top: 0; z-index: 1; background-color: #fff;"
>
<uni-search-bar
v-model="searchQuery.keyword"
placeholder="输入搜索商品"
bgColor="#EEEEEE"
clearButton="auto"
cancelButton="none"
@confirm="search"
/>
</view>
<view style="height: 120rpx"></view>
<view v-if="searchList.length !== 0">
<goodsItem
v-for="item in searchList"
:src="item.picUrl"
:name="item.name"
:brief="item.brief"
:counterPrice="item.counterPrice"
:retailPrice="item.retailPrice"
@tap="searchGoods(item)"
/>
<view style="padding-bottom: 40rpx;">
<u-loadmore :status="status" icon-type="flower" @loadmore="loadMore" />
</view>
</view>
<view v-else><u-loadmore status="nomore" icon-type="flower" /></view>
</view>
</u-popup>
</template>
<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { getGoodsList } from '@/api/category';
import goodsItem from '@/components/goodsItem.vue';
let props = defineProps({
show: {
type: Boolean,
default: false,
},
});
let emits = defineEmits(['search-close', 'cateGoryGoods']);
let searchQuery = reactive({
keyword: '',
page: 1,
limit: 10,
categoryId: 0,
});
let status = ref('loadmore');
let total = ref(0);
let searchList = ref([] as any);
let search = (val: any) => {
searchList.value = [];
searchQuery.page = 1;
searchQuery.keyword = val.value;
initList();
};
let searchGoods = (item: any) => {
emits('search-close', false);
emits('cateGoryGoods', item);
};
// 点击加载更多 status = loadmore 时生效
let loadMore = () => {
// 判断是否还有下一页数据
if (searchQuery.page * searchQuery.limit >= total.value) return (status.value = 'nomore');
// // 判断是否正在请求其它数据,如果是,则不发起额外的请求
if (status.value === 'loading') return;
searchQuery.page += 1;
initList();
};
let initList = () => {
status.value = 'loading';
getGoodsList(searchQuery).then((res: any) => {
if (res.data.data.total > 10) status.value = 'loadmore';
else status.value = 'nomore';
if (res.data.code === 200) {
total.value = res.data.data.total;
searchList.value = [...searchList.value, ...res.data.data.list];
}
});
};
let handleClose = () => {
searchList.value = [];
emits('search-close', false);
};
defineExpose({
searchQuery,
initList,
});
</script>
<style></style>
<template>
<u-popup v-model="showTitle" mode="center" height="380rpx" width="80%">
<view style="padding: 30rpx 30rpx 0 30rpx; height: 100%;">
<view style="font-size: 34rpx; width: 100%; text-align: center; margin-bottom: 20rpx;">
设置产品线名称
</view>
<u-form label-width="110">
<u-form-item label="名称:">
<u-input v-model="title" :type="type" :border="true" clearable placeholder="请输入名称" />
</u-form-item>
</u-form>
<u-button :maxlength="11" type="error" style="margin-top: 40rpx;" @tap="saveTitle">
保存
</u-button>
</view>
</u-popup>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { useStore, useLineStore } from '@/store/useStore';
let store = useStore();
let store1 = useLineStore();
let showTitle = ref(false);
// let title = ref(store.title);
let title = ref(store1.title);
let type = ref('text');
let saveTitle = () => {
if (title.value) {
store1.$patch({
title: title.value,
});
uni.showToast({
title: '设置成功',
icon: 'none',
});
showTitle.value = false;
} else {
uni.showToast({
title: '设置失败',
icon: 'none',
});
}
};
defineExpose({
showTitle,
title
});
</script>
<style>
</style>
<template>
<view style="width: 100%;">
<u-navbar :is-back="false" title="产品线" :background="{ background: '#f8f8f8' }" title-bold title-color="#000">
<template #default>
<view style="display: flex; flex-direction: row; margin-left: 30rpx;">
<view style="margin-right: 30rpx" @tap="selectLineBody">{{ body ? '双轨' : '单轨' }}</view>
<view style="margin-right: 30rpx" @tap="selectFlowDirection">流向({{ flow ? '右到左' : '左到右' }})</view>
</view>
</template>
<template #right>
<view style="display: flex; flex-direction: row;">
<view style="margin-right: 30rpx" @tap="uploadLine">导入</view>
<view style="margin-right: 30rpx" @tap="reset">重置</view>
</view>
</template>
</u-navbar>
<view style="margin: 10rpx 6rpx 0;">
<!--使用draggable组件-->
<VueDraggableNext v-model="lineList" @start="onStart" @end="onEnd" :animation="500">
<transition-group>
<u-cell-group v-for="(item, index) in lineList" :key="index" @tap="tapCellGroup(item, index)">
<u-cell-item v-if="item?.name" icon="" :title="item?.name" :arrow="false">
<template #right-icon>
<u-icon v-if="!item.isSubmit && item.deleted" name="error-circle-fill" color="#ff0000"
style="margin-right: 4rpx;" />
<u-icon v-if="
item.deleted && item.isSubmit
? false
: item.deleted ||
typeof item.isSubmit === 'undefined'
? false
: !item.isSubmit && !item.deleted
" name="error-circle-fill" color="#0055ff" style="margin-right: 4rpx;" />
<view style="margin-left: 30rpx;">
<u-tag v-show="item?.size" :text="item?.size" type="info" size="mini"
style="margin-right: 10rpx;" />
<u-tag v-show="item?.SDTrack" :text="item?.SDTrack" type="info" size="mini"
style="margin-right: 10rpx;" />
<u-tag v-show="item?.Segs" :text="item?.Segs" type="info" size="mini" />
</view>
<view style="color: #909399; margin-left: 20rpx;">×{{ item?.number }}</view>
</template>
</u-cell-item>
</u-cell-group>
</transition-group>
</VueDraggableNext>
<view class="add">
<u-icon name="plus" color="#c6c6c6" size="50" @tap="addTabs"></u-icon>
</view>
</view>
<view class="empty_box" />
<!-- 导航 -->
<uni-goods-nav class="goods-nav" :fill="true" :options="options" :buttonGroup="buttonGroup" @click="onClick"
@buttonClick="buttonClick" />
</view>
<!-- 选择弹出框 -->
<category-popup ref="categoryRef" :show="showPopup" @close="handleClose" @categoryData="initCategory" />
<!-- 产品线sku -->
<goods-sku ref="goodsSkuRef" @add-product="addProduct" @close-sku="closeSku" />
<!-- 设置标题 -->
<set-title ref="setTitleRef" />
<!-- model提示框 -->
<u-modal v-model="model.show" :content="model.content" show-cancel-button @confirm="onConfirm" />
<!-- 操作菜单 -->
<u-action-sheet :list="sheetData.list" v-model="sheetData.show" @click="clickSheet" />
<!-- 消息提示 -->
<u-toast ref="uToastRef" />
</template>
<script setup lang='ts'>
import { ref, nextTick } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { indexDetails } from '@/api/index';
import { useSpecStore, useLineStore } from '@/store/useStore';
import {
addProductLineCart,
productLineCollect,
delProductLineCollect,
getProductLineIndex,
getProductLineReAdd,
getLineSpecification
} from '@/api/productLine';
import { VueDraggableNext } from 'vue-draggable-next'
import config from '@/utils/config';
import categoryPopup from './components/categoryPopup.vue';
import goodsSku from '@/pages/goods/goodsSku.vue';
import setTitle from './components/setTitle.vue';
let store = useLineStore();
let specStore = useSpecStore()
let baseUrl = config.baseUrl;
let lineList: any = ref(store.lineData); //右侧tabber数据
let showPopup: any = ref(false); // popup弹窗
let categoryRef = ref();
let goodsSkuRef = ref();
let setTitleRef = ref();
let uToastRef = ref();
let detailData = ref(); // 产品信息
let star = ref(store.star); // 控制收藏
let skuClose = ref(''); // sku通过何种方式消失
let editIndex = ref();
let editFlag = ref(false);
let lineDelete = ref([] as any); // 记录产品线删除数据
let lineEdit = ref(); // 记录产品线修改的数据
let flow = ref(false) // 流向 默认 左到右
let flowFlag = ref(false) // 流向开关
let body = ref(false) // 线体 默认 单轨
let options = ref([
{
icon: star.value ? 'star-filled' : 'star',
text: '收藏',
},
{
icon: 'plusempty',
text: '设置名称',
}
]);
let buttonGroup = ref([
{
text: '加入购物车',
backgroundColor: '#ff0000',
color: '#fff',
},
{
text: '立即购买',
backgroundColor: '#ffa200',
color: '#fff',
},
]);
let model = ref({
show: false,
content: '确定重置所选产品?',
});
let sheetData = ref({
list: [{
text: '修改规格',
}, {
text: '复制'
}, {
text: '删除'
}],
show: false,
row: {},
delIndex: undefined as any
})
let lineId = ref(); // 修改的产品线id
let isUpload = ref(false) // 判断是否是产品线
onLoad((options: any) => {
// 修改产品线时使用
if (options.cartId) {
flowFlag.value = true
lineId.value = options.id;
// 把加入购物车变成禁用状态
// buttonGroup.value[0].backgroundColor = '#ccc';
initProductLine(options.id);
} else if (options.collectionId) {
// lineId.value = options.id;
// 把加入购物车变成禁用状态
initProductLine(options.id);
}
});
// 添加商品
let addTabs = () => {
if (lineList.value.length === 0) {
model.value.show = true
model.value.content = flow.value ? '确定流向为从右到左?' : '确定流向为从左到右?'
return
}
goodsSkuRef.value.goodsInfoCopy = null // 防止sku直接赋值
goodsSkuRef.value.defaultSelect = {} // 清除默认sku
categoryRef.value.currentSubCategoryData = [];
showPopup.value = true;
categoryRef.value.initIndex();
// console.log(store.lineData);
};
// 添加产品线产品
let initCategory = (data: any) => {
initDetails(data.id);
uni.showLoading({
title: '加载中...',
});
};
// // 保存到产品线
let addProduct = (data: any, productId: number, specifications: any, specificationCustom: any) => {
flowFlag.value = true // 禁用选择流向
let index = lineList.value.length - 1
// console.log(index, 'index');
getLineSpecification([data.goods_id]).then((res: any) => {
if (res.data.code === 200) {
matchSpecifications(res.data.data, data.goods_id, specifications).then((res: any) => {
let obj = {
name: data.goods_name,
url: data.image,
goodsId: data.goods_id,
number: data.buy_num,
productId: productId,
specifications,
specificationCustom,
show: false,
status: 1,
}
if (typeof sheetData.value.delIndex != 'undefined') {
console.log(sheetData.value.delIndex, 'sheetData.value.delIndex');
// let arr = [...lineList.value]
// arr.splice(sheetData.value.delIndex, 1, obj)
// console.log(arr, 'arr');
lineList.value.splice(sheetData.value.delIndex, 1, obj);
if (JSON.stringify(res) != '{}')
for (const k in res)
lineList.value[sheetData.value.delIndex][k] = res[k]
sheetData.value.delIndex = undefined
store.$patch({
lineData: lineList.value,
});
console.log(lineList.value, 'store.lineData');
goodsSkuRef.value.skuKey = false;
} else {
// lineList.value = [...lineList.value, ...[obj]]
lineList.value.push(obj)
if (JSON.stringify(res) != '{}')
for (const k in res)
lineList.value[lineList.value.length - 1][k] = res[k]
store.$patch({
lineData: lineList.value,
});
console.log(lineList.value, 'store.lineData');
goodsSkuRef.value.skuKey = false;
}
})
}
})
};
// 匹配规格 SDTrack: 单轨/双轨 size: 长度(MM) Segs: 分段数
let matchSpecifications = (specificationData: any, goodsId: any, specifications: any) => {
let arr = {} as any
let a = new Promise<void>((resolve, reject) => {
for (let spec in specificationData) {
if (goodsId == spec) {
for (let item in specificationData[spec])
if (item === "长度(MM)" || item === "单轨/双轨" || item === "分段数") {
specificationData[spec][item].map((i: any) => {
let index = specifications.indexOf(i.value)
if (index !== -1) {
switch (i.specification) {
case '长度(MM)':
arr['size'] = i.value
break;
case '单轨/双轨':
arr['SDTrack'] = i.value
break;
case '分段数':
arr['Segs'] = i.value
break;
}
}
})
}
}
}
resolve(arr)
})
return a
}
// 获取sku隐藏方式 '' 加入后 mask 点击mask部分, close 点击关闭按钮
let closeSku = (val: string) => {
if (editFlag.value) {
skuClose.value = val;
if (skuClose.value) {
// 取消修改后的逻辑
specStore.$reset()
// lineList.value.splice(editIndex.value.index, 0, editIndex.value.data);
} else {
// 确定修改产品
let index = lineList.value.length - 2;
if (lineList.value.length === 2) index = 0;
let data = lineList.value[index];
lineList.value.splice(index, 1);
// 通过购物车产品线进入修改
if (lineId.value) {
lineEdit.value.productId = data.productId;
lineEdit.value.specificationCustom = data.specificationCustom;
lineEdit.value.specifications = data.specifications;
lineEdit.value.number = data.number;
// 当是失效商品需要重新选规格时使用
if (lineEdit.value.hasOwnProperty('isSubmit')) delete lineEdit.value.isSubmit;
lineList.value.splice(editIndex.value.index, 0, lineEdit.value);
lineEdit.value = null;
} else lineList.value.splice(editIndex.value.index, 0, data);
}
store.$patch({
lineData: lineList.value,
});
goodsSkuRef.value.handleClose();
editFlag.value = false;
} else {
goodsSkuRef.value.handleClose();
}
};
// 根据id获取商品信息
let initDetails = (id: number) => {
indexDetails({
id,
}).then((res: any) => {
if (res.data.code === 200) {
uni.hideLoading();
detailData.value = res.data.data;
defaultSelection(res.data.data)
if (specStore.isDefaultSku && specStore.specificationCustom.length === 0) goodsSkuRef.value.goodsInfoCopy = null // 防止sku直接赋值
if (specStore.isDefaultSku) goodsSkuRef.value.defaultSelect = specStore.defaultSelect
goodsSkuRef.value.init(detailData.value, id);
if (specStore.isDefaultSku && specStore.specificationCustom.length > 0) resetCustomSpec()
else specStore.$reset() // 重置数据
goodsSkuRef.value.skuKey = true;
goodsSkuRef.value.skuMode = 5;
// 设置自定义规格的
// console.log(res.data.data, '商品详情数据');
}
});
};
// 有线体,流向,打开sku时默认选择
let defaultSelection = (data: any) => {
let arr = [] as any
let flag = false
data.specificationList.map((item: any, i: number) => {
if (item.name == '单轨/双轨') {
if (body.value) arr.push('双轨')
else arr.push('单轨')
flag = true
} else if (item.name == '流向') {
if (flow.value) arr.push('右到左')
else arr.push('左到右')
flag = true
} else arr.push('')
})
if (flag)
goodsSkuRef.value.defaultNotAllSelect = {
sku: arr,
num: 1
}
}
//重置自定义规格
const resetCustomSpec = () => {
// 当商品含有自定义规格时
if (specStore.specificationCustom.length > 0) {
let indexs = [] as any // 记录自定义规格的索引
specStore.specificationCustom.map((item: any) => {
for (const key in item) {
detailData.value.specificationList.map((specList: any, spec: number) => {
if (key == specList.name) {
goodsSkuRef.value.onPlus(spec, item[key])
indexs.push(spec)
}
})
}
})
let index: any;
detailData.value.productList.map((proList: any, pro: number) => {
let flag = true
proList.specifications.map((pr: any, p: number) => {
specStore.defaultSelect.sku.map((def: any, d: number) => {
if (indexs.indexOf(d) === -1 && p === d && pr != def) flag = false
})
})
if (flag) return index = pro
})
specStore.defaultSelect.sku = detailData.value.productList[index].specifications
specStore.$reset() // 重置数据
}
}
// 操作数据
let tapCellGroup = (row: any, index: number) => {
// console.log(row);
sheetData.value.row = row
sheetData.value.delIndex = index
sheetData.value.show = true
}
// 点击操作菜单
let clickSheet = (index: number) => {
switch (index) {
case 0:
sheetEdit(sheetData.value.delIndex)
break;
case 1:
sheetCopy(sheetData.value.delIndex)
break;
case 2:
if (lineId.value) {
if (lineList.value[index].hasOwnProperty('deleted')) {
lineList.value[index].deleted = true;
lineDelete.value.push(lineList.value[index]);
}
}
lineList.value.splice(sheetData.value.delIndex, 1);
store.$patch({
lineData: lineList.value,
});
break;
}
}
// 产品修改
let sheetEdit = (index: number) => {
console.log(index);
editFlag.value = true;
let data = lineList.value[index];
if (lineId.value) {
data.updateTime = null;
lineEdit.value = data;
// console.log(lineEdit.value, 'xiugaua');
if (lineEdit.value.deleted && !lineEdit.value.isSubmit)
return uni.showToast({
title: '请勿修改失效商品',
icon: 'none',
});
}
editIndex.value = {
index,
data,
};
specStore.$patch({
isDefaultSku: true,
defaultSelect: {
sku: data.specifications,
num: data.number
}
})
// 是否含有自定义规格
if (data.productId === 0) specStore.$patch({ specificationCustom: data.specificationCustom || [] })
// store.$patch({ lineData: lineList.value.splice(index, 1) });
// lineList.value = JSON.parse(JSON.stringify(lineList.value))
console.log(lineList.value, 'lineList.value', store.lineData);
initDetails(data.goodsId);
};
// 产品复制
let sheetCopy = (index: number) => {
if (lineList.value[index].deleted && !lineList.value[index].isSubmit)
return uni.showToast({
title: '请勿复制失效商品',
icon: 'none',
});
lineList.value.splice(index, 0, lineList.value[index]);
// 避免splice改变原数组
let lineInfos = JSON.parse(JSON.stringify(lineList.value));
lineInfos[index].show = false;
lineList.value = lineInfos;
store.$patch({
lineData: lineInfos,
});
// 通过购物车进入操作时进入
if (lineId.value) {
if (lineList.value[index + 1].hasOwnProperty('deleted'))
delete lineList.value[index + 1].deleted;
if (lineList.value[index + 1].hasOwnProperty('updateTime'))
delete lineList.value[index + 1].updateTime;
if (lineList.value[index + 1].hasOwnProperty('id')) delete lineList.value[index + 1].id;
store.$patch({
lineData: lineList.value,
});
}
console.log(store.lineData);
};
// 商品加入购物车等右侧事件
let buttonClick = (e: any) => {
switch (e.index) {
case 0:
addCart();
break;
case 1:
buyNow();
break;
}
};
// 加入购物车
let addCart = () => {
complete().then((data: any) => {
// 判断是否有失效商品
if (
data.item.some((item: any) => {
return !item.isSubmit && item.deleted;
})
)
return uni.showToast({
title: '请先删除带红色图标的失效商品',
icon: 'none',
});
if (lineId.value) {
// 修改
data['lineId'] = lineId.value;
// 把删除的数据添加进去
if (lineDelete.value.length !== 0) {
lineDelete.value.map((item: any) => {
data.item.push(item);
});
}
getProductLineReAdd(data).then((res: any) => {
if (res.data.code === 200) {
lineDelete.value = [];
reload();
}
});
} else {
// console.log(data, '加入购物车成功');
// 添加到购物车
addProductLineCart(data).then((res: any) => {
if (res.data.code === 200) {
uni.showToast({
title: '加入购物车成功',
icon: 'none',
});
reload();
}
});
}
});
};
// 立即购买
let buyNow = () => {
complete().then((data: any) => {
// 判断是否有失效商品
if (
data.item.some((item: any) => {
return !item.isSubmit && item.deleted;
})
)
return uni.showToast({
title: '请先删除带红色图标的失效商品',
icon: 'none',
});
addProductLineCart(data).then((res: any) => {
if (res.data.code === 200) {
if (!uni.getStorageSync('addressId')) {
uni.setStorage({
key: 'addressId',
data: 0,
});
}
let storage: any = {
cartId: 0,
couponId: 0,
};
Object.keys(storage).forEach((prop: any) => {
const el: any = storage[prop];
uni.setStorage({
key: prop,
data: el,
});
});
uni.navigateTo({
url: '../order/checkout?type=' + 'productline' + '&buyNowId=' + res.data.data,
});
}
});
});
};
// 点击 收藏,加入购物车,立即购买 前逻辑
let complete = () => {
return new Promise((resolve, reject) => {
if (store.lineData.length === 0)
return uni.showToast({
title: '请先选择产品',
icon: 'none',
});
if (!store.title)
return uni.showToast({
title: '请先设置标题',
icon: 'none',
});
// let lineDatas: any = [...store.lineData]; // 拷贝
// lineDatas.length = lineDatas.length - 1; // 删除最后一个数据
let data = {
item: store.lineData,
title: store.title,
flow: flow.value
};
resolve(data);
});
};
// 商品加入购物车等左侧事件
let onClick = (e: any) => {
if (e.index === 1) {
setTitleRef.value.showTitle = true;
} else {
// 收藏
if (!star.value) {
if (JSON.stringify(store.collectData) === '{}') {
// 初次收藏
complete().then((data: any) => {
productLineCollect(data).then((res: any) => {
if (res.data.code === 200) {
store.$patch({
star: true,
collectData: {
type: 2,
valueId: res.data.data.valueId,
flow: flow.value
},
});
star.value = true;
options.value[0].icon = 'star-filled';
uni.showToast({
title: '收藏成功',
icon: 'none',
});
}
});
});
} else {
// 收藏取消后收藏
delProductLineCollect(store.collectData).then((res: any) => {
if (res.data.code === 200) {
store.$patch({
star: true,
});
star.value = true;
options.value[0].icon = 'star-filled';
uni.showToast({
title: '收藏成功',
icon: 'none',
});
}
});
}
} else {
// 取消收藏
delProductLineCollect(store.collectData).then((res: any) => {
if (res.data.code === 200) {
store.$patch({
star: false,
});
star.value = false;
options.value[0].icon = 'star';
uni.showToast({
title: '取消收藏',
icon: 'none',
});
}
});
}
}
};
// 重置页面数据
let reload = () => {
store.$reset(); // 重置pinia数据
let pages = getCurrentPages(); //获取所有页面的数组对象
let currPage: any = pages[pages.length - 1]; //当前页面
uni.reLaunch({ url: '/' + currPage.route });
};
//确认重置
let onConfirm = () => {
if (model.value.content === '确定重置所选产品?') reload();
else {
flowFlag.value = true
goodsSkuRef.value.goodsInfoCopy = null // 防止sku直接赋值
goodsSkuRef.value.defaultSelect = {} // 清除默认sku
categoryRef.value.currentSubCategoryData = [];
showPopup.value = true;
categoryRef.value.initIndex();
}
model.value.show = false;
};
// 退出popup
let handleClose = (val: Boolean) => {
showPopup.value = val
if (store.lineData.length === 0) flowFlag.value = false
};
//拖拽开始事件
let onStart = () => {
}
//拖拽结束事件
let onEnd = () => {
// console.log(lineList.value);
}
let uploadLine = () => {
uni.chooseFile({
count: 0,
extension: ['.xlsx'],
success(res: any) {
let fileName = res.tempFiles[0].name
uni.showLoading({
title: '加载中'
})
uni.uploadFile({
url: baseUrl + '/wx/productLine/upload?flow=' + false,
filePath: res.tempFilePaths[0],
name: 'file',
header: { Authorization: uni.getStorageSync('token') },
success(uploadFileRes: any) {
uni.hideLoading()
let fileRes = JSON.parse(uploadFileRes.data)
if (fileRes.code === 501 || fileRes.code === 911) return uni.reLaunch({
url: '/pages/login/login',
success() {
uni.showToast({
title: '请登录',
icon: 'none',
});
},
});
if (!fileRes.data.isError) {
// 判断是否为导入产品线
isUpload.value = fileRes.data.isUpload
// 清空标题
store.title = '';
setTitleRef.value.title = store.title;
lineId.value = null
console.log(fileRes.data);
let dataArr = [] as any[]
// 集合goodsId数组
fileRes.data.cartList.map((item: any) => {
if (item.goodsId) dataArr.push(item.goodsId)
})
handleEditProductLineData(fileRes.data, dataArr)
} else {
let key = fileRes.data.key
uni.downloadFile({
url: baseUrl + '/wx/productLine/error/download/' + key,
header: { 'Authorization': uni.getStorageSync('token') },
success: (res: any) => {
let downloadElement = document.createElement('a');
downloadElement.href = res.tempFilePath;
downloadElement.download = fileName; //下载后文件名
document.body.appendChild(downloadElement);
downloadElement.click(); //点击下载
document.body.removeChild(downloadElement); //下载完成移除元素
window.URL.revokeObjectURL(res.tempFilePath); //释放掉blob对象
}
})
}
},
fail() {
uni.hideLoading()
uni.showToast({
title: '导入失败',
icon: 'none'
})
}
})
}
})
}
// 处理要修改的数据
let handleEditProductLineData = (editData: any, dataArr?: any[]) => {
store.$patch({
lineData: [],
});
lineList.value = store.lineData;
// 处理子组件数据更新延迟问题
nextTick(() => {
// 处理数据
editData.cartList.forEach((item: any) => {
item['name'] = item.goodsName;
item['show'] = false;
item['url'] = item.picUrl;
item['status'] = 1;
});
// 合并数据
store.$patch({
lineData: [...editData.cartList, ...lineList.value],
});
lineList.value = store.lineData;
if (editData.lineName) {
store.title = editData.lineName;
setTitleRef.value.title = store.title;
}
if (dataArr)
getLineSpecification(dataArr).then((res: any) => {
if (res.data.code === 200) {
lineList.value.forEach((line: any) => {
for (let spec in res.data.data) {
if (line.goodsId == spec) {
for (let item in res.data.data[spec])
if (item === "长度(MM)" || item === "单轨/双轨" || item === "分段数") {
res.data.data[spec][item].map((i: any) => {
let index = line.specifications.indexOf(i.value)
if (index !== -1) {
switch (i.specification) {
case '长度(MM)':
line['size'] = i.value
break;
case '单轨/双轨':
line['SDTrack'] = i.value
break;
case '分段数':
line['Segs'] = i.value
break;
}
}
})
}
}
}
})
}
})
// console.log(res.data.data.cartList, store.lineData, lineList.value);
});
}
// 修改产品线数据初始化
let initProductLine = (lineId: number) => {
// 获取产品线详细数据
getProductLineIndex({ lineId }).then((res: any) => {
if (res.data.code === 200) {
flow.value = res.data.data.flow
if (res.data.data.userHasCollect === 1) {
store.$patch({
star: true,
collectData: {
type: 2,
valueId: res.data.data.lineId,
flow: flow.value
},
});
star.value = true;
options.value[0].icon = 'star-filled';
}
let dataArr = [] as any[]
res.data.data.cartList.map((item: any) => {
if (item.goodsId) dataArr.push(item.goodsId)
})
handleEditProductLineData(res.data.data, dataArr)
}
});
};
// 选择线体
let selectLineBody = () => body.value = !body.value
// 选择流向
let selectFlowDirection = () => {
if (lineId.value) return uToastRef.value.show({
title: '购物车修改产品线,不可重新选择流向',
type: 'warning',
icon: false
})
if (!flowFlag.value) flow.value = !flow.value
else uToastRef.value.show({
title: '如需选择流向,请点击重置,重新选择产品线',
type: 'warning',
icon: false
})
}
// 重置产品线
let reset = () => {
model.value.content = '确定重置所选产品?'
model.value.show = true
}
</script>
<style lang = "scss" scoped>
$nav-heigth: var(--window-bottom);
:deep(.u-mask) {
max-width: 420px;
margin: 0 auto;
}
:deep(.u-drawer-content) {
max-width: 420px;
margin: 0 auto;
}
:deep(.u-navbar) {
max-width: 420px;
margin: 0 auto;
.u-navbar-content-title {
left: 36% !important
}
}
:deep(.uni-tab__cart-box) {
max-width: 420px;
margin: auto;
border-left: #f6f6f6 solid 1px;
border-right: #f6f6f6 solid 1px;
}
.add {
position: absolute;
width: 100%;
height: 40px;
background-color: #fff;
z-index: 0;
text-align: center;
line-height: 45px;
margin-top: 20rpx;
}
.goods-nav {
position: fixed;
left: 0;
bottom: $nav-heigth;
width: 100%;
display: inline;
transform: none;
z-index: 99;
}
.empty_box {
height: 200rpx;
}
</style>
\ No newline at end of file
...@@ -107,7 +107,7 @@ let toGoods = (data: any) => { ...@@ -107,7 +107,7 @@ let toGoods = (data: any) => {
let toProductLine = (id: any) => { let toProductLine = (id: any) => {
uni.reLaunch({ uni.reLaunch({
url: '../productLine/productLine?id=' + id + '&collectionId=0', url: '../productLine1/index?id=' + id + '&collectionId=0',
}); });
}; };
......
...@@ -2,36 +2,46 @@ import { defineStore, createPinia } from 'pinia' ...@@ -2,36 +2,46 @@ import { defineStore, createPinia } from 'pinia'
// 产品线数据管理 // 产品线数据管理
export let useStore = defineStore('productLine', { export let useStore = defineStore('productLine', {
state: () => { state: () => {
return { return {
lineData: [{ show: false, status: 0 }], lineData: [{ show: false, status: 0 }],
title: '', title: '',
star: false, star: false,
collectData: {} // 收藏返回数据 collectData: {}, // 收藏返回数据
} }
} },
})
// 产品线数据管理
export let useLineStore = defineStore('productLine1', {
state: () => {
return {
lineData: [],
title: '',
star: false,
collectData: {}, // 收藏返回数据
}
},
}) })
// 订单管理页面 // 订单管理页面
export let useCurrentStore = defineStore('current', { export let useCurrentStore = defineStore('current', {
state: () => { state: () => {
return { return {
current: 0 current: 0,
} }
} },
}) })
// 默认规格数据 // 默认规格数据
export let useSpecStore = defineStore('specData', { export let useSpecStore = defineStore('specData', {
state: () => { state: () => {
return { return {
defaultSelect: {} as any, // 数据 defaultSelect: {} as any, // 数据
isDefaultSku: false, // 是否存在默认值 isDefaultSku: false, // 是否存在默认值
partIds: [] as any, partIds: [] as any,
partList: [], partList: [],
specificationCustom: [] specificationCustom: [],
} }
} },
}) })
//判断两个对象是否相同(包含绝对相等和他们是否有相同的形状)
function looseEqual(a: any, b: any): any {
if (a === b) {
//如果是绝对相等就直接返回true
return true
}
//如果不是绝对相等就哦按的他们是否有相同的形状
var isObjectA = isObject(a)
var isObjectB = isObject(b)
if (isObjectA && isObjectB) {
//两个均是对象
try {
var isArrayA = Array.isArray(a)
var isArrayB = Array.isArray(b)
if (isArrayA && isArrayB) {
//如果都是数组
if (a.length === b.length) {
//如果长度相等
return a.every(function (e: any, i: any) {
//用every和递归来比对a数组和b数组的每个元素,并返回
return looseEqual(e, b[i])
})
}
//长度都不等直接返回false
return false
} else if (a instanceof Date && b instanceof Date) {
//如果是Date 则直接getTime 比较
return a.getTime() === b.getTime()
} else if (!isArrayA && !isArrayB) {
//对象的比较
//拿到两个对象的key
var keysA = Object.keys(a)
var keysB = Object.keys(b)
if (keysA.length === keysB.length) {
//如果keys相等
return keysA.every(function (key: any) {
//用every和递归来比对a对象和b对象的每个元素值,并返回
return looseEqual(a[key], b[key])
})
}
//长度都不等直接返回false
return false
} else {
return false
}
} catch (e) {
return false
}
} else if (!isObjectA && !isObjectB) {
//如果都不是对象则按String来处理
return String(a) === String(b)
} else {
return false
}
}
function isObject(obj: any) {
return obj !== null && typeof obj === 'object'
}
export { looseEqual }
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论