Skip to content

O
op-web-service
Commit 777f0c1b authored by mengwenhao's avatar mengwenhao
Browse files
Options

feature:图片上传格式化

parent 58b89060
Show whitespace changes
Inline Side-by-side
Showing with 475 additions and 323 deletions
server/controllers/goods.js
View file @ 777f0c1b
......@@ -77,7 +77,7 @@ exports.postSuccess = async ctx => {
};
ctx.body = await req(ctx, opts);
};
// 检查商品名称是否被占用
exports.checkGoodsName = async ctx => {
const opts = {
url: `${GOODS_URI}/goods/background/check_goods_name`,
......@@ -85,9 +85,9 @@ exports.checkGoodsName = async ctx => {
json: true,
body: ctx.request.body
};
ctx.body = req(ctx, opts);
ctx.body = await req(ctx, opts);
};
// 审核拒绝
exports.auditReject = async ctx => {
const opts = {
url: `${GOODS_URI}/goods/background/audit_reject`,
......@@ -98,3 +98,11 @@ exports.auditReject = async ctx => {
console.log("审核驳回操作", ctx.request.body);
ctx.body = await req(ctx, opts);
};
exports.getShopsList = async ctx => {
const opts = {
url: `${GOODS_URI}/shop/background/shop_list`,
method: "GET",
qs: ctx.request.query
};
ctx.body = await req(ctx, opts);
};
server/router.js
View file @ 777f0c1b
......@@ -45,7 +45,8 @@ router.post(`${API_VERSION}/goods/background/offline`, goods.putOffline);
router.get(`${API_VERSION}/goods/background/get_goods_info`, goods.getGoodsInfo);
router.post(`${API_VERSION}/goods/background/audit_pass`, goods.postSuccess);
router.post(`${API_VERSION}/goods/background/check_goods_name`, goods.checkGoodsName);
router.post(`${API_VERSION}/goods/background/audit_reject`, goods.auditReject)
router.post(`${API_VERSION}/goods/background/audit_reject`, goods.auditReject);
router.get(`${API_VERSION}/shop/background/shop_list`, goods.getShopsList)
//生活号
......
src/pages/Goods/Detail/index.vue
View file @ 777f0c1b
......@@ -97,13 +97,14 @@
<el-upload
:disabled="$route.params.operation !== 'EDIT'"
ref="detailUpload"
action="#"
:action="uploadUrl"
:on-preview="previewImage"
:auto-upload="false"
:auto-upload="true"
:data="{ scenario: `goods` }"
:limit="9"
list-type="picture-card"
multiple
:on-change="handleDetailChange"
:on-success="handleDetailChange"
:on-remove="removeDetailFiles"
:file-list="descPicUrlList"
>
......@@ -196,13 +197,14 @@
>
<template #default="scope">
<span>经度：{{ scope.row.longitude }}</span>
&nbsp; &nbsp;
<br />
<span>纬度：{{ scope.row.latitude }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
fixed="right"
>
<template #default="scope">
<el-button
......@@ -217,16 +219,74 @@
placement="bottom"
:width="600"
trigger="click"
v-model:visible="addShopDialog"
>
<template #reference>
<el-button
@click="getShops"
type="primary"
style="border-radius:20px;margin:20px 0 0 50%;transform: translate(-50%,0);"
>添加门店
>门店列表
</el-button>
</template>
<!-- 门店列表 -->
<el-table :data="shopsList.result">
<el-table-column
type="selection"
width="55"
> </el-table-column>
<el-table-column
align="center"
prop="shop_name"
label="门店名称"
></el-table-column>
<el-table-column
align="center"
prop="phone"
label="联系电话"
></el-table-column>
<el-table-column
align="center"
prop="address"
label="地址"
></el-table-column>
<el-table-column
align="center"
label="地理定位"
>
<template #default="scope">
<span>经度：{{ scope.row.longitude }}</span>
<br />
<span>纬度：{{ scope.row.latitude }}</span>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination
style="margin-top:20px"
background
@current-change="changeShopListPage"
v-model:currentPage="shopCurrentPage"
:page-size="5"
layout="total, prev, pager, next"
:total="shopsList.count"
>
</el-pagination>
<!-- 添加门店弹窗 -->
<el-popover
placement="bottom"
:width="600"
trigger="click"
>
<template #reference>
<el-button
type="primary"
style="border-radius:20px;margin:20px 0 0 50%;transform: translate(-50%,0);"
>添加门店
</el-button>
</template>
<!-- 添加门店表单 -->
<el-form
label-position="right"
label-width="100px"
......@@ -255,9 +315,9 @@
</el-form>
<section style="display:flex;justify-content:center;">
<el-button type="primary">保存</el-button>
<el-button @click="addShopDialog = false">取消</el-button>
</section>
</el-popover>
</el-popover>
</section>
<section class="width50p">
<h4 style="margin-bottom:20px">价格信息</h4>
......@@ -270,10 +330,16 @@
</el-form-item> -->
<el-form-item label="售价">
<el-input v-model="goodsObj.price"></el-input>
<el-input
v-model="goodsObj.price"
@input="salePrice"
></el-input>
</el-form-item>
<el-form-item label="原价">
<el-input v-model="goodsObj.original_price"></el-input>
<el-input
v-model="goodsObj.original_price"
@input="perPrice"
></el-input>
</el-form-item>
<h4 style="margin:20px 0">库存信息</h4>
<el-form-item label="剩余库存量:">
......@@ -326,14 +392,8 @@
</el-form-item>
<el-form-item label="使用日期：">
<el-radio-group v-model="goodsObj.rule_date_type">
<el-radio
label="周末、节假日通用"
:value="1"
></el-radio>
<el-radio
label="仅工作日可用"
:value="2"
></el-radio>
<el-radio :label="1">周末、节假日通用</el-radio>
<el-radio :label="2">仅工作日可用</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="使用时间：">
......@@ -471,9 +531,12 @@ import {
getGoodsList,
postSuccess,
auditReject,
checkGoodsName
checkGoodsName,
getShopsList
} from "@/service/Goods/goods";
import { GOODS_URI } from "../../../../server/config.js";
export default {
name: "GoodsDetail",
......@@ -519,8 +582,10 @@ export default {
watch: {
goodsObj (val) {
this.optionsValue = [val.category_1_id, val.category_2_id];
this.useTime = this.formatDate(val.rule_start_time, val.rule_end_time);
console.log("初始化时间", this.useTime);
this.rulesForm.useTime = this.formatDate(
val.rule_start_time,
val.rule_end_time
);
}
},
......@@ -541,11 +606,16 @@ export default {
optionList: [], // 商品分类选项
optionsValue: [], // 商品分类的值
// 商品回显信息
goodsObj: {},
descPicUrlList: [], // 商品详情图列表
introducePicUrlList: [], // 商品介绍图列表
goodsObj: {
introduce: ""
},
descPicUrlList: [], // 商品详情图回显列表
introducePicUrlList: [], // 商品介绍图回显列表
recordList: [], // 提交记录
uploadFileList: [], // 上传图片列表
detailUploadList: [], // 上传图片列表
inventoryNumber: 0, // 库存数量
// 使用规则表单
......@@ -571,7 +641,10 @@ export default {
reason: ""
},
// 门店表单
shopsList: [], // 门店列表
shopCurrentPage: 1, // 门店列表当前页
// 新增门店表单
shopForm: {
shop_name: "",
connect_phone: "",
......@@ -579,10 +652,16 @@ export default {
deep_place: ""
},
shopList: [], // 门店列表
addShopDialog: false, // 添加门店弹框
rejectVisible: false, // 驳回原因弹框展示状态
showShopDialog: false, // 是否展示门店列表
popoverImage: "", // 放大显示图
isShowPopver: false // 是否展示图片框
rejectVisible: false, // 驳回原因弹框展示状态
isShowPopver: false, // 是否展示图片框
uploadUrl: `${GOODS_URI}/merchant/lifeinner/upload` // 金山云上传地址
};
},
......@@ -610,25 +689,66 @@ export default {
this.recordLits = record_list;
// 格式化商品详情照片
goods_info.desc_pic_url_list.forEach(item => {
const obj = new Object();
obj.url = item;
this.descPicUrlList.push(obj);
});
this.formatPicture(goods_info.desc_pic_url_list, this.descPicUrlList);
// 格式化商品介绍照片
goods_info.introduce_pic_url_list.forEach(item => {
this.formatPicture(
goods_info.introduce_pic_url_list,
this.introducePicUrlList
);
// 格式化文件上传列表
this.formatUploadPictureList(
goods_info.desc_pic_url_list,
this.detailUploadList
);
// 格式化初始日期
} catch (error) {
console.error(error);
}
},
// 格式化照片列表
formatPicture (willFormat, willStorage) {
willFormat.forEach(item => {
const obj = new Object();
obj.url = item;
this.introducePicUrlList.push(obj);
willStorage.push(obj);
});
},
// 格式化初始日期
} catch (error) {
console.error(error);
// 格式化上传照片列表
formatUploadPictureList (willFormat, willStorage) {
// 格式化上传文件列表
for (let i = 0; i < willFormat.length; i++) {
if (willFormat.length === 0) {
return (this.detailUploadList = []);
}
const objectUrl = new URL(willFormat[i]);
console.log(objectUrl);
const bucketName = objectUrl.hostname;
const objectId = objectUrl.pathname;
willStorage.push(`${bucketName}${objectId}`);
}
},
// 获取门店列表
async getShops () {
const query = {
// this.goodsObj.life_account_id
life_account_id: "9233473057619969",
page: this.shopCurrentPage,
page_size: 5
};
const res = await getShopsList(query);
if (res.code !== 0) return this.$message.error(res.reason);
this.shopsList = res;
},
// 商品列表换页
changeShopListPage (page) {
this.shopCurrentPage = page;
this.getShops();
},
// 格式化日期
formatDate (startTime, endTime) {
const nowTime = new Date();
......@@ -639,12 +759,20 @@ export default {
const endTimeArray = endTime.split(":");
const startHour = parseInt(startTimeArray[0]);
const startMinute = parseInt(startTimeArray[1]);
const startSecond = parseInt(startTimeArray[2]);
const endHour = parseInt(endTimeArray[0]);
const endMinute = parseInt(endTimeArray[1]);
const endSecond = parseInt(endTimeArray[2]);
return [
new Date(nowYear, nowMonth, nowDate, startHour, startMinute),
new Date(nowYear, nowMonth, nowDate, endHour, endMinute)
new Date(
nowYear,
nowMonth,
nowDate,
startHour,
startMinute,
startSecond
),
new Date(nowYear, nowMonth, nowDate, endHour, endMinute, endSecond)
];
},
......@@ -657,7 +785,7 @@ export default {
async checkSameName () {
const res = await checkGoodsName({
life_account_id: this.goodsObj.life_account_id,
name: this.goodsObj.goods_name,
goods_name: this.goodsObj.goods_name,
goods_spu_id: this.goodsObj.goods_spu_id
});
console.log(res);
......@@ -665,9 +793,14 @@ export default {
this.$message.success("商品名称未被占用");
},
// 商品详情图更改
handleDetailChange (file, fileList) {
console.log(fileList);
// 商品详情图上传成功时
handleDetailChange (res, file, fileList) {
console.log("返回结果", res);
console.log("文件", file);
console.log("文件列表", fileList);
const newFile = `${res.result.bucket}/${res.result.object_id}`;
this.detailUploadList.push(newFile);
console.log("上传成功了的一个小小的无所谓的bucket+objectid", this.detailUploadList);
},
// 商品详情图删除完成后的钩子
......@@ -695,10 +828,6 @@ export default {
deleteShops (shopId) {
console.log(shopId);
},
// 更改已选门店
handleSelectionChange (value) {
console.log(value);
},
// 选择时间
pickerTime (time) {
......@@ -708,6 +837,20 @@ export default {
console.log("时间节点", dateTime1, dateTime2);
},
// 更改售价
salePrice (value) {
if (value.length === 0) value = 0;
this.goodsObj.price = parseFloat(value).toFixed(2);
console.log("售价", this.goodsObj.price);
},
// 更改原价
perPrice (value) {
if (value.length === 0) value = 0;
this.goodsObj.original_price = parseFloat(value).toFixed(2);
console.log("原价", this.goodsObj.original_price);
},
// 审核通过
async onSuccess () {
const res = await postSuccess(this.$route.params.spuId);
......@@ -718,14 +861,15 @@ export default {
// 审核拒绝
async onDefault () {
if (!this.rejectReason.reason) return this.$message.error("审核驳回时，驳回原因不能为空");
if (!this.rejectReason.reason)
return this.$message.error("审核驳回时，驳回原因不能为空");
const query = {
goods_spu_id: this.goodsObj.goods_spu_id,
refuse_reason: this.rejectReason.reason
rejected_reason: this.rejectReason.reason
};
const res = await auditReject(query);
if (res.code !== 0) return this.$message.error(res.reason);
this.$message.danger("审核驳回成功!");
this.$message.warning("审核驳回成功!");
this.$router.replace({ name: "GoodsList" });
},
......
src/pages/Goods/List/index.css
View file @ 777f0c1b
.list {
margin-top: 30px;
}
.list .goods {
margin-top: 30px;
.goods {
width: 100%;
height: 100%;
padding: 0 30px;
}
.list .goods .search_condition {
.goods .search_condition {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
}
.list .goods .search_condition .search_button {
.goods .search_condition .search_button {
display: flex;
align-items: center;
justify-self: flex-end;
}
.list .goods .search_condition .search_button .el-form-item__content {
.goods .search_condition .search_button .el-form-item__content {
display: flex;
justify-content: space-around;
}
.list .goods .commodity_list {
.goods .commodity_list {
margin-top: 30px;
}
.list .goods .pagination {
.goods .pagination {
margin-top: 30px;
}
src/pages/Goods/List/index.less
View file @ 777f0c1b
.list {
margin-top: 30px;
.goods {
margin-top: 30px;
.goods {
width: 100%;
height: 100%;
padding: 0 30px;
.search_condition {
display: flex;
......@@ -24,5 +23,4 @@
.pagination {
margin-top: 30px;
}
}
}
src/pages/Goods/List/index.vue
View file @ 777f0c1b
<template>
<div class="list">
<el-card class="goods">
<!-- 筛选区 -->
<el-form
......@@ -214,7 +213,6 @@
>
</el-pagination>
</el-card>
</div>
</template>
<style lang="less" src="./index.less" scope></style>
......
src/service/Goods/goods.js
View file @ 777f0c1b
......@@ -53,3 +53,8 @@ export async function checkGoodsName (params) {
);
return res;
}
// 获取门店表单
export async function getShopsList (params) {
const res = await axios.get("api/v1/shop/background/shop_list", { params });
return res;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment