|
|
@@ -0,0 +1,289 @@
|
|
|
+<template>
|
|
|
+ <div class="y-container">
|
|
|
+ <prod-temp ref="prod" :noQuery="true" rowKey="itemid" size="small" :columns="utils.TBLayout('exportTable')" :param="param" :hideBorder="true" @onSelect="onProdSelect">
|
|
|
+ <template #operation>
|
|
|
+ <a-input class="search-input" v-model:value="search" @keyup.enter="onSearch" placeholder="搜索商品"></a-input>
|
|
|
+ </template>
|
|
|
+ <template #tb_cell="{data}">
|
|
|
+ <template v-if="data.column.dataIndex == 'image'">
|
|
|
+ <div class="image-panel">
|
|
|
+ <a-image
|
|
|
+ :width="80"
|
|
|
+ :src="data.record.attinfos[0]?data.record.attinfos[0].url:''"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-if="data.column.dataIndex == 'qty'">
|
|
|
+ <a-input-number style="width:100px" id="inputNumber" v-model:value="data.record.favoritesqty" :min="data.record.orderminqty" :step="data.record.orderaddqty" @change="saveData(data.record)"/>
|
|
|
+ </template>
|
|
|
+ <template v-if="data.column.dataIndex == 'amount'">
|
|
|
+ <span class="color-red">¥ {{utils.formatAmount(data.record.favoritesqty * data.record.gradeprice)}}</span>
|
|
|
+ </template>
|
|
|
+ <template v-if="data.column.dataIndex === 'length' && data.record.iscustomsize == 1">
|
|
|
+ <a-select v-if="data.record.lengthschemedetails.length > 0" v-model:value="data.record.favoriteslength" style="width: 150px" placeholder="选择长度" @change="saveData(data.record)">
|
|
|
+ <a-select-option v-for="item in data.record.lengthschemedetails" :key="item.sa_sizeschemedetailid" :value="item.num">{{item.num}}</a-select-option>
|
|
|
+ </a-select>
|
|
|
+ <a-input v-else style="width:200px;" v-model:value="data.record.favoriteslength" :placeholder="`${data.record.lengthmin}-${data.record.lengthmax}`" @blur="validInput(data.record,data.record.lengthmin,data.record.lengthmax,'length')">
|
|
|
+ </a-input>
|
|
|
+ </template>
|
|
|
+ <template v-if="data.column.dataIndex === 'width' && data.record.iscustomsize == 1">
|
|
|
+ <a-select v-if="data.record.widthschemedetails.length > 0" v-model:value="data.record.favoriteswidth" style="width: 150px" placeholder="选择宽度" @change="saveData(data.record)">
|
|
|
+ <a-select-option v-for="item in data.record.widthschemedetails" :key="item.sa_sizeschemedetailid" :value="item.num">{{item.num}}</a-select-option>
|
|
|
+ </a-select>
|
|
|
+ <a-input v-else style="width:200px;" v-model:value="data.record.favoriteswidth" :placeholder="`${data.record.widthmin}-${data.record.widthmax}`" @blur="validInput(data.record,data.record.widthmin,data.record.widthmax,'width')">
|
|
|
+ </a-input>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ </prod-temp>
|
|
|
+ <div class="submit-panel">
|
|
|
+ <a-button style="margin-left:10px" type="default" :disabled="selectProd.length === 0" @click="deleteProd">取消收藏当前选中商品</a-button>
|
|
|
+ <p><span style="margin-right:20px">当前选中了<b class="color-red"> {{selectProd.length}} </b>条商品</span>合计:<b class="color-red sumAmount">{{utils.formatAmount(sum)}}</b></p>
|
|
|
+ <div class="submit-btn" @click="onSubmit">创建订单</div>
|
|
|
+ <div class="shopcart-btn" @click="addCart">加入购物车</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+ import ProdTemp from "@/template/normalTable/index.vue"
|
|
|
+ import utils from "@/utils/utils"
|
|
|
+ import Api from "@/api/api"
|
|
|
+ import {ref,computed,createVNode,onActivated} from 'vue'
|
|
|
+ import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
|
|
+ import { message } from 'ant-design-vue';
|
|
|
+ import { Modal } from 'ant-design-vue';
|
|
|
+ import { useRouter } from "vue-router"
|
|
|
+ import { useBaseStore } from '@/stores/modules/base'
|
|
|
+ import { storeToRefs } from 'pinia'
|
|
|
+ const base = useBaseStore()
|
|
|
+ const router = useRouter()
|
|
|
+ const prod = ref()
|
|
|
+ const search = ref('')
|
|
|
+ const selectProd = ref([])
|
|
|
+ const param = ref({id:20231121145103,content:{istool:0,pageNumber:1,pageSize:20,where:{condition:search}}})
|
|
|
+ const time = ref(null)
|
|
|
+ const sum = computed(()=>{
|
|
|
+ let total = selectProd.value.reduce((accumulator, currentValue)=>accumulator + (currentValue.gradeprice * currentValue.favoritesqty), 0)
|
|
|
+ return total
|
|
|
+ })
|
|
|
+ const fieldSame = computed(()=>{
|
|
|
+ let _isFieldSame = selectProd.value.some(item=>item.tradefield_shoppingcart !== selectProd.value[0].tradefield_shoppingcart)
|
|
|
+
|
|
|
+ if (_isFieldSame) return message.error('存在不同领域的商品');
|
|
|
+
|
|
|
+ return _isFieldSame
|
|
|
+ })
|
|
|
+ const onProdSelect = (val)=>{
|
|
|
+ selectProd.value = val
|
|
|
+ }
|
|
|
+ const deleteProd = async (data)=>{
|
|
|
+ const res = await Api.requested({
|
|
|
+ "id": 20231122102803,
|
|
|
+ "content": {
|
|
|
+ "itemids": selectProd.value.map(element => {
|
|
|
+ return element.itemid
|
|
|
+ }),
|
|
|
+ "iscollection":false
|
|
|
+ },
|
|
|
+ })
|
|
|
+ utils.message(res,'成功',()=>{
|
|
|
+ prod.value.listData()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ const onSubmit = ()=> {
|
|
|
+ if (!checkIscustomsize()) return false
|
|
|
+ if (fieldSame.value) return false
|
|
|
+ if (selectProd.value.length == 0) return message.error('未选择商品无法创建订单')
|
|
|
+ Modal.confirm({
|
|
|
+ title:'生成订单',
|
|
|
+ content: `当前选中${selectProd.value.length}个商品`,
|
|
|
+ icon: createVNode(ExclamationCircleOutlined),
|
|
|
+ okText: '确认',
|
|
|
+ cancelText: '取消',
|
|
|
+ async onOk() {
|
|
|
+ const res = await Api.requested({
|
|
|
+ "id": 20221128183202,
|
|
|
+ "content": {
|
|
|
+ "type":'标准订单',
|
|
|
+ "tradefield":selectProd.value[0].tradefield[0].tradefield,
|
|
|
+ "items": selectProd.value.map(e=>{
|
|
|
+ return {
|
|
|
+ "sa_orderitemsid": 0, //写死0
|
|
|
+ "itemid": e.itemid, //商品ID
|
|
|
+ "sa_brandid": e.sa_brandid,
|
|
|
+ "sa_shoppingcartid":e.sa_shoppingcartid,
|
|
|
+ "qty": e.favoritesqty ? e.favoritesqty:e.favoritesqty, //数量
|
|
|
+ "length": e.favoriteslength,
|
|
|
+ "width": e.favoriteswidth
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ utils.message(res,'提交成功',()=>{
|
|
|
+ base.shopCartNum()
|
|
|
+ prod.value.listData()
|
|
|
+ Modal.confirm({
|
|
|
+ title:'创建成功',
|
|
|
+ content: `订单创建成功,是否跳转至该订单!`,
|
|
|
+ icon: createVNode(ExclamationCircleOutlined),
|
|
|
+ okText: '确认',
|
|
|
+ cancelText: '取消',
|
|
|
+ onOk() {
|
|
|
+ router.push({path:'/agent_orderDetails',query:{id:res.data.sa_orderid}})
|
|
|
+ },
|
|
|
+ cancelText: '取消',
|
|
|
+ onCancel() {
|
|
|
+ Modal.destroyAll();
|
|
|
+ },
|
|
|
+ });
|
|
|
+ })
|
|
|
+ },
|
|
|
+ cancelText: '取消',
|
|
|
+ onCancel() {
|
|
|
+ Modal.destroyAll();
|
|
|
+ },
|
|
|
+ });
|
|
|
+ }
|
|
|
+ const onSearch = ()=>{
|
|
|
+ param.value.content.pageNumber = 1
|
|
|
+ prod.value.listData()
|
|
|
+ }
|
|
|
+ const onSave = async (val)=>{
|
|
|
+ const res = await Api.requested({
|
|
|
+ "id": 20220924104302,
|
|
|
+ "content": val
|
|
|
+ })
|
|
|
+ utils.message(res,'修改成功')
|
|
|
+ }
|
|
|
+ const checkIscustomsize = (val)=>{
|
|
|
+ let bool = true
|
|
|
+ selectProd.value.map(e=>{
|
|
|
+ if (e.iscustomsize == 1 && (!e.favoriteslength || !e.favoriteswidth)) {
|
|
|
+ bool = false
|
|
|
+ message.error(e.itemname + '定制信息有误,请检查!')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return bool
|
|
|
+ }
|
|
|
+ const validInput = async (record,min,max,type)=>{
|
|
|
+ if (record[type] > max) {
|
|
|
+ record[type] = max
|
|
|
+ } else if (record[type] < min) {
|
|
|
+ record[type] = min
|
|
|
+ } else {
|
|
|
+ record[type] = record[type]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ const saveData = (data,type)=>{
|
|
|
+ if(time.value !== null){
|
|
|
+ clearTimeout(time.value);
|
|
|
+ }
|
|
|
+ time.value = setTimeout(() => {
|
|
|
+ const save = async ()=>{
|
|
|
+ const res = await Api.requested({
|
|
|
+ "id": 20231121143403,
|
|
|
+ "version":1,
|
|
|
+ "content": {
|
|
|
+ "itemid":data.itemid,
|
|
|
+ "length":data.favoriteslength,
|
|
|
+ "qty":data.favoritesqty,
|
|
|
+ "width":data.favoriteswidth,
|
|
|
+ "iscollection":true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ utils.validateInputNumber(data.orderminqty,data.favoritesqty,data.orderaddqty).then(res=>{
|
|
|
+ data.favoritesqty = res
|
|
|
+ save()
|
|
|
+ })
|
|
|
+ },500)
|
|
|
+
|
|
|
+ }
|
|
|
+ const addCart = async ()=> {
|
|
|
+ if (!checkIscustomsize()) return false
|
|
|
+ let res = await Api.requested({
|
|
|
+ "id": 20231024110003,
|
|
|
+ "content": {
|
|
|
+ "items":selectProd.value.map(e=>{
|
|
|
+ return {
|
|
|
+ "sa_brandid": e.brand[0].sa_brandid, //品牌id
|
|
|
+ "itemid": e.itemid, //货品id
|
|
|
+ "qty": e.favoritesqty, //数量
|
|
|
+ "itemno": e.itemno, //货品编号
|
|
|
+ "tradefield": e.tradefield[0].tradefield,
|
|
|
+ "length":e.favoriteslength,
|
|
|
+ "width":e.favoriteswidth
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ })
|
|
|
+ utils.message(res,'添加成功',()=>{
|
|
|
+ })
|
|
|
+ }
|
|
|
+ onActivated (()=>{
|
|
|
+ prod.value.listData()
|
|
|
+ })
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+.submit-panel{
|
|
|
+ position: sticky;
|
|
|
+ bottom:0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border: 1px solid #f1f2f3;
|
|
|
+ overflow: hidden;
|
|
|
+ background: #fff;
|
|
|
+ z-index: 999;
|
|
|
+
|
|
|
+}
|
|
|
+.submit-panel p{
|
|
|
+ flex:1;
|
|
|
+ margin: 0;
|
|
|
+ text-align: right;
|
|
|
+ padding: 0 10px;
|
|
|
+}
|
|
|
+.submit-btn{
|
|
|
+ float: right;
|
|
|
+ padding: 15px 20px;
|
|
|
+ background: red;
|
|
|
+ color:#fff;
|
|
|
+ width: 150px;
|
|
|
+ text-align: center;
|
|
|
+ cursor: pointer;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.shopcart-btn{
|
|
|
+ float: right;
|
|
|
+ padding: 15px 20px;
|
|
|
+ background: #1677ff;
|
|
|
+ color:#fff;
|
|
|
+ width: 150px;
|
|
|
+ text-align: center;
|
|
|
+ cursor: pointer;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.disabled-submit-btn{
|
|
|
+ background: #999;
|
|
|
+}
|
|
|
+.color-red{
|
|
|
+ color: red;
|
|
|
+}
|
|
|
+.sumAmount{
|
|
|
+ font-size: 1.5em;
|
|
|
+ margin-left:10px;
|
|
|
+}
|
|
|
+.search-input{
|
|
|
+ width: 300px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+.image-panel{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-around;
|
|
|
+ height: 100px;
|
|
|
+ width: 100px;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: #f1f2f3;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+</style>
|