vue-cli init
This commit is contained in:
@@ -0,0 +1,475 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="flex-white-plr26 ptb10 mt32 bdb_f5">
|
||||
<text class="mr26">产品名称
|
||||
<text class="redXingh">*</text>
|
||||
</text>
|
||||
<u-input v-model="pName" placeholder="请在此输入产品名称" />
|
||||
</view>
|
||||
<view @click="pickerSelectFun('产品单位')" class="flex-white-plr26 ptb10 bdb_f5">
|
||||
<text class="mr26">产品单位
|
||||
<text class="redXingh">*</text>
|
||||
</text>
|
||||
<u-input v-model="unit" placeholder="请在此输入产品单位" />
|
||||
</view>
|
||||
<view class="flex-white-plr26 ptb10 bdb_f5">
|
||||
<text class="mr26">产品价格
|
||||
<text class="redXingh">*</text>
|
||||
</text>
|
||||
<u-input v-model="price" type="number" placeholder="请在此输入产品价格" />
|
||||
</view>
|
||||
<view @click="pickerSelectFun('产品类型')" class="flex-white-plr26 ptb20 bdb_f5">
|
||||
<text class="mr26">产品类型
|
||||
<text class="redXingh">*</text>
|
||||
</text>
|
||||
<view :class="flName ? '' : 'cBlack'">
|
||||
{{flName ? flName : '请选择'}}
|
||||
<u-icon class="ml26" name="arrow-right" size="40" color="#888888"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="pickerSelectFun('上下架')" class="flex-white-plr26 ptb20 bdb_f5">
|
||||
<text class="mr26">是否上下架
|
||||
<text class="redXingh">*</text>
|
||||
</text>
|
||||
<view :class="isSxJ ? '' : 'cBlack'">
|
||||
{{isSxJ ? isSxJ : '请选择'}}
|
||||
<u-icon class="ml26" name="arrow-right" size="40" color="#888888"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-white-plr26 ptb10 bdb_f5">
|
||||
<text class="mr26">产品销量</text>
|
||||
<u-input v-model="salesNum" type="number" placeholder="请在此输入产品销量" />
|
||||
</view>
|
||||
<view class="flex-white-plr26 ptb10 bdb_f5">
|
||||
<text class="mr26">产品库存</text>
|
||||
<u-input v-model="stock" type="number" placeholder="请在此输入产品库存" />
|
||||
</view>
|
||||
<view class="flex-white-plr26 ptb10 bdb_f5">
|
||||
<text class="mr26">产品编码</text>
|
||||
<u-input v-model="code" placeholder="请在此输入产品编码" />
|
||||
<u-icon @click="scanFun" class="ml26" name="scan" size="44" color="#007aff"></u-icon>
|
||||
</view>
|
||||
<view class="flex-white-plr26-column ptb20 mt32 bdb_f5">
|
||||
<view style="margin-bottom: 8rpx;">
|
||||
<text>产品简述</text>
|
||||
</view>
|
||||
<u-input v-model="describe" type="textarea" :border="true" :height="100" :auto-height="true" />
|
||||
</view>
|
||||
<view class="flex-white-plr26-column ptb20 mt32 bdb_f5">
|
||||
<view style="margin-bottom: 8rpx; display: flex; align-items: center;">
|
||||
<text>产品参数</text>
|
||||
<u-icon @click="addCsFun" name="plus-circle-fill" color="#007aff" size="50" style="margin-left: 16rpx;">
|
||||
</u-icon>
|
||||
</view>
|
||||
<view class="canshuInputRow" v-for="(item, index) in cpCsList" :key="index">
|
||||
<view class="csInput1">
|
||||
<u-input v-model="item.csName" :border="true" placeholder="参数名称" />
|
||||
</view>
|
||||
<view class="csInput2">
|
||||
<u-input v-model="item.csJieShao" :border="true" placeholder="请在此输入参数介绍" />
|
||||
</view>
|
||||
<u-icon @click="deleteCpCsFun(index)" name="close-circle-fill" size="50" color="#ff0000"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-white-plr26-column ptb20 mt32">
|
||||
<view style="margin-bottom: 8rpx;">产品封面图（1张）</view>
|
||||
<u-upload @on-choose-complete="uploadFmChangeFun" @on-remove="fmtRemoeFun" :size-type="siziType" :show-progress="false"
|
||||
:file-list="cpFmtList" :max-size="5 * 1024 * 1024" max-count="1" :auto-upload="false"></u-upload>
|
||||
</view>
|
||||
<view class="flex-white-plr26-column ptb20 mt32">
|
||||
<view style="margin-bottom: 8rpx;">产品轮播图（最多上传5张）</view>
|
||||
<u-upload @on-choose-complete="uploadLbtChangeFun" @on-list-change="fileChangeFun" @on-remove="lbtRemoeFun" :size-type="siziType" :show-progress="false"
|
||||
:file-list="cpLbtList" :max-size="5 * 1024 * 1024" max-count="5" :auto-upload="false"></u-upload>
|
||||
</view>
|
||||
<view class="flex-white-plr26-column ptb20 mt32">
|
||||
<view style="margin-bottom: 8rpx;">产品详情图（最多上传9张）</view>
|
||||
<u-upload @on-choose-complete="uploadXqChangeFun" @on-remove="xqtRemoeFun" :size-type="siziType" :show-progress="false"
|
||||
:file-list="cpXqtList" :max-size="5 * 1024 * 1024" max-count="9" :auto-upload="false"></u-upload>
|
||||
</view>
|
||||
<!--提交按钮-->
|
||||
<view class="submitView">
|
||||
<u-button v-if="!pageType" type="primary" class="submitBtn" :ripple="true" ripple-bg-color="#909399"
|
||||
@click="addXgFun">提交</u-button>
|
||||
<u-button v-if="pageType == 'update'" type="primary" class="submitBtn" :ripple="true"
|
||||
ripple-bg-color="#909399" @click="addXgFun">保存</u-button>
|
||||
</view>
|
||||
<!--组件-->
|
||||
<u-select v-model="selectShow" :list="selectList" @confirm="selectConfirmFun"></u-select>
|
||||
<!--图片上传方法组件-->
|
||||
<uploadImg v-if="ppImgShow" :ppList="ppList" :ppUrls="ppUrls" @confirmPopupFun="confirmPopupFun"></uploadImg>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let that = '';
|
||||
import {
|
||||
getNowDate
|
||||
} from '@/static/utils/date.js'
|
||||
import {
|
||||
uploadImgFun
|
||||
} from '@/static/utils/upload.js'
|
||||
import uploadImg from '@/components/upload/uploadImg'
|
||||
import { crmChanpinApi, crmCpClassifyApi, fileApi } from '@/static/utils/api.js'
|
||||
export default {
|
||||
components: {
|
||||
uploadImg
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
selectShow: false,
|
||||
selectList: [],
|
||||
selectType: '',
|
||||
pName: '',
|
||||
price: '',
|
||||
salesNum: '',
|
||||
stock: '',
|
||||
code: '',
|
||||
flName: '',
|
||||
cpFlId: '',
|
||||
unit: '',
|
||||
isSxJ: '上架',
|
||||
describe: '',
|
||||
action: 'http://www.example.com/upload',
|
||||
fileList: [],
|
||||
classify: [],
|
||||
cpLbt: [],
|
||||
cpXqt: [],
|
||||
cpFmt: [],
|
||||
cpLbtList: [],
|
||||
cpXqtList: [],
|
||||
cpFmtList: [],
|
||||
cpCsList: [],
|
||||
pageType: '',
|
||||
siziType: ['compressed'],
|
||||
ppImgShow: false,
|
||||
uploadType: '',
|
||||
ppList: [],
|
||||
ppUrls: [],
|
||||
xgCpInfo: {}
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
that = this;
|
||||
if (e.type == 'update') {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '修改产品信息'
|
||||
})
|
||||
that.pageType = e.type;
|
||||
that.setDataFun();
|
||||
}
|
||||
that.getClassifyFun();
|
||||
},
|
||||
methods: {
|
||||
// 查询分类方法
|
||||
getClassifyFun: function() {
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
let reqData = {
|
||||
action: 'getFlList',
|
||||
params: {
|
||||
matchObj: {
|
||||
isShow: true
|
||||
}
|
||||
}
|
||||
}
|
||||
crmCpClassifyApi(reqData)
|
||||
.then(res => {
|
||||
let data = res.result.data;
|
||||
if (data && data.length > 0) {
|
||||
if(that.pageType != 'update') {
|
||||
that.flName = data[0].flName;
|
||||
that.cpFlId = data[0]._id;
|
||||
}
|
||||
that.classify = data;
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '当前暂未设置产品分类，请先添加产品分类！',
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
uni.redirectTo({
|
||||
url: './classify?pageType=add'
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选择定位地点
|
||||
chooseAddrFun: function() {
|
||||
uni.chooseLocation({
|
||||
success: function(res) {
|
||||
that.gjAddr = res.address;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 展示相应数据选择框
|
||||
pickerSelectFun: function(str) {
|
||||
if (str == '产品类型') {
|
||||
let classify = that.classify;
|
||||
let arr = [];
|
||||
for (var i = 0; i < classify.length; i++) {
|
||||
arr.push({
|
||||
value: classify[i]._id,
|
||||
_id: classify[i]._id,
|
||||
label: classify[i].flName
|
||||
})
|
||||
}
|
||||
that.selectList = arr;
|
||||
} else if (str == '上下架') {
|
||||
that.selectList = [{
|
||||
value: 0,
|
||||
b: true,
|
||||
label: '上架'
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
b: false,
|
||||
label: '下架'
|
||||
}
|
||||
]
|
||||
}
|
||||
that.selectShow = true;
|
||||
that.selectType = str;
|
||||
},
|
||||
// 选择框选中事件
|
||||
selectConfirmFun: function(e) {
|
||||
if (that.selectType == '产品类型') {
|
||||
that.flName = e[0].label;
|
||||
that.cpFlId = e[0]._id || e[0].value;
|
||||
} else if (that.selectType == '上下架') {
|
||||
that.isSxJ = e[0].label;
|
||||
}
|
||||
},
|
||||
// 当内部文件列表被加入文件、移除文件，或手动调用clear方法时触发
|
||||
uploadFmChangeFun: function(list) {
|
||||
that.uploadType = 'fmt';
|
||||
that.ppList = list;
|
||||
that.ppUrls = that.cpFmt;
|
||||
that.ppImgShow = true;
|
||||
},
|
||||
// 封面图删除
|
||||
fmtRemoeFun: function(e) {
|
||||
let arr = that.cpFmt.splice(e, 1);
|
||||
that.deleteFun(arr)
|
||||
},
|
||||
fileChangeFun: function(e) {
|
||||
},
|
||||
// 上传轮播图
|
||||
uploadLbtChangeFun: function(list) {
|
||||
that.uploadType = 'lbt';
|
||||
that.ppList = list;
|
||||
that.ppUrls = that.cpLbt;
|
||||
that.ppImgShow = true;
|
||||
},
|
||||
// 轮播图删除
|
||||
lbtRemoeFun: function(e) {
|
||||
let arr = that.cpLbt.splice(e, 1);
|
||||
that.deleteFun(arr)
|
||||
},
|
||||
// 上传详情图
|
||||
uploadXqChangeFun: function(list) {
|
||||
that.uploadType = 'xqt';
|
||||
that.ppList = list;
|
||||
that.ppUrls = that.cpXqt;
|
||||
that.ppImgShow = true;
|
||||
},
|
||||
// 详情图删除
|
||||
xqtRemoeFun: function(e) {
|
||||
let arr = that.cpXqt.splice(e, 1);
|
||||
that.deleteFun(arr)
|
||||
},
|
||||
// popup图片上传完成回调
|
||||
confirmPopupFun: function(e) {
|
||||
that.ppImgShow = false;
|
||||
if (that.uploadType == 'lbt') {
|
||||
that.cpLbt = e;
|
||||
} else if (that.uploadType == 'xqt') {
|
||||
that.cpXqt = e;
|
||||
} else {
|
||||
that.cpFmt = e;
|
||||
}
|
||||
},
|
||||
// 删除文件云函数
|
||||
deleteFun: function(list) {
|
||||
let reqData = {
|
||||
action: 'delete',
|
||||
params: {
|
||||
fileList: [list[0].fileId]
|
||||
}
|
||||
}
|
||||
fileApi(reqData)
|
||||
.then(res => {
|
||||
|
||||
})
|
||||
},
|
||||
scanFun: function() {
|
||||
uni.scanCode({
|
||||
success(res) {
|
||||
that.code = res.result;
|
||||
}
|
||||
})
|
||||
},
|
||||
// 产品添加方法
|
||||
addXgFun: function() {
|
||||
let reqObj = {
|
||||
req: {
|
||||
pName: that.pName,
|
||||
price: that.price,
|
||||
unit: that.unit,
|
||||
cpFlId: that.cpFlId,
|
||||
isSxJ: that.isSxJ == '上架' ? true : false,
|
||||
code: that.code,
|
||||
describe: that.describe,
|
||||
cpCsList: that.cpCsList,
|
||||
cpLbtList: that.cpLbt,
|
||||
cpXqtList: that.cpXqt,
|
||||
cpFmtList: that.cpFmt,
|
||||
salesNum: that.salesNum,
|
||||
stock: that.stock
|
||||
}
|
||||
}
|
||||
if (!that.pName) {
|
||||
uni.$myModalFun('产品名称不能为空，请输入！')
|
||||
return
|
||||
}
|
||||
if (!that.price) {
|
||||
uni.$myModalFun('产品价格不能为空，请输入！')
|
||||
return
|
||||
}
|
||||
if (!that.unit) {
|
||||
uni.$myModalFun('产品单位不能为空，请输入！')
|
||||
return
|
||||
}
|
||||
let action = 'add';
|
||||
let time = new Date().getTime();
|
||||
if (that.pageType == 'update') {
|
||||
action = 'update'
|
||||
reqObj._id = that.xgCpInfo._id;
|
||||
reqObj.req.update_date = time;
|
||||
reqObj.req.updateUid = uni.$userInfo._id;
|
||||
uni.showLoading({
|
||||
title: '修改中...'
|
||||
})
|
||||
} else {
|
||||
reqObj.req.create_date = time;
|
||||
reqObj.req.update_date = time;
|
||||
reqObj.req.cjRenId = uni.$userInfo._id;
|
||||
reqObj.req.updateUid = uni.$userInfo._id;
|
||||
uni.showLoading({
|
||||
title: '提交中...'
|
||||
})
|
||||
}
|
||||
let reqData = {
|
||||
action: action,
|
||||
params: reqObj
|
||||
}
|
||||
crmChanpinApi(reqData)
|
||||
.then(res => {
|
||||
if (action == 'update') {
|
||||
uni.showToast({
|
||||
title: '产品修改成功',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else {
|
||||
that.pageType = 'update';
|
||||
that.xgCpInfo._id = res.result.id;
|
||||
let item = reqObj.req;
|
||||
item._id = res.result.id;
|
||||
uni.$cpDetail = item;
|
||||
uni.showToast({
|
||||
mask: true,
|
||||
title: '产品新增成功',
|
||||
duration: 1000
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.redirectTo({
|
||||
url: './cpDetail'
|
||||
})
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 新增产品参数
|
||||
addCsFun: function() {
|
||||
that.cpCsList = that.cpCsList.concat({
|
||||
csName: '',
|
||||
csJieShao: ''
|
||||
})
|
||||
},
|
||||
// 删除产品参数
|
||||
deleteCpCsFun: function(iii) {
|
||||
that.cpCsList.splice(iii, 1)
|
||||
},
|
||||
// 设置信息
|
||||
setDataFun: function() {
|
||||
let obj = uni.$cpDetail;
|
||||
that.xgCpInfo = obj;
|
||||
that.pName = obj.pName
|
||||
that.price = obj.price;
|
||||
that.unit = obj.unit;
|
||||
that.flName = obj.flName;
|
||||
that.cpFlId = obj.cpFlId;
|
||||
that.isSxJ = obj.isSxJ ? '上架' : '下架';
|
||||
that.code = obj.code;
|
||||
that.describe = obj.describe;
|
||||
that.cpCsList = obj.cpCsList;
|
||||
that.cpLbtList = obj.cpLbtList || [];
|
||||
that.cpXqtList = obj.cpXqtList || [];
|
||||
that.cpFmtList = obj.cpFmtList || [];
|
||||
that.cpLbt = obj.cpLbtList || [];
|
||||
that.cpXqt = obj.cpXqtList || [];
|
||||
that.cpFmt = obj.cpFmtList || [];
|
||||
that.salesNum = obj.salesNum || '';
|
||||
that.stock = obj.stock || '';
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background-color: #F8F8F8;
|
||||
padding-bottom: 260rpx;
|
||||
}
|
||||
|
||||
.u-radio {
|
||||
width: 200rpx !important;
|
||||
}
|
||||
|
||||
.submitView {
|
||||
width: 100%;
|
||||
padding: 16rpx 0 26rpx;
|
||||
background-color: #FFFFFF;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
border-top: 1rpx solid #f1f1f1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.submitBtn {
|
||||
width: 666rpx;
|
||||
}
|
||||
|
||||
.canshuInputRow {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.canshuInputRow>.csInput1 {
|
||||
width: 36%;
|
||||
}
|
||||
|
||||
.canshuInputRow>.csInput2 {
|
||||
width: 50%;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,512 @@
|
||||
<template>
|
||||
<view>
|
||||
<topDropdown :isSxShow="true" :dropdown1="dropdown1" dropdown2="上架中" :options1="options1" :options2="isSjList" :optionsSx="sxList" searchUrl="./searchAdmin" @dropDownFun1="dropDownFun1" @dropDownFun2="dropDownFun2" @optionSxFun="optionSxFun">
|
||||
</topDropdown>
|
||||
<dataNull v-if="list.length == 0" src="/static/img/chahua/dataNullXz.png" title="暂无相关产品"
|
||||
title1="请添加或者更换查询条件"></dataNull>
|
||||
<scroll-view v-else scroll-y="true" :style="{height: scrollHeight}" @scrolltolower="getChanPinFun"
|
||||
refresher-enabled :refresher-threshold="200" :refresher-triggered="triggered" refresher-background="gray"
|
||||
@refresherrefresh="onRefresh" @refresherrestore="onRestore">
|
||||
<view v-for="(item, index) in list" :key="index" @click="cardClick(item)">
|
||||
<view v-if="item.cpFmtList && item.cpFmtList.length > 0" class="myCard2">
|
||||
<view class="leftImg">
|
||||
<u-image height="160" width="160" border-radius="26" :src="item.cpFmtList[0].url"></u-image>
|
||||
</view>
|
||||
<view class="rightView">
|
||||
<view class="cardTopName1">{{item.pName}}</view>
|
||||
<view v-if="item.salesNum || item.stock" class="xlKcClass">
|
||||
<text v-if="item.salesNum">销量: {{item.salesNum}}</text>
|
||||
<text v-if="item.stock">库存: {{item.stock}}</text>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<text class="redColor">￥{{item.price}}</text>/{{item.unit}}
|
||||
</view>
|
||||
<view class="rowBtn">
|
||||
<u-button type="primary" :plain="true" class="cpBtn" size="mini" @tap.stop="setCpFun(item)">
|
||||
编辑产品
|
||||
</u-button>
|
||||
<u-button type="warning" :plain="true" class="cpBtn" size="mini"
|
||||
@click="cpsxjFun(item, index)">{{item.isSxJ == true ? '下架' : '上架'}}</u-button>
|
||||
<u-button type="error" :plain="true" class="cpBtn" size="mini"
|
||||
@tap.stop="deleteCpFun(item, index)">
|
||||
删除</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="myCard">
|
||||
<view class="cardTopName">产品名称：{{item.pName}}</view>
|
||||
<view class="cardRow">
|
||||
<view>产品状态：</view>
|
||||
<view>{{item.isSxJ ? '上架中' : '下架'}}</view>
|
||||
</view>
|
||||
<view class="cardRow">
|
||||
<view>产品价格：</view>
|
||||
<view><text class="redColor">￥{{item.price}}</text>/{{item.unit}}</view>
|
||||
</view>
|
||||
<view class="cardRow">
|
||||
<view>产品类型：</view>
|
||||
<view>{{item.flName}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.salesNum">
|
||||
<view>产品销量：</view>
|
||||
<view>{{item.salesNum}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.stock">
|
||||
<view>产品库存：</view>
|
||||
<view>{{item.stock}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.describe">
|
||||
<view>产品简述：</view>
|
||||
<view>{{item.describe}}</view>
|
||||
</view>
|
||||
<view class="rowBtn">
|
||||
<u-button type="primary" :plain="true" class="cpBtn" size="mini" @tap.stop="setCpFun(item)">编辑产品
|
||||
</u-button>
|
||||
<u-button type="warning" :plain="true" class="cpBtn" size="mini" @click="cpsxjFun(item, index)">
|
||||
{{item.isSxJ == true ? '下架' : '上架'}}</u-button>
|
||||
<u-button type="error" :plain="true" class="cpBtn" size="mini"
|
||||
@tap.stop="deleteCpFun(item, index)">
|
||||
删除</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<getMore :isMore="isMore" class="h200"></getMore>
|
||||
</scroll-view>
|
||||
<addBtn url="./addCp"></addBtn>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let that = '';
|
||||
import dataNull from '@/components/dataNull/dataNull.vue'
|
||||
import addBtn from '@/components/addBtn/addBtn.vue'
|
||||
import getMore from '@/components/getMore/getMore.vue'
|
||||
import topDropdown from '@/components/topDropdown/topDropdown.vue'
|
||||
import { crmChanpinApi, crmCpClassifyApi, fileApi } from '@/static/utils/api.js'
|
||||
export default {
|
||||
components: {
|
||||
dataNull,
|
||||
addBtn,
|
||||
getMore,
|
||||
topDropdown
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
triggered: false,
|
||||
pageIndex: 1,
|
||||
list: [],
|
||||
classify: [],
|
||||
dropdown1: '产品分类',
|
||||
cpClassify: '',
|
||||
cpFlId: '',
|
||||
isMore: true,
|
||||
scrollHeight: '667px',
|
||||
sjType: '上架中',
|
||||
options1: [],
|
||||
isSjList: [{
|
||||
value: 0,
|
||||
label: '上架中'
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
label: '下架'
|
||||
},
|
||||
],
|
||||
isSxJ: true,
|
||||
sxList: [{
|
||||
title: '创建时间排序',
|
||||
field: 'create_date',
|
||||
current: '',
|
||||
arr: [
|
||||
'降序',
|
||||
'升序'
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '修改时间排序',
|
||||
field: 'update_date',
|
||||
current: '',
|
||||
arr: [
|
||||
'降序',
|
||||
'升序'
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '销量排序',
|
||||
field: 'salesNum',
|
||||
current: '',
|
||||
arr: [
|
||||
'降序',
|
||||
'升序'
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '库存排序',
|
||||
field: 'stock',
|
||||
current: '',
|
||||
arr: [
|
||||
'降序',
|
||||
'升序'
|
||||
]
|
||||
},
|
||||
],
|
||||
sortObj: {
|
||||
update_date: -1
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.scrollHeight = res.windowHeight - 40 + 'px';
|
||||
}
|
||||
})
|
||||
that.getClassifyFun();
|
||||
},
|
||||
methods: {
|
||||
// 查询分类方法
|
||||
getClassifyFun: function() {
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
let reqData = {
|
||||
action: 'get',
|
||||
params: {
|
||||
isShow: true
|
||||
}
|
||||
}
|
||||
crmCpClassifyApi(reqData)
|
||||
.then(res => {
|
||||
let data = res.result.data;
|
||||
if (data && data.length > 0) {
|
||||
that.classify = data;
|
||||
that.cpClassify = data[0].flName;
|
||||
that.cpFlId = data[0]._id;
|
||||
that.setDropDownFun();
|
||||
that.getChanPinFun();
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '当前暂未设置产品分类，请先添加产品分类！',
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
uni.redirectTo({
|
||||
url: './classify?pageType=add'
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 查询产品方法
|
||||
getChanPinFun: function() {
|
||||
if (!that.isMore) {
|
||||
return
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
let reqObj = {
|
||||
matchObj: {
|
||||
cpFlId: that.cpFlId,
|
||||
isSxJ: that.isSxJ,
|
||||
},
|
||||
pageIndex: that.pageIndex,
|
||||
sortObj: that.sortObj
|
||||
}
|
||||
let reqData = {
|
||||
action: 'getCpList',
|
||||
params: reqObj
|
||||
}
|
||||
console.log(reqData)
|
||||
crmChanpinApi(reqData)
|
||||
.then(res => {
|
||||
let data = res.result.data
|
||||
if (that.pageIndex == 1) {
|
||||
that.list = [];
|
||||
}
|
||||
if (data.length == 20) {
|
||||
that.pageIndex += 1;
|
||||
that.isMore = true;
|
||||
} else {
|
||||
that.isMore = false;
|
||||
}
|
||||
that.triggered = false;
|
||||
that.list = that.list.concat(data);
|
||||
})
|
||||
},
|
||||
// 设置下拉菜单数据
|
||||
setDropDownFun: function() {
|
||||
let list = that.classify;
|
||||
let arr = [];
|
||||
for (var i = 0; i < list.length; i++) {
|
||||
arr.push({
|
||||
value: i,
|
||||
_id: list[i]._id,
|
||||
label: list[i].flName
|
||||
})
|
||||
}
|
||||
that.options1 = arr;
|
||||
that.dropdown1 = arr[0].label;
|
||||
},
|
||||
// 下拉菜单回调1
|
||||
dropDownFun1: function(e) {
|
||||
that.cpClassify = e.label;
|
||||
that.cpFlId = e._id;
|
||||
that.pageIndex = 1;
|
||||
that.isMore = true;
|
||||
that.getChanPinFun();
|
||||
},
|
||||
// 下拉菜单回调2
|
||||
dropDownFun2: function(e) {
|
||||
if (e.label == '上架中') {
|
||||
that.isSxJ = true
|
||||
} else {
|
||||
that.isSxJ = false
|
||||
}
|
||||
that.pageIndex = 1;
|
||||
that.isMore = true;
|
||||
that.getChanPinFun();
|
||||
},
|
||||
// 筛选框回调
|
||||
optionSxFun: function(arr) {
|
||||
let sortObj = {
|
||||
update_date: -1
|
||||
}
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
if (arr[i].current !== '') {
|
||||
if (arr[i].field == 'create_date') {
|
||||
sortObj.create_date = arr[i].current == 1 ? 1 : -1
|
||||
}
|
||||
if (arr[i].field == 'update_date') {
|
||||
sortObj.update_date = arr[i].current == 1 ? 1 : -1
|
||||
}
|
||||
if (arr[i].field == 'salesNum') {
|
||||
sortObj.salesNum = arr[i].current == 1 ? 1 : -1
|
||||
}
|
||||
if (arr[i].field == 'stock') {
|
||||
sortObj.stock = arr[i].current == 1 ? 1 : -1
|
||||
}
|
||||
that.sortObj = sortObj;
|
||||
break;
|
||||
}
|
||||
}
|
||||
that.pageIndex = 1;
|
||||
that.isMore = true;
|
||||
that.getChanPinFun();
|
||||
},
|
||||
// 卡片点击方法
|
||||
cardClick: function(item) {
|
||||
uni.$cpDetail = item;
|
||||
uni.navigateTo({
|
||||
url: './cpDetail'
|
||||
})
|
||||
},
|
||||
// 编辑产品
|
||||
setCpFun: function(item) {
|
||||
uni.$cpDetail = item;
|
||||
uni.navigateTo({
|
||||
url: './addCp?type=update'
|
||||
})
|
||||
},
|
||||
// 删除产品
|
||||
deleteCpFun: function(item, index) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否确认删除产品：' + item.pName,
|
||||
success(rrr) {
|
||||
if (rrr.confirm) {
|
||||
uni.showLoading({
|
||||
title: '删除中...'
|
||||
})
|
||||
let arr = item.cpFmtList;
|
||||
arr = arr.concat(item.cpLbtList);
|
||||
arr = arr.concat(item.cpXqtList);
|
||||
if (arr.length > 0) {
|
||||
that.deleteCpFileFun(item._id, index, arr)
|
||||
} else {
|
||||
that.deleteCpApiFun(item._id, index);
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 删除产品云函数api
|
||||
deleteCpApiFun: function(_id, index) {
|
||||
let reqData = {
|
||||
action: 'deleteById',
|
||||
params: {
|
||||
_id
|
||||
}
|
||||
}
|
||||
crmChanpinApi(reqData)
|
||||
.then(res => {
|
||||
uni.showToast({
|
||||
title: '删除成功!',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
that.list.splice(index, 1);
|
||||
})
|
||||
},
|
||||
// 删除产品图片api
|
||||
deleteCpFileFun: function(_id, index, arr) {
|
||||
let fileList = [];
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
fileList.push(arr[i].fileId);
|
||||
}
|
||||
let reqData = {
|
||||
action: 'delete',
|
||||
params: {
|
||||
fileList
|
||||
}
|
||||
}
|
||||
fileApi(reqData)
|
||||
.then(res => {
|
||||
that.deleteCpApiFun(_id, index);
|
||||
})
|
||||
},
|
||||
// 产品上下架
|
||||
cpsxjFun: function(item, index) {
|
||||
let str = '上架中...';
|
||||
let sxj = true
|
||||
if (item.isSxJ) {
|
||||
sxj = false;
|
||||
str = '下架中...'
|
||||
}
|
||||
uni.showLoading({
|
||||
title: str,
|
||||
mask: true
|
||||
})
|
||||
let reqObj = {
|
||||
_id: item._id,
|
||||
req: {
|
||||
isSxJ: sxj
|
||||
}
|
||||
}
|
||||
let reqData = {
|
||||
action: 'update',
|
||||
params: reqObj
|
||||
}
|
||||
crmChanpinApi(reqData)
|
||||
.then(res => {
|
||||
let showTitle = '上架成功'
|
||||
if (sxj == false) {
|
||||
showTitle = '下架成功！'
|
||||
}
|
||||
uni.showToast({
|
||||
title: showTitle,
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
})
|
||||
that.list.splice(index, 1);
|
||||
})
|
||||
},
|
||||
onRefresh: function() {
|
||||
if(that.triggered) return
|
||||
that.triggered = true;
|
||||
that.pageIndex = 1;
|
||||
that.isMore = true;
|
||||
that.getChanPinFun();
|
||||
},
|
||||
onRestore: function(e) {
|
||||
that.triggered = false; // 需要重置
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background-color: #F8F8F8;
|
||||
}
|
||||
|
||||
.rowBtn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin: 26rpx 16rpx 16rpx 0;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cpBtn {
|
||||
margin: 0 0 0 26rpx;
|
||||
font-size: 15px !important;
|
||||
height: 60rpx !important;
|
||||
line-height: 60rpx !important;
|
||||
}
|
||||
|
||||
.gdCz {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
padding: 6rpx 12rpx;
|
||||
}
|
||||
|
||||
.myCard2 {
|
||||
width: 698rpx;
|
||||
padding: 26rpx;
|
||||
margin: 32rpx 26rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: #d8d8d8 0px 0px 16rpx;
|
||||
position: relative;
|
||||
background-color: #FFFFFF;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cardTopName1 {
|
||||
font-size: 16px;
|
||||
margin-bottom: 8rpx;
|
||||
color: #000000;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
font-weight: bold;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.cardRow1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.cardRow1>view:first-child {
|
||||
width: 176rpx;
|
||||
color: #ADADAD;
|
||||
}
|
||||
|
||||
.cardRow1>view:last-child {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.leftImg {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 26rpx;
|
||||
border-radius: 26rpx;
|
||||
overflow: hidden;
|
||||
border: 1rpx solid #DDDDDD;
|
||||
}
|
||||
|
||||
.rightView {
|
||||
width: 460rpx;
|
||||
}
|
||||
|
||||
.xlKcClass {
|
||||
font-size: 14px;
|
||||
color: #888888;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.xlKcClass>text {
|
||||
margin-right: 26rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,366 @@
|
||||
<template>
|
||||
<view>
|
||||
<dataNull v-if="list.length == 0" src="/static/img/chahua/dataNullXz.png" title="暂无相关分类"
|
||||
title1="点击添加按钮添加相关分类"></dataNull>
|
||||
<view v-else class="content">
|
||||
<view class="row" v-for="(row, index) in list" :key="index">
|
||||
<text class="text">{{row.flName}}</text>
|
||||
<view class="rightMenuRow">
|
||||
<u-switch v-model="row.isShow" inactive-color="#f00" @change="changeClassFun(row)">
|
||||
</u-switch>
|
||||
<view class="menuBtn primaryBtn" @click="updateNameFun(row)">修改</view>
|
||||
<view class="menuBtn errorBtn" @click="deleteFun(row)">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="popupShow = true">
|
||||
<addBtn></addBtn>
|
||||
</view>
|
||||
<!--新增分类-->
|
||||
<u-popup v-model="popupShow" mode="center" border-radius="14" width="500rpx">
|
||||
<view class="popupTitle">新增分类</view>
|
||||
<view class="popupInput">
|
||||
<text>分类名称：</text>
|
||||
<input v-model="flName" class="uInput" type="text" placeholder="请输入分类名称" style="font-size: 16px;">
|
||||
</view>
|
||||
<view class="popupInput">
|
||||
<text>分类排序：</text>
|
||||
<input v-model="sort" class="uInput" type="number" placeholder="数值越小越靠前" style="font-size: 16px;">
|
||||
</view>
|
||||
<view class="btnRow">
|
||||
<view class="popupBtn errorBtn" @click="popupShow = false">取消</view>
|
||||
<view class="popupBtn primaryBtn" @click="addClassifyFun">确认</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<!--修改分类名称-->
|
||||
<u-popup v-model="popupXgShow" mode="center" border-radius="14" width="500rpx">
|
||||
<view class="popupTitle">修改名称</view>
|
||||
<view class="popupInput">
|
||||
<text>分类名称：</text>
|
||||
<input v-model="flName" class="uInput" type="text" placeholder="请输入分类名称" style="font-size: 16px;">
|
||||
</view>
|
||||
<view class="popupInput">
|
||||
<text>分类排序：</text>
|
||||
<input v-model="sort" class="uInput" type="number" placeholder="数值越小越靠前" style="font-size: 16px;">
|
||||
</view>
|
||||
<view class="btnRow">
|
||||
<view class="popupBtn errorBtn" @click="popupXgShow = false">取消</view>
|
||||
<view class="popupBtn primaryBtn" @click="updateConfirmFun">确认</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let that = '';
|
||||
import dataNull from '@/components/dataNull/dataNull.vue'
|
||||
import addBtn from '@/components/addBtn/addBtn.vue'
|
||||
import {
|
||||
crmCpClassifyApi
|
||||
} from '@/static/utils/api.js'
|
||||
export default {
|
||||
components: {
|
||||
dataNull,
|
||||
addBtn
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
popupShow: false,
|
||||
popupXgShow: false,
|
||||
addName: '',
|
||||
flName: '',
|
||||
sort: '',
|
||||
flData: {},
|
||||
list: [],
|
||||
xgObj: {},
|
||||
ispush: false,
|
||||
pageType: ''
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
that = this;
|
||||
if (e.pageType) {
|
||||
that.pageType = e.pageType;
|
||||
that.popupShow = true;
|
||||
}
|
||||
that.getClassifyFun();
|
||||
},
|
||||
methods: {
|
||||
// 查询分类方法
|
||||
getClassifyFun: function() {
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
let reqData = {
|
||||
action: 'getFlList',
|
||||
params: {}
|
||||
}
|
||||
crmCpClassifyApi(reqData)
|
||||
.then(res => {
|
||||
let data = res.result.data;
|
||||
console.log(data)
|
||||
that.list = data;
|
||||
// if (data) {
|
||||
// that.list = data.list;
|
||||
// uni.setStorageSync('classifyList', data.list);
|
||||
// }
|
||||
})
|
||||
},
|
||||
// 新增和修改分类方法
|
||||
addClassifyFun: function() {
|
||||
if (!that.flName) {
|
||||
uni.showToast({
|
||||
title: '请输入分类名称！',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!that.sort) {
|
||||
uni.showToast({
|
||||
title: '请输入分类排序数值！',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '提交中...',
|
||||
mask: true
|
||||
})
|
||||
let obj = {
|
||||
flName: that.flName,
|
||||
sort: parseFloat(that.sort),
|
||||
isShow: true
|
||||
}
|
||||
let time = new Date().getTime()
|
||||
obj.create_date = time;
|
||||
obj.update_date = time;
|
||||
obj.cjRenId = uni.$userInfo._id;
|
||||
obj.updateUid = uni.$userInfo._id;
|
||||
let reqData = {
|
||||
action: 'add',
|
||||
params: {
|
||||
req: obj
|
||||
}
|
||||
}
|
||||
crmCpClassifyApi(reqData)
|
||||
.then(res => {
|
||||
that.flName = '';
|
||||
that.sort = '';
|
||||
that.popupShow = false;
|
||||
uni.showToast({
|
||||
title: '新增成功！',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
})
|
||||
that.getClassifyFun()
|
||||
})
|
||||
},
|
||||
// 修改产品分类名称
|
||||
updateNameFun: function(item) {
|
||||
that.popupXgShow = true;
|
||||
that.xgObj = item;
|
||||
that.sort = item.sort;
|
||||
that.flName = item.flName;
|
||||
},
|
||||
// 修改产品分类确认方法
|
||||
updateConfirmFun: function() {
|
||||
if (!that.flName) {
|
||||
uni.showToast({
|
||||
title: '请输入分类名称！',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!that.sort) {
|
||||
uni.showToast({
|
||||
title: '请输入分类排序数值！',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '更新中...',
|
||||
mask: true
|
||||
})
|
||||
let obj = {
|
||||
flName: that.flName,
|
||||
sort: parseFloat(that.sort)
|
||||
};
|
||||
let time = new Date().getTime()
|
||||
obj.update_date = time;
|
||||
obj.updateUid = uni.$userInfo._id;
|
||||
let reqData = {
|
||||
action: 'updateFl',
|
||||
params: {
|
||||
_id: that.xgObj._id,
|
||||
updateObj: obj
|
||||
}
|
||||
}
|
||||
crmCpClassifyApi(reqData)
|
||||
.then(res => {
|
||||
that.flName = '';
|
||||
that.sort = '';
|
||||
that.popupXgShow = false;
|
||||
uni.showToast({
|
||||
title: '修改成功！',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
})
|
||||
that.getClassifyFun()
|
||||
})
|
||||
},
|
||||
// 是否显示分类按钮方法
|
||||
changeClassFun: function(e) {
|
||||
let reqData = {
|
||||
action: 'updateFl',
|
||||
params: {
|
||||
_id: e._id,
|
||||
updateObj: {
|
||||
isShow: e.isShow
|
||||
}
|
||||
}
|
||||
}
|
||||
crmCpClassifyApi(reqData)
|
||||
.then(res => {
|
||||
that.getClassifyFun();
|
||||
})
|
||||
},
|
||||
// 删除产品分类
|
||||
deleteFun: function(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否确认要删除该产品分类：' + item.flName + '?',
|
||||
success(res) {
|
||||
if(res.confirm) {
|
||||
uni.showLoading({
|
||||
title: '删除中，请稍等...',
|
||||
mask: true
|
||||
})
|
||||
let reqData = {
|
||||
action: 'deleteFlById',
|
||||
params: {
|
||||
_id: item._id
|
||||
}
|
||||
}
|
||||
crmCpClassifyApi(reqData)
|
||||
.then(res => {
|
||||
that.getClassifyFun();
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #efeff4 !important;
|
||||
}
|
||||
|
||||
.content {
|
||||
background-color: #FFFFFF;
|
||||
padding: 26rpx;
|
||||
.row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
border-bottom: 1rpx solid #CDCDCD;
|
||||
.icon {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 6px;
|
||||
margin-right: 13px;
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.popupTitle {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin: 16rpx 0;
|
||||
}
|
||||
|
||||
.popupInput {
|
||||
font-size: 16px !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 26rpx;
|
||||
margin: 32rpx 0 26rpx 26rpx;
|
||||
}
|
||||
|
||||
.popupInput .uInput {
|
||||
width: 280rpx !important;
|
||||
border-bottom: 1rpx solid #AAAAAA;
|
||||
padding-bottom: 8rpx;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.btnRow {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 26rpx;
|
||||
}
|
||||
|
||||
.btnRow>.btn {
|
||||
width: 160rpx;
|
||||
height: 60rpx;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.rightMenuRow {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
right: 26rpx;
|
||||
}
|
||||
|
||||
.rightMenuRow .menuBtn {
|
||||
border-radius: 12rpx;
|
||||
color: #FFFFFF;
|
||||
margin: 0 0 0 26rpx;
|
||||
width: 100rpx;
|
||||
height: 50rpx;
|
||||
text-align: center;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
.popupBtn {
|
||||
border-radius: 12rpx;
|
||||
color: #FFFFFF;
|
||||
width: 150rpx;
|
||||
height: 60rpx;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
}
|
||||
.primaryBtn {
|
||||
background-color: #007AFF;
|
||||
}
|
||||
.primaryBtn:active {
|
||||
background-color: #55aaff;
|
||||
}
|
||||
.errorBtn {
|
||||
background-color: #ff0000;
|
||||
}
|
||||
.errorBtn:active {
|
||||
background-color: #ff6e0e;
|
||||
}
|
||||
.uni-input-input {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
.arrowIcon {
|
||||
margin-right: 26rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,323 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-navbar back-icon-color="#FFFFFF" title="成品库存资料" title-color="#FFFFFF" :title-bold="true"
|
||||
:background="background">
|
||||
</u-navbar>
|
||||
<view class="top-box">
|
||||
<view class="myCard">
|
||||
<view class="cardTopName">编号：{{this.item.FabricGoodsNo}} 名称：{{this.item.FabricGoodsName}}</view>
|
||||
<view class="cardRow1" v-if="this.item.GoodsWeight">
|
||||
<view>规格：{{this.item.GoodsWidth}}*{{this.item.GoodsWeight}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view>仓库：{{this.item.StoreName}} 所属：{{this.item.OwnerName}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view>等级：{{this.item.GoodsGradeName}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view>备注：{{this.item.GoodsRemark}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</View>
|
||||
|
||||
<scroll-view scroll-y="true" :style="{height: scrollHeight}"
|
||||
refresher-enabled :refresher-threshold="200" :refresher-triggered="triggered" refresher-background="gray"
|
||||
@refresherrefresh="onRefresh" @refresherrestore="onRestore">
|
||||
<view v-if="list.length > 0">
|
||||
<view v-for="(item, index) in list" :key="index" @click="StoreGoodsCodeCardClickFun(item)">
|
||||
<view class="myCard">
|
||||
<view class="cardRow1">
|
||||
<view>颜色：{{item.GoodsCodeNo}} {{item.GoodsCodeName}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view class="mr26">匹数：{{item.Roll}}匹</view>
|
||||
<view class="mr26">数量：{{item.Qty}}{{item.UnitName}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view class="mr26">预约：{{item.AllocatedRoll}}匹</view>
|
||||
<view class="mr26">可用：{{item.UseRoll}}匹</view>
|
||||
</view>
|
||||
<view class="cardRow1" v-if="item.Price > 0">
|
||||
<view class="mr26">单价：{{item.Price}}/{{item.UnitName}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<getMore :isMore="isMore" nullMsg="已加载全部~"></getMore>
|
||||
<view class="h200"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let that = '';
|
||||
//import { crmChanpinApi } from '@/static/utils/api.js'
|
||||
import dataNull from '@/components/dataNull/dataNull.vue';
|
||||
import util, {
|
||||
playSuccessAudio,
|
||||
playErrorAudio
|
||||
} from '../../common/util.js';
|
||||
export default {
|
||||
components: {
|
||||
dataNull
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
triggered: false,
|
||||
scrollHeight: '667px',
|
||||
customerID: 0,
|
||||
GoodsCodeNo: '',
|
||||
GoodsCodeName: '',
|
||||
tabBars: [],
|
||||
list: [],
|
||||
detail: {},
|
||||
background: {
|
||||
'background-image': 'linear-gradient(45deg, #007aff, rgb(12, 168, 234))'
|
||||
},
|
||||
customStyle: {
|
||||
backgroundColor: 'rgb(13, 159, 224)',
|
||||
color: '#FFFFFF',
|
||||
border: '0',
|
||||
fontSize: '32',
|
||||
outline: 'none'
|
||||
},
|
||||
lbt: [],
|
||||
pageType: ''
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
that = this;
|
||||
|
||||
that.detail = uni.$cpDetail;
|
||||
console.log("------" + that.detail.FabricGoodsName);
|
||||
this.customerID = e.customerid;
|
||||
this.item = JSON.parse(decodeURIComponent(e.obj));
|
||||
this.getStoreGoodsCodeData(e);
|
||||
},
|
||||
|
||||
methods: {
|
||||
getStoreGoodsCodeData: function(e) {
|
||||
let iii = that.leftA;
|
||||
console.log("this.item.StoreNameID===" + this.item.StoreNameID);
|
||||
console.log("this.item.OwnerID===" + this.item.OwnerID);
|
||||
console.log("this.item.CustomerID===" + this.customerID);
|
||||
console.log("this.item.FabricGoodsID===" + this.item.FabricGoodsID);
|
||||
console.log("this.item.GoodsGradeName===" + this.item.GoodsGradeName);
|
||||
console.log("this.item.GoodsRemark===" + this.item.GoodsRemark);
|
||||
uni.request({
|
||||
url: util.apiurl + 'rest/db/opensql',
|
||||
data: {
|
||||
token: getApp().globalData.Token,
|
||||
format: 'json',
|
||||
data: {
|
||||
db_name: getApp().globalData.AppDBName,
|
||||
sql_command_id: 'APP.StoreGoods.GetStoreGoodsMasterGoodsCode',
|
||||
params: [{
|
||||
name: 'SID',
|
||||
value: this.item.StoreNameID
|
||||
}, {
|
||||
name: 'OID',
|
||||
value: this.item.OwnerID
|
||||
}, {
|
||||
name: 'CID',
|
||||
value: this.customerID
|
||||
}, {
|
||||
name: 'FGID',
|
||||
value: this.item.FabricGoodsID
|
||||
}, {
|
||||
name: 'GradeName',
|
||||
value: this.item.GoodsGradeName
|
||||
}, {
|
||||
name: 'GoodsRemark',
|
||||
value: this.item.GoodsRemark
|
||||
}, {
|
||||
name: 'GCNo',
|
||||
value: '%' + this.GoodsCodeNo + '%'
|
||||
}, {
|
||||
name: 'GCName',
|
||||
value: '%' + this.GoodsCodeName + '%'
|
||||
}]
|
||||
},
|
||||
},
|
||||
success: (res) => {
|
||||
this.triggered = false;
|
||||
let data = res.data.data;
|
||||
if (that.pageIndex == 1) {
|
||||
that.list = [];
|
||||
}
|
||||
if (res.data == 20) {
|
||||
that.pageIndex += 1;
|
||||
that.isMore = true;
|
||||
} else {
|
||||
that.isMore = false;
|
||||
}
|
||||
that.list = that.list.concat(data);
|
||||
console.log("----->>" + JSON.stringify(that.list));
|
||||
},
|
||||
})
|
||||
},
|
||||
|
||||
// 客户点击方法
|
||||
StoreGoodsCodeCardClickFun: function(item) {
|
||||
uni.$emit('bjdKehuBindFun', {
|
||||
CustomerID: item.CustomerID,
|
||||
CustomerName: item.CustomerName,
|
||||
PlanDepartmentID: item.PlanDepartmentID,
|
||||
PlanDepartmentName: item.PlanDepartmentName,
|
||||
SaleUserID: item.SaleUserID,
|
||||
SaleUserName: item.SaleUserName,
|
||||
Remark: item.Remark,
|
||||
CustomerAddress: item.CustomerAddress,
|
||||
CustomerPhone: item.CustomerPhone,
|
||||
CustomerLinkName: item.CustomerLinkName,
|
||||
/*
|
||||
clientName: item.clientName,
|
||||
clientId: item._id
|
||||
*/
|
||||
})
|
||||
uni.navigateBack()
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
page {
|
||||
background-color: #F8F8F8;
|
||||
padding-bottom: 100rpx;
|
||||
}
|
||||
|
||||
.swiperClass {
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.xiangqing {
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
margin: 16rpx 0;
|
||||
}
|
||||
|
||||
.spXQBox {
|
||||
width: 698rpx;
|
||||
margin: 0 26rpx;
|
||||
background-color: #FFFFFF;
|
||||
padding: 26rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: #d8d8d8 0px 0px 16rpx;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
border: 1rpx solid #E7E7E7;
|
||||
margin: 32rpx 0;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
border-bottom: 1rpx solid #E7E7E7;
|
||||
}
|
||||
|
||||
.row>view:first-child {
|
||||
width: 180rpx;
|
||||
height: 100%;
|
||||
font-size: 28rpx;
|
||||
padding: 0 16rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.row>view:last-child {
|
||||
width: 506rpx;
|
||||
height: 100%;
|
||||
font-size: 28rpx;
|
||||
padding: 16rpx;
|
||||
box-sizing: border-box;
|
||||
border-left: 1rpx solid #E7E7E7;
|
||||
}
|
||||
|
||||
.imgXQ {
|
||||
width: 100%;
|
||||
background-color: #FFFFFF;
|
||||
margin-top: 32rpx;
|
||||
}
|
||||
|
||||
.imgXqtp {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.flexRow {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.xqTitle {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
margin: 26rpx;
|
||||
}
|
||||
|
||||
.addBtn {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
border-radius: 50%;
|
||||
background-image: linear-gradient(45deg, #007aff, #00aaff);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
bottom: 80rpx;
|
||||
right: 26rpx;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.addBtn:active {
|
||||
background-image: linear-gradient(45deg, #00aaff, #007aff);
|
||||
}
|
||||
|
||||
.shopBtn {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
border-radius: 50%;
|
||||
background-image: linear-gradient(45deg, #007aff, #00aaff);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 26rpx;
|
||||
padding: 0;
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
bottom: 190rpx;
|
||||
right: 26rpx;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.shopBtn:active {
|
||||
background-image: linear-gradient(45deg, #00aaff, #007aff);
|
||||
}
|
||||
|
||||
.nameCardBtn {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
border-radius: 50%;
|
||||
background-image: linear-gradient(45deg, #007aff, #00aaff);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 26rpx;
|
||||
padding: 0;
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
bottom: 300rpx;
|
||||
right: 26rpx;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.nameCardBtn:active {
|
||||
background-image: linear-gradient(45deg, #00aaff, #007aff);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,248 @@
|
||||
<template>
|
||||
<view>
|
||||
<searchView placeholderStr="请输入产品名称" @searchViewClickFun="searchEventsFun($event)"></searchView>
|
||||
<dataNull v-if="list.length == 0" src="/static/img/chahua/dataNullXz.png" title="暂无相关产品"
|
||||
title1="请更换查询条件"></dataNull>
|
||||
<scroll-view v-else scroll-y="true" :style="{height: scrollHeight}" @scrolltolower="getChanPinFun"
|
||||
refresher-enabled :refresher-threshold="200" :refresher-triggered="triggered" refresher-background="gray"
|
||||
@refresherrefresh="onRefresh" @refresherrestore="onRestore">
|
||||
<view v-for="(item, index) in list" :key="index" @click="cardClick(item)">
|
||||
<view v-if="item.cpFmtList && item.cpFmtList.length > 0" class="myCard2">
|
||||
<view class="leftImg">
|
||||
<u-image height="160" width="160" border-radius="26" :src="item.cpFmtList[0].url"></u-image>
|
||||
</view>
|
||||
<view class="rightView">
|
||||
<view class="cardTopName1">{{item.pName}}</view>
|
||||
<view v-if="item.salesNum || item.stock" class="xlKcClass">
|
||||
<text v-if="item.salesNum">销量: {{item.salesNum}}</text>
|
||||
<text v-if="item.stock">库存: {{item.stock}}</text>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<text class="redColor">￥{{item.price}}</text>/{{item.unit}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="myCard">
|
||||
<view class="cardTopName">产品名称：{{item.pName}}</view>
|
||||
<view class="cardRow">
|
||||
<view>产品状态：</view>
|
||||
<view>{{item.isSxJ}}</view>
|
||||
</view>
|
||||
<view class="cardRow">
|
||||
<view>产品价格：</view>
|
||||
<view><text class="redColor">￥{{item.price}}</text>/{{item.unit}}</view>
|
||||
</view>
|
||||
<view class="cardRow">
|
||||
<view>产品类型：</view>
|
||||
<view>{{item.cpClassify}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.salesNum">
|
||||
<view>产品销量：</view>
|
||||
<view>{{item.salesNum}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.stock">
|
||||
<view>产品库存：</view>
|
||||
<view>{{item.stock}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.describe">
|
||||
<view>产品简述：</view>
|
||||
<view>{{item.describe}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<getMore :isMore="isMore" class="h100"></getMore>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let that = '';
|
||||
import dataNull from '@/components/dataNull/dataNull.vue'
|
||||
import addBtn from '@/components/addBtn/addBtn.vue'
|
||||
import getMore from '@/components/getMore/getMore.vue'
|
||||
import searchView from '@/components/searchView/searchView.vue'
|
||||
import { crmChanpinApi } from '@/static/utils/api.js'
|
||||
export default {
|
||||
components: {
|
||||
searchView,
|
||||
dataNull,
|
||||
getMore,
|
||||
addBtn
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pageIndex: 1,
|
||||
searchValue: '',
|
||||
list: [],
|
||||
scrollHeight: '667px',
|
||||
triggered: false,
|
||||
isMore: true,
|
||||
sortObj: {
|
||||
update_date: -1
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.scrollHeight = res.windowHeight - 40 + 'px';
|
||||
}
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 获取产品列表
|
||||
getChanPinFun: function() {
|
||||
if (!that.isMore) {
|
||||
return
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
let reqObj = {
|
||||
matchObj: {
|
||||
isSxJ: true
|
||||
},
|
||||
pageIndex: that.pageIndex,
|
||||
searchValue: that.searchValue,
|
||||
sortObj: that.sortObj,
|
||||
}
|
||||
let reqData = {
|
||||
action: 'getCpList',
|
||||
params: reqObj
|
||||
}
|
||||
crmChanpinApi(reqData)
|
||||
.then(res => {
|
||||
let data = res.result.data
|
||||
if (that.pageIndex == 1) {
|
||||
that.list = [];
|
||||
}
|
||||
if (data.length == 20) {
|
||||
that.pageIndex += 1;
|
||||
that.isMore = true;
|
||||
} else {
|
||||
that.isMore = false;
|
||||
}
|
||||
that.triggered = false;
|
||||
that.list = that.list.concat(data);
|
||||
})
|
||||
},
|
||||
// 卡片点击方法
|
||||
cardClick: function(item) {
|
||||
uni.$cpDetail = item;
|
||||
uni.navigateTo({
|
||||
url: './cpDetail?type=client'
|
||||
})
|
||||
},
|
||||
// 搜索框回调函数
|
||||
searchEventsFun: function(e) {
|
||||
that.searchValue = e;
|
||||
that.isMore = true;
|
||||
that.pageIndex = 1;
|
||||
that.getChanPinFun();
|
||||
},
|
||||
// 下拉刷新回调
|
||||
onRefresh: function() {
|
||||
if(that.triggered) return
|
||||
that.triggered = true;
|
||||
that.pageIndex = 1;
|
||||
that.isMore = true;
|
||||
that.getChanPinFun();
|
||||
},
|
||||
onRestore: function(e) {
|
||||
that.triggered = false; // 需要重置
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background-color: #F8F8F8;
|
||||
}
|
||||
.rowBtn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin: 26rpx 16rpx 16rpx 0;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cpBtn {
|
||||
margin: 0 0 0 26rpx;
|
||||
font-size: 15px !important;
|
||||
height: 60rpx !important;
|
||||
line-height: 60rpx !important;
|
||||
}
|
||||
|
||||
.gdCz {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
padding: 6rpx 12rpx;
|
||||
}
|
||||
|
||||
.myCard2 {
|
||||
width: 698rpx;
|
||||
padding: 26rpx;
|
||||
margin: 32rpx 26rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: #d8d8d8 0px 0px 16rpx;
|
||||
position: relative;
|
||||
background-color: #FFFFFF;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cardTopName1 {
|
||||
font-size: 16px;
|
||||
margin-bottom: 8rpx;
|
||||
color: #000000;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
font-weight: bold;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.cardRow1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.cardRow1>view:first-child {
|
||||
width: 176rpx;
|
||||
color: #ADADAD;
|
||||
}
|
||||
|
||||
.cardRow1>view:last-child {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.leftImg {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 26rpx;
|
||||
border-radius: 26rpx;
|
||||
overflow: hidden;
|
||||
border: 1rpx solid #DDDDDD;
|
||||
}
|
||||
|
||||
.rightView {
|
||||
width: 480rpx;
|
||||
}
|
||||
|
||||
.xlKcClass {
|
||||
font-size: 14px;
|
||||
color: #888888;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.xlKcClass>text {
|
||||
margin-right: 26rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,264 @@
|
||||
<template>
|
||||
<view>
|
||||
<searchView placeholderStr="请输入产品名称" @searchViewClickFun="searchEventsFun($event)"></searchView>
|
||||
<dataNull v-if="list.length == 0" src="/static/img/chahua/dataNullXz.png" title="暂无相关产品"
|
||||
title1="请添加或者更换查询条件"></dataNull>
|
||||
<scroll-view v-else scroll-y="true" :style="{height: scrollHeight}" @scrolltolower="getChanPinFun"
|
||||
refresher-enabled :refresher-threshold="200" :refresher-triggered="triggered" refresher-background="gray"
|
||||
@refresherrefresh="onRefresh" @refresherrestore="onRestore">
|
||||
<view v-for="(item, index) in list" :key="index" @click="cardClick(item)">
|
||||
<view v-if="item.cpFmtList && item.cpFmtList.length > 0" class="myCard2">
|
||||
<view class="leftImg">
|
||||
<u-image height="160" width="160" border-radius="26" :src="item.cpFmtList[0].url"></u-image>
|
||||
</view>
|
||||
<view class="rightView">
|
||||
<view class="cardTopName1">{{item.pName}}</view>
|
||||
<view v-if="item.salesNum || item.stock" class="xlKcClass">
|
||||
<text v-if="item.salesNum">销量: {{item.salesNum}}</text>
|
||||
<text v-if="item.stock">库存: {{item.stock}}</text>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<text class="redColor">￥{{item.price}}</text>/{{item.unit}}
|
||||
</view>
|
||||
<view class="rowBtn">
|
||||
<u-button type="primary" :plain="true" class="cpBtn" size="mini" @tap.stop="setCpFun(item)">
|
||||
编辑产品
|
||||
</u-button>
|
||||
<u-button type="warning" :plain="true" class="cpBtn" size="mini"
|
||||
@click="cpsxjFun(item, index)">{{item.isSxJ == '上架' ? '下架' : '上架'}}</u-button>
|
||||
<u-button type="error" :plain="true" class="cpBtn" size="mini"
|
||||
@tap.stop="deleteCpFun(item, index)">
|
||||
删除</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="myCard">
|
||||
<view class="cardTopName">产品名称：{{item.pName}}</view>
|
||||
<view class="cardRow">
|
||||
<view>产品状态：</view>
|
||||
<view>{{item.isSxJ}}</view>
|
||||
</view>
|
||||
<view class="cardRow">
|
||||
<view>产品价格：</view>
|
||||
<view><text class="redColor">￥{{item.price}}</text>/{{item.unit}}</view>
|
||||
</view>
|
||||
<view class="cardRow">
|
||||
<view>产品类型：</view>
|
||||
<view>{{item.cpClassify}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.salesNum">
|
||||
<view>产品销量：</view>
|
||||
<view>{{item.salesNum}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.stock">
|
||||
<view>产品库存：</view>
|
||||
<view>{{item.stock}}</view>
|
||||
</view>
|
||||
<view class="cardRow" v-if="item.describe">
|
||||
<view>产品简述：</view>
|
||||
<view>{{item.describe}}</view>
|
||||
</view>
|
||||
<view class="rowBtn">
|
||||
<u-button type="primary" :plain="true" class="cpBtn" size="mini" @tap.stop="setCpFun(item)">编辑产品
|
||||
</u-button>
|
||||
<u-button type="warning" :plain="true" class="cpBtn" size="mini" @click="cpsxjFun(item, index)">
|
||||
{{item.isSxJ == '上架' ? '下架' : '上架'}}</u-button>
|
||||
<u-button type="error" :plain="true" class="cpBtn" size="mini"
|
||||
@tap.stop="deleteCpFun(item, index)">
|
||||
删除</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<getMore :isMore="isMore" class="h100"></getMore>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let that = '';
|
||||
import dataNull from '@/components/dataNull/dataNull.vue'
|
||||
import addBtn from '@/components/addBtn/addBtn.vue'
|
||||
import getMore from '@/components/getMore/getMore.vue'
|
||||
import searchView from '@/components/searchView/searchView.vue'
|
||||
import { crmChanpinApi } from '@/static/utils/api.js'
|
||||
export default {
|
||||
components: {
|
||||
searchView,
|
||||
dataNull,
|
||||
getMore,
|
||||
addBtn
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pageIndex: 1,
|
||||
searchValue: '',
|
||||
list: [],
|
||||
scrollHeight: '667px',
|
||||
triggered: false,
|
||||
isMore: true,
|
||||
sortObj: {
|
||||
update_date: -1
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.scrollHeight = res.windowHeight - 40 + 'px';
|
||||
}
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 获取产品列表
|
||||
getChanPinFun: function() {
|
||||
if (!that.isMore) {
|
||||
return
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
let reqObj = {
|
||||
pageIndex: that.pageIndex,
|
||||
searchValue: that.searchValue,
|
||||
sortObj: that.sortObj
|
||||
}
|
||||
let reqData = {
|
||||
action: 'get',
|
||||
params: reqObj
|
||||
}
|
||||
crmChanpinApi(reqData)
|
||||
.then(res => {
|
||||
let data = res.result.data
|
||||
if (that.pageIndex == 1) {
|
||||
that.list = [];
|
||||
}
|
||||
if (data.length == 10) {
|
||||
that.pageIndex += 1;
|
||||
that.isMore = true;
|
||||
} else {
|
||||
that.isMore = false;
|
||||
}
|
||||
that.triggered = false;
|
||||
that.list = that.list.concat(data);
|
||||
})
|
||||
},
|
||||
// 卡片点击方法
|
||||
cardClick: function(item) {
|
||||
uni.$cpDetail = item;
|
||||
uni.navigateTo({
|
||||
url: './cpDetail'
|
||||
})
|
||||
},
|
||||
// 搜索框回调函数
|
||||
searchEventsFun: function(e) {
|
||||
that.searchValue = e;
|
||||
that.isMore = true;
|
||||
that.pageIndex = 1;
|
||||
that.getChanPinFun();
|
||||
},
|
||||
// 下拉刷新回调
|
||||
onRefresh: function() {
|
||||
if(that.triggered) return
|
||||
that.triggered = true;
|
||||
that.pageIndex = 1;
|
||||
that.isMore = true;
|
||||
that.getChanPinFun();
|
||||
},
|
||||
onRestore: function(e) {
|
||||
that.triggered = false; // 需要重置
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background-color: #F8F8F8;
|
||||
}
|
||||
.rowBtn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin: 26rpx 16rpx 16rpx 0;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cpBtn {
|
||||
margin: 0 0 0 26rpx;
|
||||
font-size: 15px !important;
|
||||
height: 60rpx !important;
|
||||
line-height: 60rpx !important;
|
||||
}
|
||||
|
||||
.gdCz {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
padding: 6rpx 12rpx;
|
||||
}
|
||||
|
||||
.myCard2 {
|
||||
width: 698rpx;
|
||||
padding: 26rpx;
|
||||
margin: 32rpx 26rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: #d8d8d8 0px 0px 16rpx;
|
||||
position: relative;
|
||||
background-color: #FFFFFF;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cardTopName1 {
|
||||
font-size: 16px;
|
||||
margin-bottom: 8rpx;
|
||||
color: #000000;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
font-weight: bold;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.cardRow1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.cardRow1>view:first-child {
|
||||
width: 176rpx;
|
||||
color: #ADADAD;
|
||||
}
|
||||
|
||||
.cardRow1>view:last-child {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.leftImg {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 26rpx;
|
||||
border-radius: 26rpx;
|
||||
overflow: hidden;
|
||||
border: 1rpx solid #DDDDDD;
|
||||
}
|
||||
|
||||
.rightView {
|
||||
width: 460rpx;
|
||||
}
|
||||
|
||||
.xlKcClass {
|
||||
font-size: 14px;
|
||||
color: #888888;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.xlKcClass>text {
|
||||
margin-right: 26rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,765 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="top-box">
|
||||
<!--
|
||||
<view style="margin-left: 26rpx;" @click="popupShow = true">
|
||||
<text>排序</text>
|
||||
<u-icon name="list-dot"></u-icon>
|
||||
</view>
|
||||
<navigator url="./search" class="top" :class="pageNum == 0 ? 'duanwidth' : ''">
|
||||
<view class="search">
|
||||
<u-icon class="searchIcon" name="search"></u-icon>
|
||||
<text>搜索您要找的商品</text>
|
||||
</view>
|
||||
</navigator>-->
|
||||
<u-search placeholder="请输入查询编号或名称" v-model="searchFabricGoods"
|
||||
@search="getChanPinFun" @custom="getChanPinFun"></u-search>
|
||||
</view>
|
||||
|
||||
<view class="scrollF" :style="{ height: (wHeight - 50) + 'px' }">
|
||||
<scroll-view scroll-y="true" class="leftScrollV">
|
||||
<view v-for="(item, index) in tabBars" :key="index" class="leftCardView">
|
||||
<view class="leftCard" :class="{ leftActive: leftA == index }"
|
||||
@click="selectLeftFl(index)">{{item.FabricTypeName}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="rightSv">
|
||||
<view style="height: 100%; width: 100%;" v-if="tabBars.length > 0">
|
||||
<scroll-view v-for="(tabItem, iii) in tabBars" :key="iii" v-show="leftA == iii" scroll-y="true"
|
||||
style="height: 100%; width: 100%;" @scrolltolower="loadMore" refresher-enabled
|
||||
:refresher-triggered="tabItem.triggered" :refresher-threshold="200" refresher-background="gray" @refresherrefresh="onRefresh" @refresherrestore="onRestore" >
|
||||
<skeleton SkelttionType="classify" v-if="!tabItem.isjz"></skeleton>
|
||||
<view v-else>
|
||||
<view v-if="tabItem.arr.length > 0">
|
||||
<view v-for="(item, index) in tabItem.arr" :key="index" @click="cardClick(item)">
|
||||
<view v-if="item.cpFmtList && item.cpFmtList.length > 0" class="myCard2">
|
||||
<view class="leftImg">
|
||||
<u-image height="160" width="160" :src="item.cpFmtList[0].url"></u-image>
|
||||
</view>
|
||||
<view class="rightView">
|
||||
<view class="cardTopName1">{{item.pName}}</view>
|
||||
<view v-if="item.salesNum || item.stock" class="xlKcClass">
|
||||
<text v-if="item.salesNum">销量: {{item.salesNum}}</text>
|
||||
<text v-if="item.stock">库存: {{item.stock}}</text>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<text class="redColor">￥{{item.price}}</text>/{{item.unit}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="myCard1">
|
||||
<view class="cardTopName">编号：{{item.FabricGoodsNo}}</view>
|
||||
<view class="cardTopName">名称：{{item.FabricGoodsName}}</view>
|
||||
<view class="cardRow1">
|
||||
<view>规格：{{item.GoodsWidth}}</view>
|
||||
<view v-if="item.GoodsWeight">*</view>
|
||||
<view>{{item.GoodsWeight}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view>仓库：{{item.StoreName}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view>所属：{{item.OwnerName}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view>等级：{{item.GoodsGradeName}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view>备注：{{item.GoodsRemark}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view class="mr26">匹数：{{item.Roll}}匹</view>
|
||||
<view class="mr26">数量：{{item.Qty}}{{item.UnitName}}</view>
|
||||
</view>
|
||||
<view class="cardRow1">
|
||||
<view class="mr26">预约：{{item.AllocatedRoll}}匹</view>
|
||||
<view class="mr26">可用：{{item.UseRoll}}匹</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<getMore :isMore="tabBars[tabCurrentIndex].isMore" style="margin-bottom: 16px;"></getMore>
|
||||
<view style="height: 36rpx;"></view>
|
||||
</view>
|
||||
<dataNull v-else src="/static/img/chahua/dataNullXz.png" title="暂无相关产品" title1="请先添加">
|
||||
</dataNull>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<dataNull v-else src="/static/img/chahua/dataNullXz.png" title="暂无相关产品">
|
||||
</dataNull>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!--排序-->
|
||||
<!--
|
||||
<u-popup v-model="popupShow" width="568rpx" mode="right" border-radius="14" :safe-area-inset-bottom="true">
|
||||
<view class="popupCard" v-for="(obj, index) in sxArr" :key="index">
|
||||
<view class="popupTitle">{{obj.title}}</view>
|
||||
<view class="popupItem">
|
||||
<view v-for="(item, iii) in obj.arr" :key="iii" :class="obj.current === iii ? 'activeClass' : ''" @click="sxItemClickFun(index, iii)">{{item}}</view>
|
||||
</view>
|
||||
<view class="flexJs" v-if="obj.judge">
|
||||
<text>等于</text>
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="h200"></view>
|
||||
<view class="popupBottomBtn">
|
||||
<view class="popupBtn warning" @click="resetFun">重置</view>
|
||||
<view class="popupBtn primary" @click="confirmFun">确定</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
-->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let that = '';
|
||||
let windowWidth = 0;
|
||||
import dataNull from '@/components/dataNull/dataNull.vue'
|
||||
import getMore from '@/components/getMore/getMore.vue'
|
||||
import skeleton from '@/components/skeleton/skeleton'
|
||||
//import { crmChanpinApi, crmCpClassifyApi, crmMyAppUserApi } from '@/static/utils/api.js'
|
||||
import util, {playSuccessAudio,playErrorAudio} from '../../common/util.js';
|
||||
export default {
|
||||
components: {
|
||||
skeleton,
|
||||
getMore,
|
||||
dataNull
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
customerID:'0',
|
||||
searchFabricGoods:'',
|
||||
cpClassify: '',
|
||||
cpFlId: '',
|
||||
list: [],
|
||||
pageNum: 0,
|
||||
scrollLeft: 0, //顶部选项卡左滑距离
|
||||
enableScroll: true,
|
||||
tabCurrentIndex: 0,
|
||||
tabBars: [],
|
||||
wHeight: 623,
|
||||
leftA: 0,
|
||||
triggered: false,
|
||||
freshing: false,
|
||||
sortObj: {
|
||||
update_date: -1,
|
||||
salesNum: -1,
|
||||
stock: 1,
|
||||
create_date: -1
|
||||
},
|
||||
popupShow: false,
|
||||
sxArr: [],
|
||||
tabList: [{
|
||||
iconPath: "photo-fill",
|
||||
selectedIconPath: "photo-fill",
|
||||
text: '名片',
|
||||
customIcon: false,
|
||||
},
|
||||
{
|
||||
iconPath: "shopping-cart-fill",
|
||||
selectedIconPath: "shopping-cart-fill",
|
||||
text: '商城',
|
||||
customIcon: false,
|
||||
}
|
||||
],
|
||||
current: 1
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
that = this;
|
||||
that.pageType = e.type ? e.type : '';
|
||||
that.customerID = e.customerid;
|
||||
console.log("---->>>>" + that.customerID);
|
||||
windowWidth = uni.getSystemInfoSync().windowWidth;
|
||||
that.wHeight = uni.getSystemInfoSync().windowHeight;
|
||||
|
||||
that.getClassifyFun();
|
||||
},
|
||||
onShow() {
|
||||
//uni.$userInfo = uni.getStorageSync('userInfo') || {};
|
||||
//that.getClassifyFun();
|
||||
},
|
||||
onShareAppMessage(res) {
|
||||
if (res.from === 'button') { // 来自页面内分享按钮
|
||||
console.log(res.target)
|
||||
}
|
||||
return {
|
||||
title: '您好，这是我的微信小商城，快来查看吧！',
|
||||
path: '/chanpin/view/shop?id=' + that.cardInfo.u_id
|
||||
}
|
||||
},
|
||||
onShareTimeline() {
|
||||
return {
|
||||
title: '您好，这是我的微信小商城，快来查看吧！',
|
||||
imageUrl: '', // 图片 URL
|
||||
query: 'id=' + that.cardInfo.u_id
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
tabbarChangeFun: function(e) {
|
||||
if(e == 0) {
|
||||
uni.redirectTo({
|
||||
url: '../../nameCard/view/previewCard?id=' + that.userId
|
||||
})
|
||||
}
|
||||
},
|
||||
// 查询用户crmUser方法
|
||||
getuserInfoFun: function(id) {
|
||||
let reqData = {
|
||||
action: 'getUserCrmUid',
|
||||
params: {
|
||||
uid: id
|
||||
}
|
||||
}
|
||||
console.log(reqData)
|
||||
uni.showLoading({
|
||||
title: '加载中...'
|
||||
})
|
||||
crmMyAppUserApi(reqData)
|
||||
.then(res => {
|
||||
that.getClassifyFun();
|
||||
})
|
||||
},
|
||||
// 查询分类方法
|
||||
getClassifyFun: function() {
|
||||
/*
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
*/
|
||||
|
||||
uni.request({
|
||||
url: util.apiurl + 'rest/db/opensql',
|
||||
data: {
|
||||
token: getApp().globalData.Token,
|
||||
format: 'json',
|
||||
data: {
|
||||
db_name: getApp().globalData.AppDBName,
|
||||
sql_command_id: 'APP.BaseData.GetFabricTypeData',
|
||||
params: []
|
||||
},
|
||||
},
|
||||
success: (res) => {
|
||||
this.triggered = false;
|
||||
let list = res.data.data;
|
||||
if (list) {
|
||||
for (var i = 0; i < list.length; i++) {
|
||||
list[i].pageIndex = 1;
|
||||
list[i].arr = [];
|
||||
list[i].isMore = false;
|
||||
list[i].triggered = false;
|
||||
}
|
||||
list[0].loaded = true;
|
||||
that.tabBars = list;
|
||||
that.cpClassify = list[0].FabricTypeName;
|
||||
that.cpFlId = list[0].FabricTypeID;
|
||||
//uni.setStorageSync('classifyList', data.list);
|
||||
that.getChanPinFun();
|
||||
}
|
||||
},
|
||||
})
|
||||
/*
|
||||
crmCpClassifyApi(reqData)
|
||||
.then(res => {
|
||||
console.log(res)
|
||||
let list = res.result.data;
|
||||
console.log(list)
|
||||
if (list) {
|
||||
for (var i = 0; i < list.length; i++) {
|
||||
list[i].pageIndex = 1;
|
||||
list[i].arr = [];
|
||||
list[i].isMore = false;
|
||||
list[i].triggered = false;
|
||||
}
|
||||
list[0].loaded = true;
|
||||
that.tabBars = list;
|
||||
that.cpClassify = list[0].flName;
|
||||
that.cpFlId = list[0]._id;
|
||||
// uni.setStorageSync('classifyList', data.list);
|
||||
that.getChanPinFun();
|
||||
}
|
||||
})*/
|
||||
},
|
||||
// 查询产品方法
|
||||
getChanPinFun: function() {
|
||||
/*
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
*/
|
||||
|
||||
let iii = that.leftA;
|
||||
let loadPi = 1;
|
||||
let aOTypeID = -1;
|
||||
let asearchFabricGoods = this.searchFabricGoods;
|
||||
if (asearchFabricGoods != "")
|
||||
{
|
||||
aOTypeID=0
|
||||
}
|
||||
|
||||
console.log("----->>>" + aOTypeID+'<<<>>' + this.searchFabricGoods);
|
||||
uni.request({
|
||||
url: util.apiurl + 'rest/db/opensql',
|
||||
data: {
|
||||
token: getApp().globalData.Token,
|
||||
format: 'json',
|
||||
data: {
|
||||
db_name: getApp().globalData.AppDBName,
|
||||
sql_command_id: 'APP.StoreGoods.GetStoreGoodsMasterFabricGoods',
|
||||
params: [{
|
||||
name: 'FTypeID',
|
||||
value: that.tabBars[iii].FabricTypeID
|
||||
},{
|
||||
name: 'OTypeID',
|
||||
value: aOTypeID
|
||||
},{
|
||||
name: 'FGNo',
|
||||
value: '%'+this.searchFabricGoods+'%'
|
||||
},{
|
||||
name: 'FGName',
|
||||
value: '%'+this.searchFabricGoods+'%'
|
||||
}]
|
||||
},
|
||||
},
|
||||
success: (res) => {
|
||||
//this.triggered = false;
|
||||
let list = res.data.data;
|
||||
let item = that.tabBars[iii];
|
||||
let arr = that.tabBars[iii].arr;
|
||||
if (item.triggered) {
|
||||
item.triggered = false;
|
||||
that.freshing = false;
|
||||
}
|
||||
if (list.length == 20) {
|
||||
item.isMore = true;
|
||||
item.pageIndex += 1;
|
||||
} else {
|
||||
item.isMore = false;
|
||||
}
|
||||
if (loadPi == 1) {
|
||||
item.arr = list;
|
||||
} else {
|
||||
arr = arr.concat(list);
|
||||
item.arr = arr;
|
||||
}
|
||||
item.isjz = true;
|
||||
that.$set(that.tabBars, iii, item);
|
||||
}
|
||||
})
|
||||
},
|
||||
/*
|
||||
let reqObj = {
|
||||
matchObj: {
|
||||
cpFlId: that.tabBars[iii].FabricTypeID,
|
||||
isSxJ: true,
|
||||
},
|
||||
pageIndex: that.tabBars[iii].pageIndex,
|
||||
sortObj: that.sortObj
|
||||
}
|
||||
let loadPi = reqObj.pageIndex;
|
||||
let reqData = {
|
||||
action: 'getCpList',
|
||||
params: reqObj
|
||||
}
|
||||
console.log(reqData)
|
||||
crmChanpinApi(reqData)
|
||||
.then(res => {
|
||||
let list = res.result.data;
|
||||
let item = that.tabBars[iii];
|
||||
let arr = that.tabBars[iii].arr;
|
||||
if (item.triggered) {
|
||||
item.triggered = false;
|
||||
that.freshing = false;
|
||||
}
|
||||
if (list.length == 20) {
|
||||
item.isMore = true;
|
||||
item.pageIndex += 1;
|
||||
} else {
|
||||
item.isMore = false;
|
||||
}
|
||||
if (loadPi == 1) {
|
||||
item.arr = list;
|
||||
} else {
|
||||
arr = arr.concat(list);
|
||||
item.arr = arr;
|
||||
}
|
||||
item.isjz = true;
|
||||
that.$set(that.tabBars, iii, item);
|
||||
})
|
||||
},
|
||||
*/
|
||||
selectLeftFl: function(i) {
|
||||
this.leftA = i;
|
||||
this.tabCurrentIndex = i;
|
||||
let tabItem = this.tabBars[i];
|
||||
if (tabItem.loaded !== true) {
|
||||
/*
|
||||
uni.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
})
|
||||
*/
|
||||
console.log("----------->" + this.tabCurrentIndex);
|
||||
this.getChanPinFun();
|
||||
tabItem.loaded = true;
|
||||
}
|
||||
},
|
||||
// 上拉加载更多
|
||||
loadMore: function(e) {
|
||||
if (this.tabBars[this.leftA].isMore) {
|
||||
this.getChanPinFun();
|
||||
}
|
||||
},
|
||||
onRefresh() {
|
||||
let item = this.tabBars[this.leftA];
|
||||
if (this.freshing) return;
|
||||
this.freshing = true;
|
||||
if (!item.triggered) //界面下拉触发，triggered可能不是true，要设为true
|
||||
item.triggered = true;
|
||||
item.isMore = true;
|
||||
item.pageIndex = 1;
|
||||
this.$set(this.tabBars, this.leftA, item);
|
||||
this.getChanPinFun();
|
||||
},
|
||||
onRestore() {
|
||||
let item = this.tabBars[this.leftA];
|
||||
item.triggered = false; // 需要重置
|
||||
this.$set(this.tabBars, this.leftA, item);
|
||||
},
|
||||
// 卡片点击方法
|
||||
cardClick: function(item) {
|
||||
if(that.pageType !== '') {
|
||||
uni.$emit('chanpinBindFun', item)
|
||||
uni.navigateBack()
|
||||
} else {
|
||||
console.log(">>>>>" + this.customerID +"<<<<<<<<<");
|
||||
uni.$cpDetail = item;
|
||||
uni.navigateTo({
|
||||
url: './cpDetail?customerid='+ this.customerID +'&obj='+ encodeURIComponent(JSON.stringify(item))
|
||||
})
|
||||
}
|
||||
},
|
||||
sxItemClickFun: function(index, iii) {
|
||||
let item = that.sxArr[index];
|
||||
let list = that.sxArr;
|
||||
for(var i = 0; i < list.length; i++) {
|
||||
if(list[i].isPx) {
|
||||
list[i].current = '';
|
||||
}
|
||||
}
|
||||
item.current = iii;
|
||||
that.$set(that.sxArr, index, item)
|
||||
},
|
||||
// 重置筛选项方法
|
||||
resetFun: function() {
|
||||
let list = that.sxArr;
|
||||
for(var i = 0; i < list.length; i++) {
|
||||
list[i].current = '';
|
||||
}
|
||||
that.sxArr = list;
|
||||
},
|
||||
// 确定筛选项方法
|
||||
confirmFun: function() {
|
||||
that.popupShow = false;
|
||||
let arr = that.sxArr;
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
if (arr[i].isPx && arr[i].current !== '') {
|
||||
console.log(arr[i])
|
||||
let sortObj = {}
|
||||
if (arr[i].field == 'create_date') {
|
||||
sortObj.create_date = arr[i].current == 1 ? 1 : -1
|
||||
}
|
||||
if (arr[i].field == 'update_date') {
|
||||
sortObj.update_date = arr[i].current == 1 ? 1 : -1
|
||||
}
|
||||
if (arr[i].field == 'salesNum') {
|
||||
sortObj.salesNum = arr[i].current == 1 ? 1 : -1
|
||||
}
|
||||
if (arr[i].field == 'stock') {
|
||||
sortObj.stock = arr[i].current == 1 ? 1 : -1
|
||||
}
|
||||
that.sortObj = sortObj;
|
||||
break;
|
||||
}
|
||||
}
|
||||
that.pageIndex = 1;
|
||||
that.isMore = true;
|
||||
that.getChanPinFun();
|
||||
// that.$emit('optionSxFun', that.sxArr);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.top-box {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #FFFFFF;
|
||||
border-bottom: 1rpx solid #EBEEF5;
|
||||
}
|
||||
|
||||
.chuangjian {
|
||||
color: #007AFF;
|
||||
}
|
||||
|
||||
.chuangjian>text:first-child {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.chuangjian>text:last-child {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.top {
|
||||
height: 80rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 20rpx;
|
||||
width: 580rpx;
|
||||
}
|
||||
|
||||
.duanwidth {
|
||||
width: 600rpx !important;
|
||||
}
|
||||
|
||||
.searchIcon {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin: 0 18rpx 0 12rpx;
|
||||
}
|
||||
|
||||
.search {
|
||||
flex: 1;
|
||||
height: 60rpx;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 40rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.rightBtn image {
|
||||
width: 56rpx;
|
||||
height: 56rpx;
|
||||
}
|
||||
|
||||
.scrollF {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.leftScrollV {
|
||||
width: 250rpx;
|
||||
height: 100%;
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.rightSv {
|
||||
width: 590rpx;
|
||||
padding: 0 16rpx;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.leftCard {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
font-size: 30rpx;
|
||||
text-align: left;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin:2rpx 10rpx;
|
||||
}
|
||||
|
||||
.leftCardView:last-child {
|
||||
margin-bottom: 100rpx;
|
||||
}
|
||||
|
||||
.leftActive {
|
||||
background-color: #FFFFFF;
|
||||
color: #007AFF;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.tishi {
|
||||
width: 590rpx;
|
||||
}
|
||||
|
||||
.centerF26 {
|
||||
font-size: 28rpx;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-bottom: 100rpx;
|
||||
color: #696969;
|
||||
}
|
||||
|
||||
.myCard1 {
|
||||
padding: 26rpx 26rpx 10rpx;
|
||||
margin: 32rpx 16rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: #d8d8d8 0px 0px 16rpx;
|
||||
position: relative;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.myCard2 {
|
||||
padding: 26rpx;
|
||||
margin: 32rpx 16rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: #d8d8d8 0px 0px 16rpx;
|
||||
position: relative;
|
||||
background-color: #FFFFFF;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cardTopName1 {
|
||||
font-size: 12px;
|
||||
margin-bottom: 8rpx;
|
||||
color: #000000;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
font-weight: bold;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.cardRow1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 15px;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.cardRow1>view:first-child {
|
||||
--width: max;
|
||||
--color: #ADADAD;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.cardRow1>view:last-child {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.leftImg {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 26rpx;
|
||||
border-radius: 26rpx;
|
||||
overflow: hidden;
|
||||
border: 1rpx solid #DDDDDD;
|
||||
}
|
||||
|
||||
.rightView {
|
||||
width: 288rpx;
|
||||
}
|
||||
.xlKcClass {
|
||||
font-size: 14px;
|
||||
color: #888888;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
/*************************弹窗层******************************/
|
||||
.popupCard {
|
||||
width: 100%;
|
||||
padding: 26rpx 16rpx;
|
||||
border-bottom: 1rpx solid #efefef;
|
||||
}
|
||||
|
||||
.popupTitle {
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 26rpx;
|
||||
}
|
||||
|
||||
.popupItem {
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.popupItem>view {
|
||||
width: 160rpx;
|
||||
text-align: center;
|
||||
padding: 12rpx 20rpx;
|
||||
background-color: #e6e6e6;
|
||||
margin-bottom: 26rpx;
|
||||
border-radius: 16rpx;
|
||||
margin-right: 28rpx;
|
||||
}
|
||||
|
||||
.mr0 {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.flexJs {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.popupBottomBtn {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
background-color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.settingView {
|
||||
width: 128rpx;
|
||||
height: 100% !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.popupBtn {
|
||||
width: 50%;
|
||||
height: 100% !important;
|
||||
line-height: 100rpx;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
.activeClass {
|
||||
background-image: linear-gradient(45deg, #007AFF, #00aaff);
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.warning {
|
||||
background-color: #ff9900;
|
||||
}
|
||||
.warning:active {
|
||||
background-color: #ffaa00;
|
||||
}
|
||||
.primary {
|
||||
background-color: #2979ff;
|
||||
}
|
||||
.primary:active {
|
||||
background-color: #55aaff;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user