1238 lines
29 KiB
Vue
1238 lines
29 KiB
Vue
<template>
|
||
<view class="page-content">
|
||
|
||
<!-- 固定顶部 Tabs -->
|
||
<view class="tabs-wrapper">
|
||
<z-tabs :list="tabList" active-color="rgba(233, 100, 67, 1)" @change="tabsChange" />
|
||
<nut-noticebar v-if="tabIndex==0" text="区间调价：可以针对价格区间进行批量固定加价，或者按照原价的百分比加价"
|
||
:background="`rgba(251, 248, 220, 1)`" :custom-color="`#D9500B`"></nut-noticebar>
|
||
<nut-noticebar v-if="tabIndex==1" text="单机调价：针对某款机器进行固定加价，或者按照原价的百分比加价"
|
||
:background="`rgba(251, 248, 220, 1)`" :custom-color="`#D9500B`"></nut-noticebar>
|
||
<nut-noticebar v-if="tabIndex==2" text="整仓调价：针对整个仓库进行固定加价，或者按照原价的百分比加价"
|
||
:background="`rgba(251, 248, 220, 1)`" :custom-color="`#D9500B`"></nut-noticebar>
|
||
</view>
|
||
|
||
|
||
<!-- 区间调价 -->
|
||
<view v-if="tabIndex==0">
|
||
<!-- 滚动内容区 -->
|
||
<scroll-view class="scroll-area" scroll-y="true" scroll-with-animation="true">
|
||
<!-- 固定顶部按钮 -->
|
||
<view class="top-bar">
|
||
<nut-button type="primary" plain @click="addRule">新增规则</nut-button>
|
||
<nut-button type="primary" @click="saveRangeRule">保存配置</nut-button>
|
||
</view>
|
||
<view class="rule-item" v-for="(item, index) in rangeRule" :key="index">
|
||
<!-- 第一行：最低价 + 最高价 -->
|
||
<view class="row">
|
||
<view class="field">
|
||
<text class="label">最低价</text>
|
||
<nut-input v-model="item.min_price" type="number" placeholder="0" input-align="right" />
|
||
</view>
|
||
<view class="field">
|
||
<text class="label">最高价</text>
|
||
<nut-input v-model="item.max_price" type="number" placeholder="0" input-align="right" />
|
||
</view>
|
||
</view>
|
||
<!-- 第二行：加价金额 + 加价类型（单选） -->
|
||
<view class="row">
|
||
<view class="field">
|
||
<text class="label">加价金额/百分比</text>
|
||
<nut-input v-model="item.val" type="number" placeholder="0" input-align="right" />
|
||
</view>
|
||
<view class="field">
|
||
<text class="label">加价类型</text>
|
||
<nut-radio-group v-model="item.val_type" direction="horizontal">
|
||
<nut-radio :label="1">固定加价</nut-radio>
|
||
<nut-radio :label="2">百分比加价</nut-radio>
|
||
</nut-radio-group>
|
||
</view>
|
||
</view>
|
||
<!-- 删除按钮 -->
|
||
<view class="delete-btn">
|
||
<nut-button type="danger" size="mini" @click="removeRule(index)">删除</nut-button>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
|
||
<!-- 单机调价 -->
|
||
<view v-if="tabIndex==1">
|
||
<view class="top-select">
|
||
<nut-menu title-class="titleClass">
|
||
<!-- 价格排序 -->
|
||
<nut-menu-item :title="state.price_sort_name" ref="selectPriceSortRef">
|
||
<view style="display: flex;flex-direction: column;width: 100%;padding: 0px 12px;">
|
||
<view class="degree-inner">
|
||
<view class="degree-item" :class="{active: state.price_sort === item.value}"
|
||
v-for="(item,idx) in state.price_sort_params" :key="idx"
|
||
@click="selectPriceSort(item)">
|
||
<text>{{item.text}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</nut-menu-item>
|
||
<!-- 价格排序 -->
|
||
<!-- 机型选择 -->
|
||
<nut-menu-item :title="state.product_name" ref="selectProductRef">
|
||
<view style="display: flex;flex-direction: column;width: 100%;padding: 0px 0px;">
|
||
<view class="filter-types">
|
||
<view class="filter-type-inner" v-for="(type,idx) in state.type_params" :key="idx"
|
||
@click="selectType(type)" :class="{active: state.type_id == type.type_id}">
|
||
<text>{{type.name}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="tabs-container">
|
||
<scroll-view :show-scrollbar="false" scroll-y class="tabs-inner" enable-flex>
|
||
<view class="tab-inner"
|
||
v-for="(item,idx) in state?.drop_down_options[state.type_id]?.children"
|
||
:key="idx" @click="selectBrand(item)"
|
||
:class="{'tab-inner-active':item.value == state.brand_id}">
|
||
<view class="line"></view>
|
||
<text>{{item.label}}</text>
|
||
</view>
|
||
</scroll-view>
|
||
<scroll-view scroll-y class="tab-pane-inner" enable-flex>
|
||
<view style="display: flex;flex-direction: column;width: 100%;padding: 10rpx;">
|
||
<view class="degree-inner">
|
||
<view class="degree-item" v-for="(item,idx) in productOptions" :key="idx"
|
||
:class="{active: state.product_ids.includes(item.value)}"
|
||
@click="selectProduct(item)">
|
||
<text>{{item.label}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
<view class="product-btns">
|
||
<view class="reset">
|
||
<nut-button plain @click="onResetProduct()" type="default">重置</nut-button>
|
||
</view>
|
||
<view class="confirm">
|
||
<nut-button block @click="onConfirmProduct()" type="primary">确认</nut-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</nut-menu-item>
|
||
<!-- 机型选择 -->
|
||
<!-- 成色选择 -->
|
||
<nut-menu-item :title="state.degree_name" ref="selectDegreeRef">
|
||
<view style="display: flex;flex-direction: column;width: 100%;padding: 0px 12px;">
|
||
<view class="degree-inner">
|
||
<view class="degree-item" :class="{active: state.degree_ids.includes(item.value)}"
|
||
v-for="(item,idx) in state.degree_params" :key="idx" @click="selectDegree(item)">
|
||
<text>{{item.text}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="degree-btns">
|
||
<view class="reset">
|
||
<nut-button plain @click="onResetDegree()" type="default">重置</nut-button>
|
||
</view>
|
||
<view class="confirm">
|
||
<nut-button block @click="onConfirmDegree()" type="primary">确认</nut-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</nut-menu-item>
|
||
<!-- 成色选择 -->
|
||
</nut-menu>
|
||
</view>
|
||
|
||
<view style="height: 80vh;">
|
||
<z-paging :fixed="false" ref="paging" :refresher-enabled="false" :auto-clean-list-when-reload="false"
|
||
:auto-scroll-to-top-when-reload="false" v-model="dataList" @query="queryList">
|
||
<view class="goods-item" v-for="(item, index) in dataList" :key="index">
|
||
<view class="goods-item-image">
|
||
<image class="goods-item-image-img" :src="getImg(item)" @click="showGoodsImages(item)"
|
||
mode="scaleToFill">
|
||
</image>
|
||
</view>
|
||
<view class="goods-item-content">
|
||
<view class="goods-item-content-header">
|
||
<nut-tag custom-color="#1a1a1a">{{ item.goods_house.degree.degree_name }}</nut-tag>
|
||
<view>{{item.goods_house.goods_name}}</view>
|
||
</view>
|
||
<view class="goods-item-content-body">
|
||
<view class="goods-item-content-body-desc">
|
||
{{item.goods_house.content}}
|
||
</view>
|
||
</view>
|
||
|
||
<view class="goods-item-content-footer">
|
||
<view>
|
||
<view>
|
||
<text style="font-size: 24rpx;">原价：
|
||
<text>{{item.goods_house.goods_price}}</text>
|
||
</text>
|
||
</view>
|
||
<view>
|
||
<text style="font-size: 24rpx;">售价：
|
||
<text>{{getPrice(item)}}</text>
|
||
</text>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
|
||
<view class="goods-item-content-footer-btn">
|
||
<nut-button
|
||
v-if="!goods_cart_ids.includes(item.goods_id) && !user_goods_cart_ids.includes(item.goods_id)"
|
||
size="small" type="primary" @click="onEdit(item)">调价</nut-button>
|
||
<nut-button size="small" plain v-else>机器已锁定</nut-button>
|
||
</view>
|
||
|
||
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</z-paging>
|
||
|
||
|
||
</view>
|
||
|
||
</view>
|
||
|
||
|
||
|
||
<!-- 弹出 -->
|
||
<nut-popup :custom-style="{ height: '45%' }" v-model:visible="showEdit" position="bottom" safe-area-inset-bottom
|
||
@close="onClosePopup">
|
||
<view>
|
||
<view class="goods-popup">
|
||
<view class="goods-card">
|
||
<view class="goods-card-left">
|
||
<image mode="aspectFill" :src="getImg(detail)" @click="showGoodsImages(detail)" />
|
||
</view>
|
||
<view class="goods-card-right">
|
||
<view class="goods-card-right-top">
|
||
<nut-tag custom-color="#1a1a1a">{{ detail?.goods_house?.degree?.degree_name }}</nut-tag>
|
||
<view> {{detail?.goods_house?.goods_name}}</view>
|
||
</view>
|
||
<view class="goods-card-right-middle">
|
||
{{detail?.goods_house?.content}}
|
||
</view>
|
||
<view>
|
||
<text style="font-size: 24rpx;">原价：
|
||
<text>{{detail?.goods_house?.goods_price}}</text>
|
||
</text>
|
||
</view>
|
||
<view>
|
||
<text style="font-size: 24rpx;">售价：
|
||
<text>{{getPrice(detail)}}</text>
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="goods-card-edit">
|
||
<view class="row">
|
||
<view class="field">
|
||
<text class="label">加价金额/百分比</text>
|
||
<nut-input v-model="tempSingleRule.val" type="number" placeholder="0"
|
||
input-align="right" />
|
||
</view>
|
||
<view class="field">
|
||
<text class="label">加价类型</text>
|
||
<nut-radio-group v-model="tempSingleRule.val_type" direction="horizontal">
|
||
<nut-radio :label="1">固定加价</nut-radio>
|
||
<nut-radio :label="2">百分比加价</nut-radio>
|
||
</nut-radio-group>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="wechat-img-inner" style="margin-top: 60rpx; padding: 0rpx 80rpx;">
|
||
<nut-button type="primary" block @click="saveSingleRule()">
|
||
调整价格
|
||
</nut-button>
|
||
</view>
|
||
</view>
|
||
</nut-popup>
|
||
|
||
|
||
|
||
<!-- 整仓调价 -->
|
||
<view style="padding: 20rpx;" v-if="tabIndex==2">
|
||
<view>
|
||
<h2 class="switch-lab">
|
||
是否开启整仓调价
|
||
</h2>
|
||
<nut-cell>
|
||
<nut-switch v-model="isWarehouse" @change="onIsWarehouseChange" />
|
||
</nut-cell>
|
||
<view class="warehouse">
|
||
<view class="warehouse-edit">
|
||
<view class="row">
|
||
<view class="field">
|
||
<text class="label">加价金额/百分比</text>
|
||
<nut-input v-model="warehouseRule.val" type="number" placeholder="0"
|
||
input-align="right" />
|
||
</view>
|
||
<view class="field">
|
||
<text class="label">加价类型</text>
|
||
<nut-radio-group v-model="warehouseRule.val_type" direction="horizontal">
|
||
<nut-radio :label="1">固定加价</nut-radio>
|
||
<nut-radio :label="2">百分比加价</nut-radio>
|
||
</nut-radio-group>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view style="margin-top: 60rpx; padding: 0rpx 80rpx;">
|
||
<nut-button type="primary" block @click="saveWarehouseRule()">
|
||
保存规则
|
||
</nut-button>
|
||
</view>
|
||
<view style="margin-top: 60rpx; padding: 0rpx 80rpx;">
|
||
注意：如果开启了整仓调价，那么区间调价将不会生效（不影响单机调价），如果需要区间调价请关闭整仓调价。
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import {
|
||
onMounted,
|
||
reactive,
|
||
computed,
|
||
ref
|
||
} from 'vue'
|
||
import {
|
||
onLoad
|
||
} from '@dcloudio/uni-app';
|
||
import {
|
||
fetchSetPriceRules,
|
||
fetchGetPriceRules,
|
||
fetchGetConfig,
|
||
fetchSetConfig,
|
||
} from '@/api/config';
|
||
|
||
|
||
import {
|
||
houseFetchGoodsList,
|
||
houseFetchFilterParmas,
|
||
} from '@/api/house_goods';
|
||
|
||
|
||
onLoad((options) => {})
|
||
|
||
const getImg = (goods) => {
|
||
const url = goods?.goods_house?.image?.[0]?.file_path
|
||
return url ? url + '?imageView2/1/w/200/h/200' : ''
|
||
}
|
||
|
||
// 获取配置
|
||
const getConfig = () => {
|
||
fetchGetConfig().then(res => {
|
||
console.log('getConfig=====>', res)
|
||
isWarehouse.value = res.appConfig.is_warehouse == 1
|
||
})
|
||
}
|
||
|
||
// 设置配置
|
||
const setConfig = () => {
|
||
let form = {
|
||
is_warehouse: Number(isWarehouse.value)
|
||
}
|
||
fetchSetConfig(form).then(res => {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '操作成功'
|
||
})
|
||
})
|
||
}
|
||
|
||
|
||
|
||
|
||
const getPrice = (goods) => {
|
||
const list = singleRule.value || singleRule; // 兼容 ref 和 reactive
|
||
// 根据 product_id 找对应规则
|
||
const rule = list.find(item => item.product_id === goods.goods_id);
|
||
if (!rule) {
|
||
return "未单独设置";
|
||
}
|
||
const basePrice = Number(goods.goods_price);
|
||
const val = Number(rule.val);
|
||
let finalPrice = basePrice;
|
||
// val_type 处理
|
||
if (rule.val_type == 1) {
|
||
// 固定加价
|
||
finalPrice = basePrice + val;
|
||
} else if (rule.val_type == 2) {
|
||
// 按百分比加
|
||
finalPrice = basePrice + (basePrice * val / 100);
|
||
}
|
||
// 保留两位小数
|
||
return finalPrice.toFixed(2);
|
||
|
||
}
|
||
|
||
|
||
|
||
// zp
|
||
const paging = ref(null);
|
||
// 商品列表
|
||
const dataList = ref([]);
|
||
// 用户购物车商品列表
|
||
const user_goods_cart_ids = ref([]);
|
||
// 全部购物车商品列表
|
||
const goods_cart_ids = ref([]);
|
||
// 价格排序
|
||
const selectPriceSortRef = ref(null);
|
||
// 成色选择
|
||
const selectDegreeRef = ref(null);
|
||
// 机型选择
|
||
const selectProductRef = ref(null)
|
||
const state = reactive({
|
||
type_params: [], // 产品类型
|
||
drop_down_options: [], // 产品类型下的品牌列表
|
||
o_drop_down_options: [],
|
||
// 价格排序
|
||
price_sort_params: [{
|
||
text: '默认排序',
|
||
value: ''
|
||
},
|
||
{
|
||
text: '价格升序',
|
||
value: 'ascend'
|
||
},
|
||
{
|
||
text: '价格降序',
|
||
value: 'descend'
|
||
}
|
||
],
|
||
// 成色所有选项
|
||
degree_params: [],
|
||
price_sort: '',
|
||
price_sort_name: "默认排序",
|
||
degree_ids: [],
|
||
degree_name: "成色",
|
||
product_name: "机型",
|
||
type_id: 1, // 产品类型id 默认 1 手机
|
||
type_name: '手机',
|
||
brand_id: 0, // 品牌id // 默认 0 全部
|
||
brand_name: '全部',
|
||
product_ids: [0], // 机型ids 默认 0 全部
|
||
// search_val: '', // 搜索
|
||
});
|
||
|
||
|
||
|
||
|
||
// 机型重置
|
||
const onResetProduct = () => {
|
||
console.log("重置产品");
|
||
state.type_id = 1
|
||
state.type_name = '手机'
|
||
state.brand_id = 0
|
||
state.brand_name = '全部'
|
||
state.product_ids = [0]
|
||
state.product_name = '机型'
|
||
}
|
||
// 机型确定
|
||
|
||
const onConfirmProduct = () => {
|
||
console.log("当前产品类型", {
|
||
"type_id": state.type_id,
|
||
"type_name": state.type_name,
|
||
"brand_id": state.brand_id,
|
||
"brand_name": state.brand_name,
|
||
"product_ids": state.product_ids,
|
||
});
|
||
selectProductRef.value?.toggle(false);
|
||
// 4. 刷新数据
|
||
paging.value.reload();
|
||
}
|
||
// 选择机型
|
||
const selectProduct = (product) => {
|
||
if (product.value === 0) {
|
||
state.product_ids = [0]
|
||
} else {
|
||
state.product_ids = state.product_ids.filter(e => e != 0)
|
||
// 判断是否存在
|
||
const index = state.product_ids.indexOf(product.value);
|
||
if (index > -1) {
|
||
state.product_ids.splice(index, 1); // 存在则删除
|
||
if (state.product_ids.length === 0) {
|
||
state.product_ids = [0]
|
||
}
|
||
} else {
|
||
state.product_ids.push(product.value); // 新增
|
||
}
|
||
}
|
||
console.log(product);
|
||
}
|
||
|
||
const productOptions = computed(() => {
|
||
return state?.o_drop_down_options[state.type_id]?.children[state.brand_id].children
|
||
})
|
||
|
||
// 选择品牌
|
||
const selectBrand = (brand) => {
|
||
console.log(brand);
|
||
// 选中的品牌id
|
||
state.brand_id = brand.value;
|
||
state.brand_name = brand.label
|
||
// 品牌下的产品ids
|
||
state.product_ids = [0];
|
||
|
||
state.product_name = brand.label
|
||
|
||
}
|
||
// 选择type
|
||
const selectType = (type) => {
|
||
console.log(type);
|
||
// 选中产品类型id
|
||
state.type_id = type.type_id;
|
||
state.type_name = type.name;
|
||
// 选中的品牌id
|
||
state.brand_id = 0;
|
||
state.brand_name = '全部';
|
||
// 品牌下的产品ids
|
||
state.product_ids = [0];
|
||
}
|
||
|
||
// 选择价格排序
|
||
const selectPriceSort = (item) => {
|
||
if (state.price_sort !== item.value) {
|
||
state.price_sort = item.value
|
||
state.price_sort_name = item.text
|
||
} else {
|
||
state.price_sort_name = '默认排序'
|
||
state.price_sort = ''
|
||
}
|
||
selectPriceSortRef.value?.toggle(false);
|
||
// 4. 刷新数据
|
||
paging.value.reload();
|
||
};
|
||
|
||
// 选择成色
|
||
const selectDegree = (item) => {
|
||
const index = state.degree_ids.indexOf(item.value);
|
||
if (index > -1) {
|
||
state.degree_ids.splice(index, 1);
|
||
} else {
|
||
state.degree_ids.push(item.value);
|
||
}
|
||
if (state.degree_ids.length > 0) {
|
||
state.degree_name = '已选' + state.degree_ids.length.toString() + '项'
|
||
} else {
|
||
state.degree_name = '成色'
|
||
}
|
||
}
|
||
|
||
// 重置选择成色
|
||
const onResetDegree = () => {
|
||
state.degree_ids = [];
|
||
state.degree_name = '成色'
|
||
selectDegreeRef.value?.toggle(false);
|
||
// 4. 刷新数据
|
||
paging.value.reload();
|
||
}
|
||
// 确认选择成色
|
||
const onConfirmDegree = () => {
|
||
if (state.degree_ids.length > 0) {
|
||
state.degree_name = '已选' + state.degree_ids.length.toString() + '项'
|
||
} else {
|
||
state.degree_name = '成色'
|
||
}
|
||
selectDegreeRef.value?.toggle(false);
|
||
// 4. 刷新数据
|
||
paging.value.reload();
|
||
}
|
||
|
||
|
||
// 获取列表
|
||
const queryList = (pageNo, pageSize) => {
|
||
const params = {
|
||
pageSize,
|
||
page: pageNo,
|
||
price_sort: state.price_sort,
|
||
degree_ids: state.degree_ids,
|
||
type_id: state.type_id,
|
||
brand_id: state.brand_id,
|
||
product_ids: state.product_ids,
|
||
search: state.search_val,
|
||
}
|
||
houseFetchGoodsList(params).then(res => {
|
||
console.log(res);
|
||
paging.value.complete(res.list);
|
||
user_goods_cart_ids.value = res.user_cart_goods_ids;
|
||
goods_cart_ids.value = res.cart_goods_ids;
|
||
|
||
// uni.setTabBarBadge({
|
||
// index: 1,
|
||
// text: user_goods_cart_ids.value.length.toString()
|
||
// })
|
||
|
||
}).catch(res => {
|
||
paging.value.complete(false);
|
||
user_goods_cart_ids.value = [];
|
||
goods_cart_ids.value = [];
|
||
});
|
||
};
|
||
|
||
|
||
|
||
|
||
onMounted(() => {
|
||
init();
|
||
})
|
||
|
||
|
||
const init = () => {
|
||
console.log('init');
|
||
|
||
// 获取配置
|
||
getConfig()
|
||
|
||
// 获取全部调价规则
|
||
fetchGetPriceRules().then(res => {
|
||
console.log('res', res);
|
||
// 区间调价
|
||
rangeRule.value = res?.range ?? [];
|
||
// 单机调价
|
||
singleRule.value = res?.single ?? [];
|
||
// 整仓调价
|
||
Object.assign(warehouseRule, res?.warehouse?.[0] ?? {
|
||
val: '',
|
||
val_type: 1,
|
||
})
|
||
})
|
||
|
||
|
||
// 加载默认筛选项内容
|
||
houseFetchFilterParmas().then(res => {
|
||
console.log(res);
|
||
// 处理成色
|
||
let degree_params = res.degree_list;
|
||
state.degree_params = degree_params.reduce((it, cit) => {
|
||
it.push({
|
||
text: cit.degree_name,
|
||
value: cit.degree_id
|
||
});
|
||
return it;
|
||
}, state.degree_params) || [];
|
||
// 产品类型
|
||
state.type_params = res.type_list
|
||
// 产品下品牌列表
|
||
state.drop_down_options = res.drop_down_options
|
||
state.o_drop_down_options = res.o_drop_down_options
|
||
})
|
||
|
||
|
||
}
|
||
|
||
|
||
|
||
// 显示商品图片
|
||
const showGoodsImages = (goods) => {
|
||
console.log(goods.goods_house);
|
||
uni.previewImage({
|
||
// current: index, // 指定当前显示的图片索引
|
||
urls: goods?.goods_house?.image.map(e => {
|
||
return e.file_path
|
||
}),
|
||
});
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
// TAB 选项
|
||
const tabList = ref(['区间调价', '单机调价', '整仓调价'])
|
||
const tabIndex = ref(0)
|
||
const tabsChange = (index) => {
|
||
tabIndex.value = index
|
||
}
|
||
|
||
// 是否开启整仓调价
|
||
const isWarehouse = ref(false)
|
||
|
||
// 整仓规则
|
||
const warehouseRule = reactive({
|
||
val: '',
|
||
val_type: 1,
|
||
})
|
||
|
||
// 是否开启整仓调价
|
||
const onIsWarehouseChange = (val) => {
|
||
console.log(isWarehouse.value);
|
||
setConfig();
|
||
}
|
||
|
||
// 保存整仓规则
|
||
const saveWarehouseRule = () => {
|
||
console.log(warehouseRule);
|
||
let data = {
|
||
warehouseRule: {
|
||
...warehouseRule
|
||
}
|
||
}
|
||
console.log(data);
|
||
submit(data, 3);
|
||
}
|
||
//
|
||
|
||
|
||
|
||
|
||
// 单个商品规格列表
|
||
const singleRule = ref([])
|
||
// 单个商品临时规则
|
||
const tempSingleRule = reactive({
|
||
val: '',
|
||
val_type: 1,
|
||
product_id: 0
|
||
})
|
||
const showEdit = ref(false)
|
||
const detail = reactive({})
|
||
const onEdit = (goods) => {
|
||
console.log("----", goods);
|
||
Object.assign(detail, goods)
|
||
showEdit.value = true
|
||
console.log("----", detail.value);
|
||
}
|
||
const onClosePopup = () => {
|
||
// 重置 tempSingleRule
|
||
Object.assign(detail, {})
|
||
Object.assign(tempSingleRule, {
|
||
val: '',
|
||
val_type: 1,
|
||
product_id: 0
|
||
})
|
||
showEdit.value = false
|
||
console.log("关闭");
|
||
};
|
||
|
||
|
||
// 保存单个商品价格规则
|
||
const saveSingleRule = () => {
|
||
tempSingleRule.product_id = detail.goods_id
|
||
console.log('tempSingleRule.value', tempSingleRule);
|
||
let data = {
|
||
singleRule: {
|
||
...tempSingleRule
|
||
}
|
||
}
|
||
console.log(data);
|
||
submit(data, 2);
|
||
}
|
||
|
||
|
||
|
||
// 价格区间规则列表
|
||
const rangeRule = ref([])
|
||
// 添加规则
|
||
const addRule = () => {
|
||
console.log(rangeRule.value);
|
||
rangeRule.value.unshift({
|
||
min_price: '',
|
||
max_price: '',
|
||
val: '',
|
||
val_type: 1
|
||
})
|
||
}
|
||
// 删除规则
|
||
const removeRule = (index) => {
|
||
rangeRule.value.splice(index, 1)
|
||
}
|
||
// 保存区间调价
|
||
const saveRangeRule = () => {
|
||
console.log(rangeRule.value);
|
||
let data = {
|
||
rangeRule: rangeRule.value
|
||
}
|
||
console.log(data);
|
||
submit(data, 1);
|
||
}
|
||
|
||
|
||
// 提交规则
|
||
const submit = (data, type) => {
|
||
fetchSetPriceRules(data).then(res => {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '规则配置成功'
|
||
})
|
||
// 获取全部调价规则
|
||
fetchGetPriceRules().then(res => {
|
||
console.log('res', res);
|
||
// 区间调价
|
||
rangeRule.value = res?.range ?? [];
|
||
// 单机调价
|
||
singleRule.value = res?.single ?? [];
|
||
// 整仓调价
|
||
Object.assign(warehouseRule, res?.warehouse?.[0] ?? {
|
||
val: '',
|
||
val_type: 1,
|
||
})
|
||
|
||
|
||
if (type == 1) {
|
||
|
||
}
|
||
if (type == 2) {
|
||
onClosePopup()
|
||
paging.value.refresh();
|
||
}
|
||
if (type == 3) {
|
||
getConfig()
|
||
}
|
||
})
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.page-content {
|
||
height: 100vh;
|
||
display: flex;
|
||
flex-direction: column;
|
||
--nut-menu-bar-box-shadow: none;
|
||
--nut-menu-item-content-padding: 20rpx;
|
||
--nut-menu-item-content-max-height: 900rpx;
|
||
|
||
}
|
||
|
||
/* Tabs 固定在顶部 */
|
||
.tabs-wrapper {
|
||
position: sticky;
|
||
top: 0;
|
||
z-index: 999;
|
||
background-color: #fff;
|
||
}
|
||
|
||
/* 滚动区域撑满剩余高度 */
|
||
.scroll-area {
|
||
flex: 1;
|
||
background-color: #f2f3f5;
|
||
/* 灰色背景 */
|
||
// padding: 20rpx;
|
||
}
|
||
|
||
.top-bar {
|
||
background: #fff;
|
||
padding: 20rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
border-top: 1px solid #eee;
|
||
// position: sticky;
|
||
// bottom: 0;
|
||
// z-index: 999;
|
||
}
|
||
|
||
/* 规则样式 */
|
||
.rule-item {
|
||
background: #fff;
|
||
padding: 20rpx;
|
||
margin: 20rpx;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.row {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
.field {
|
||
width: 48%;
|
||
}
|
||
|
||
.label {
|
||
font-size: 26rpx;
|
||
color: #333;
|
||
margin-bottom: 6rpx;
|
||
display: inline-block;
|
||
}
|
||
|
||
.delete-btn {
|
||
text-align: right;
|
||
margin-top: 10rpx;
|
||
}
|
||
|
||
// .add-btn {
|
||
// text-align: center;
|
||
// margin-top: 30rpx;
|
||
// }
|
||
|
||
|
||
|
||
|
||
|
||
|
||
:deep(.titleClass) .nut-menu__title-text {
|
||
font-size: 30rpx;
|
||
font-weight: bold;
|
||
color: black;
|
||
}
|
||
|
||
.filter-types {
|
||
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
overflow: auto;
|
||
gap: 10rpx;
|
||
padding: 10rpx;
|
||
// position: fixed;
|
||
// top: 0;
|
||
height: 60rpx;
|
||
// z-index: 9999;
|
||
background-color: #fff;
|
||
border-bottom: 2rpx solid gainsboro;
|
||
border-top: 2rpx solid gainsboro;
|
||
|
||
.filter-type-inner {
|
||
align-items: center;
|
||
background-color: rgba(0, 0, 0, .05);
|
||
border-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
display: -webkit-flex;
|
||
display: -ms-flexbox;
|
||
display: flex;
|
||
flex: 0 0 auto;
|
||
font-size: 28rpx;
|
||
gap: 15rpx;
|
||
padding: 10rpx 20rpx;
|
||
|
||
// image {
|
||
// height: 22px;
|
||
// width: 22px;
|
||
// }
|
||
}
|
||
|
||
.filter-type-inner.active {
|
||
background-color: rgba(250, 44, 25, .1);
|
||
color: var(--nutui-color-primary);
|
||
}
|
||
}
|
||
|
||
.tabs-container {
|
||
display: flex;
|
||
|
||
.tab-pane-inner {
|
||
height: 600rpx;
|
||
}
|
||
|
||
.tabs-inner {
|
||
overflow-y: scroll;
|
||
height: 600rpx;
|
||
width: 160rpx;
|
||
background-color: #F5F5F5;
|
||
|
||
.tab-inner {
|
||
display: flex;
|
||
height: 60rpx;
|
||
padding: 10rpx;
|
||
font-size: 28rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
background: #F5F5F5;
|
||
|
||
text {
|
||
width: 100%;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
text-align: center;
|
||
}
|
||
}
|
||
|
||
.tab-inner-active {
|
||
// background: #FFF;
|
||
background-color: rgba(250, 44, 25, .1);
|
||
color: var(--nutui-color-primary);
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
|
||
.degree-inner {
|
||
display: flex;
|
||
flex: 1;
|
||
flex-wrap: wrap;
|
||
// gap: 20rpx;
|
||
gap: 10rpx;
|
||
// padding: 11px;
|
||
width: 100%;
|
||
margin-bottom: 60rpx;
|
||
}
|
||
|
||
.degree-item {
|
||
align-items: center;
|
||
background-color: rgba(0, 0, 0, .05);
|
||
border-radius: 10rpx;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
flex: 0 0 auto;
|
||
font-size: 26rpx;
|
||
gap: 10rpx;
|
||
justify-content: center;
|
||
min-height: 80rpx;
|
||
width: calc(50% - 10rpx);
|
||
}
|
||
|
||
.degree-item.active {
|
||
background-color: rgba(250, 44, 25, .1);
|
||
color: var(--nutui-color-primary);
|
||
}
|
||
|
||
.product-btns {
|
||
display: flex;
|
||
width: 100%;
|
||
padding: 20rpx 0;
|
||
|
||
// border-bottom: 2rpx solid gainsboro;
|
||
// border-top: 2rpx solid gainsboro;
|
||
|
||
.reset {
|
||
flex: 1;
|
||
|
||
}
|
||
|
||
.confirm {
|
||
flex: 2;
|
||
|
||
}
|
||
|
||
}
|
||
|
||
.degree-btns {
|
||
display: flex;
|
||
width: 100%;
|
||
|
||
.reset {
|
||
flex: 1;
|
||
/* 重置按钮占 1 份 */
|
||
}
|
||
|
||
.confirm {
|
||
flex: 2;
|
||
/* 确认按钮占 2 份 */
|
||
}
|
||
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
.goods-item {
|
||
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 20rpx;
|
||
background-color: #ffffff;
|
||
// border-radius: 20rpx;
|
||
margin-bottom: 20rpx;
|
||
gap: 20rpx;
|
||
|
||
.goods-item-image {
|
||
width: 170rpx;
|
||
height: 170rpx;
|
||
|
||
.goods-item-image-img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.goods-item-content {
|
||
// width: 100%;
|
||
display: flex;
|
||
flex: 1;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
/* 首尾贴边，中间均分 */
|
||
|
||
// gap: 15px;
|
||
.goods-item-content-header {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 10rpx 0;
|
||
gap: 20rpx;
|
||
}
|
||
|
||
.goods-item-content-body {
|
||
padding: 10rpx 0;
|
||
|
||
.goods-item-content-body-desc {
|
||
color: #7c7c7c;
|
||
font-size: 26rpx;
|
||
}
|
||
}
|
||
|
||
.goods-item-content-footer {
|
||
padding: 10rpx 0;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
// width: 100%;
|
||
// flex-direction: row;
|
||
|
||
.goods-item-content-footer-btn {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
gap: 10rpx;
|
||
|
||
.share-btn {
|
||
border-radius: 50rpx;
|
||
border: 2rpx solid red;
|
||
font-size: 26rpx;
|
||
align-items: center;
|
||
height: 54rpx;
|
||
color: red;
|
||
display: flex;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
/** 商品弹出改价 **/
|
||
.goods-popup {
|
||
|
||
.goods-card-edit {
|
||
background: #fff;
|
||
padding: 20rpx;
|
||
margin: 20rpx;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 20rpx;
|
||
|
||
.row {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
.field {
|
||
width: 48%;
|
||
}
|
||
|
||
.label {
|
||
font-size: 26rpx;
|
||
color: #333;
|
||
margin-bottom: 6rpx;
|
||
display: inline-block;
|
||
}
|
||
}
|
||
|
||
.goods-card {
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 20rpx;
|
||
background-color: #ffffff;
|
||
margin-bottom: 20rpx;
|
||
|
||
.goods-card-left {
|
||
width: 190rpx;
|
||
height: 190rpx;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.goods-card-right {
|
||
flex: 1;
|
||
padding-left: 20rpx;
|
||
|
||
.goods-card-right-top {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 10rpx 0;
|
||
gap: 20rpx;
|
||
}
|
||
|
||
.goods-card-right-middle {
|
||
margin-top: 10rpx;
|
||
margin-bottom: 10rpx;
|
||
color: #7c7c7c;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.goods-card-right-bottom {
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
/******/
|
||
.switch-lab {
|
||
padding: 0 10px;
|
||
margin-bottom: 10px;
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #909ca4;
|
||
}
|
||
|
||
.warehouse {
|
||
|
||
.warehouse-edit {
|
||
background: #fff;
|
||
padding: 20rpx;
|
||
margin: 20rpx;
|
||
border-radius: 12rpx;
|
||
margin-bottom: 20rpx;
|
||
|
||
.row {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
.field {
|
||
width: 48%;
|
||
}
|
||
|
||
.label {
|
||
font-size: 26rpx;
|
||
color: #333;
|
||
margin-bottom: 6rpx;
|
||
display: inline-block;
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
</style> |