提交 9d3f1cb6 authored 作者: 刘旭's avatar 刘旭

添加商品配件

上级 c30530c4
......@@ -50,7 +50,8 @@ const handleCreated = (editor: any) => {
}
const handleChange = (editor: any) => {
emits('htmlChange', editor.children)
const html = editor.getHtml()
emits('htmlChange', html)
}
</script>
\ No newline at end of file
......@@ -28,133 +28,6 @@ const menuList = computed(() => {
return store.getters['menu/getMenuList']
})
// let menuList = reactive([
// {
// path: '/dashboard',
// component: "Layout",
// meta: {
// title: "首页",
// icon: "HomeFilled",
// roles: ["sys:manage"]
// },
// children: []
// },
// {
// path: "/system",
// component: "Layout",
// alwaysShow: true,
// name: "system",
// meta: {
// title: "系统管理",
// icon: "Menu",
// roles: ["sys:manage"],
// parentId: 0,
// },
// children: [
// {
// path: "/department",
// component: "/system/department/department",
// alwaysShow: false,
// name: "department",
// meta: {
// title: "机构管理",
// icon: "Platform",
// roles: ["sys:dept"],
// parentId: 17,
// },
// },
// {
// path: "/userList",
// component: "/system/User/UserList",
// alwaysShow: false,
// name: "userList",
// meta: {
// title: "用户管理",
// icon: "el-icon-s-custom",
// roles: ["sys:user"],
// parentId: 17,
// },
// },
// {
// path: "/roleList",
// component: "/system/Role/RoleList",
// alwaysShow: false,
// name: "roleList",
// meta: {
// title: "角色管理",
// icon: "el-icon-s-tools",
// roles: ["sys:role"],
// parentId: 17,
// },
// },
// {
// path: "/menuList",
// component: "/system/Menu/MenuList",
// alwaysShow: false,
// name: "menuList",
// meta: {
// title: "权限管理",
// icon: "el-icon-document",
// roles: ["sys:menu"],
// parentId: 17,
// },
// },
// ],
// },
// {
// path: "/goods",
// component: "Layout",
// alwaysShow: true,
// name: "goods",
// meta: {
// title: "商品管理",
// icon: "el-icon-document",
// roles: ["sys:goods"],
// parentId: 0,
// },
// children: [
// {
// path: "/goodCategory",
// component: "/goods/goodsCategory/goodsCategoryList",
// alwaysShow: false,
// name: "goodCategory",
// meta: {
// title: "商品分类",
// icon: "el-icon-document",
// roles: ["sys:goodsCategory"],
// parentId: 34,
// },
// },
// ],
// },
// {
// path: "/systenConfig",
// component: "Layout",
// alwaysShow: true,
// name: "systenConfig",
// meta: {
// title: "系统工具",
// icon: "el-icon-document",
// roles: ["sys:systenConfig"],
// parentId: 0,
// },
// children: [
// {
// path: "/document",
// component: "/system/config/systemDocument",
// alwaysShow: false,
// name: "http://42.193.158.170:8089/swagger-ui/index.html",
// meta: {
// title: "接口文档",
// icon: "el-icon-document",
// roles: ["sys:document"],
// parentId: 42,
// },
// },
// ],
// },
// ]);
const isCollapse = computed(() => {
// return store.getters['getCollapse']
return store.getters['menu/getCollapse']
......
......@@ -37,6 +37,7 @@
<el-upload :action="uploadPath" :show-file-list="false" :headers="headers"
:on-success="uploadPicUrl" class="avatar-uploader" accept=".jpg,.jpeg,.png,.gif">
<img v-if="goods.picUrl" :src="goods.picUrl" class="avatar" />
<!-- <img v-if="goods.picUrl" :src="'http://192.168.0.23' + goods.picUrl" class="avatar" /> -->
<el-icon v-else class="avatar-uploader-icon">
<Plus />
</el-icon>
......@@ -66,6 +67,21 @@
<el-button v-else class="button-new-keyword" type="primary" @click="showInput">+ 增加</el-button>
</el-form-item>
<el-form-item label="商品配件">
<el-select v-model="goods.parts" multiple collapse-tags collapse-tags-tooltip style="width: 240px">
<el-option v-for="item in partsList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<!-- <el-form-item label="商品配件">
<el-tag v-for="tag in parts" :key="tag" closable type="primary" @close="handlePartsClose(tag)">
{{ tag }}
</el-tag>
<el-input v-if="newPartsVisible" ref="newKeywordInput" v-model="newPart" class="input-new-keyword"
@keyup.enter.native="handlePartsConfirm" @blur="handlePartsConfirm" />
<el-button v-else class="button-new-keyword" type="primary" @click="showPartsInput">+ 增加</el-button>
</el-form-item> -->
<el-form-item label="所属分类">
<el-cascader v-model="categoryIds" :options="categoryList" expand-trigger="hover" clearable
@change="handleCategoryChange" />
......@@ -94,8 +110,8 @@
<el-row :gutter="20" type="flex" align="middle" style="padding: 20px 0">
<el-col :span="10">
<el-radio-group v-model="multipleSpec" @change="specChanged">
<el-radio-button :label="false">默认标准规格</el-radio-button>
<el-radio-button :label="true">多规格支持</el-radio-button>
<!-- <el-radio-button :label="false">默认标准规格</el-radio-button> -->
<el-radio-button :label="false">多规格支持</el-radio-button>
</el-radio-group>
</el-col>
<el-col v-if="multipleSpec" :span="10">
......@@ -243,15 +259,19 @@
<script setup lang="ts">
import { ref, computed, nextTick } from "vue";
import { detailGoods, editGoods, listCatAndBrand } from "@/services/api/commodityManage/list";
import { createStorage, uploadPath } from "@/services/api/storage";
import { uploadPath } from "@/services/api/storage";
import { ElMessageBox, ElMessage, ElNotification } from "element-plus";
import richTextEditor from '@/components/richTextEditor.vue'
import router from '@/router'
import { listGoods } from "@/services/api/commodityManage/list";
let route: any = router
let newKeywordVisible = ref(false);
let newPartsVisible = ref(false);
let newKeyword = ref("");
let keywords = ref([] as any);
let parts = ref([] as any);
let newPart = ref("");
let galleryFileList = ref([] as any);
let categoryIds = ref([] as any);
let categoryList = ref([] as any);
......@@ -270,13 +290,13 @@ let goods = ref({
brief: "",
detail: '<p>你好啊!!</p>',
categoryId: undefined,
keywords: undefined,
parts: undefined
} as any);
let specVisiable = ref(false);
let specForm = ref({ specification: "", value: "", picUrl: "" } as any);
let multipleSpec = ref(false);
let specifications = ref([
{ specification: "规格", value: "标准", picUrl: "" },
]);
let specifications = ref([] as any);
let productVisiable = ref(false);
let productForm = ref({
id: 0,
......@@ -298,9 +318,23 @@ let rules = ref({
});
let headers = computed(() => {
return { Authorization: localStorage.getItem("token") };
return { Authorization: sessionStorage.getItem("token") };
});
let partsList = ref()
let initList = () => {
listGoods({
page: 1,
limit: 10,
sort: "add_time",
order: "desc",
}).then((res: any) => {
if (res.code === 200) {
partsList.value = res.data.list;
}
})
}
initList()
let init = () => {
// if (route.options.history.location.split('=').length > 1) {
// var goodsId = route.options.history.location.split('=')[1]
......@@ -322,7 +356,6 @@ let init = () => {
products.value = res.data.products;
attributes.value = res.data.attributes;
categoryIds.value = res.data.categoryIds;
console.log(categoryIds.value, 'categoryIds.value');
galleryFileList.value = [];
for (var i = 0; i < goods.value?.gallery.length; i++) {
......@@ -343,17 +376,14 @@ let init = () => {
}
init()
let htmlChange = (value: any) => {
// console.log('富文本value', value);
let htmlChange = (value: any) => goods.value.detail = value
}
let handleCategoryChange = (value: any) => {
goods.value.categoryId = value[value.length - 1];
}
let handleCancel = () => {
// $store.dispatch("tagsView/delView", $route);
// $router.push({ path: "/goods/list" });
route.push({ path: "/commodity/list" });
}
let handleEdit = () => {
const finalGoods = {
......@@ -369,8 +399,7 @@ let handleEdit = () => {
title: "成功",
message: "编辑成功",
});
// $store.dispatch("tagsView/delView", $route);
router.push({ path: "/goods/list" });
router.push({ path: "/commodity/list" });
})
.catch((res: any) => {
ElMessageBox.alert("业务错误:" + res.data.errmsg, "警告", {
......@@ -384,11 +413,15 @@ let handleClose = (tag: any) => {
goods.value.keywords = keywords.value.toString();
}
let handlePartsClose = (tag: any) => {
parts.value.splice(parts.value.indexOf(tag), 1);
goods.value.parts = keywords.value.toString();
}
let showInput = () => {
newKeywordVisible.value = true;
nextTick(() => {
// $refs.newKeywordInput.$refs.input.focus();
});
}
let showPartsInput = () => {
newPartsVisible.value = true;
}
let handleInputConfirm = () => {
const newKeywords: string = newKeyword.value;
......@@ -399,6 +432,15 @@ let handleInputConfirm = () => {
newKeywordVisible.value = false;
newKeyword.value = "";
}
let handlePartsConfirm = () => {
const newParts: string = newPart.value;
if (newParts) {
parts.value.push(newParts);
goods.value.parts = parts.value.toString();
}
newPartsVisible.value = false;
newPart.value = "";
}
let uploadPicUrl = (res: any) => {
goods.value.picUrl = res.data.url;
}
......@@ -409,9 +451,9 @@ let uploadOverrun = () => {
});
}
let handleGalleryUrl = (res: any, file: any, fileList: any) => {
if (res.errno === 0) {
goods.value.gallery.push(res.data.url);
}
// if (res.errno === 0) {
goods.value.gallery.push(res.data.url);
// }
}
let handleRemove = (file: any, fileList: any) => {
for (let i = 0; i < goods.value.gallery.length; i++) {
......@@ -448,7 +490,7 @@ let uploadSpecPicUrl = (res: any) => {
specForm.value.picUrl = res.data.url;
}
let handleSpecificationShow = () => {
specForm = { specification: "", value: "", picUrl: "" };
specForm.value = { specification: "", value: "", picUrl: "" };
specVisiable.value = true;
}
let handleSpecificationAdd = () => {
......
......@@ -51,7 +51,10 @@
<el-table-column align="center" property="iconUrl" label="图片">
<template #default="scope">
<el-image :src="scope.row.picUrl" style="width: 40px; height: 40px"></el-image>
<el-image v-if="scope.row.picUrl.split('http').length > 1" :src="scope.row.picUrl"
style="width: 40px; height: 40px"></el-image>
<img v-else :src="'http://192.168.0.23' + scope.row.picUrl" style="width: 40px; height: 40px" />
<!-- <el-image :src="thumbnail(scope.row.picUrl)"
:preview-src-list="toPreview(scope.row, scope.row.picUrl)" style="width: 40px; height: 40px" /> -->
</template>
......@@ -102,17 +105,14 @@
<el-table-column align="center" label="操作" width="200" class-name="small-padding fixed-width">
<template #default="scope">
<el-button type="primary" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
<el-button type="primary" link @click="handleUpdate(scope.row)">编辑</el-button>
<el-button type="danger" link @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<litemall-page :page-data="listQuery" :total="total" @size-change="sizeChange"
@current-change="currentChange" />
<!-- <el-tooltip placement="top" content="返回顶部">
<back-to-top :visibility-height="100" />
</el-tooltip> -->
</div>
</template>
......@@ -175,9 +175,6 @@ let handleCreate = () => {
router.push({ path: "/commodity/shelves" });
};
let handleUpdate = (row: any) => {
console.log(row.id);
let commodityId = row.id
localStorage.setItem('commodityId', commodityId)
router.push({ path: "/commodity/edit", query: { id: row.id } });
};
let showDetail = (detail: any) => {
......
......@@ -34,9 +34,10 @@
</el-form-item>
<el-form-item label="商品图片">
<el-upload :action="uploadPath" :show-file-list="false" :headers="headers"
:on-success="uploadPicUrl" class="avatar-uploader" accept=".jpg,.jpeg,.png,.gif">
<img v-if="goods.picUrl" :src="goods.picUrl" class="avatar" />
<el-upload :action="uploadPath" :limit="1" :show-file-list="false" :headers="headers"
:on-success="uploadPicUrl" list-type="picture" class="avatar-uploader"
accept=".jpg,.jpeg,.png,.gif">
<img v-if="goods.picUrl" :src="'http://192.168.0.23' + goods.picUrl" class="avatar" />
<el-icon v-else class="avatar-uploader-icon">
<Plus />
</el-icon>
......@@ -66,6 +67,21 @@
<el-button v-else class="button-new-keyword" type="primary" @click="showInput">+ 增加</el-button>
</el-form-item>
<!-- <el-form-item label="商品配件">
<el-tag v-for="tag in parts" :key="tag" closable type="primary" @close="handlePartsClose(tag)">
{{ tag }}
</el-tag>
<el-input v-if="newPartsVisible" ref="newKeywordInput" v-model="newPart" class="input-new-keyword"
@keyup.enter.native="handlePartsConfirm" @blur="handlePartsConfirm" />
<el-button v-else class="button-new-keyword" type="primary" @click="showPartsInput">+ 增加</el-button>
</el-form-item> -->
<el-form-item label="商品配件">
<el-select v-model="goods.parts" multiple collapse-tags collapse-tags-tooltip style="width: 240px">
<el-option v-for="item in partsList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="所属分类">
<el-cascader :options="categoryList" expand-trigger="hover" clearable
@change="handleCategoryChange" />
......@@ -83,7 +99,6 @@
</el-form-item>
<el-form-item label="商品详细介绍">
<!-- <editor v-model="goods.detail" :init="editorInit" /> -->
<richTextEditor :valueHtml='goods.detail' @htmlChange="htmlChange" />
</el-form-item>
</el-form>
......@@ -94,7 +109,7 @@
<el-row :gutter="20" type="flex" align="middle" style="padding: 20px 0">
<el-col :span="10">
<el-radio-group v-model="multipleSpec" @change="specChanged">
<el-radio-button :label="false">默认标准规格</el-radio-button>
<!-- <el-radio-button :label="false">默认标准规格</el-radio-button> -->
<el-radio-button :label="true">多规格支持</el-radio-button>
</el-radio-group>
</el-col>
......@@ -107,9 +122,9 @@
<el-table-column property="specification" label="规格名" />
<el-table-column property="value" label="规格值">
<template #default="scope">
<el-tag type="primary">
{{ scope.row.value }}
</el-tag>
<!-- <el-tag type="primary"> -->
{{ scope.row.value }}
<!-- </el-tag> -->
</template>
</el-table-column>
<el-table-column property="picUrl" label="规格图片">
......@@ -138,7 +153,11 @@
<el-form-item label="规格图片" prop="picUrl">
<el-upload :action="uploadPath" :show-file-list="false" :headers="headers"
:on-success="uploadSpecPicUrl" class="avatar-uploader" accept=".jpg,.jpeg,.png,.gif">
<img v-if="specForm.picUrl" :src="specForm.picUrl" class="avatar" />
<div v-if="specForm.picUrl">
<!-- <img v-if="specForm.picUrl.split('http').length > 1" :src="specForm.picUrl"
class="avatar" /> -->
<img :src="'http://192.168.0.23' + specForm.picUrl" class="avatar" />
</div>
<i v-else class="el-icon-plus avatar-uploader-icon" />
</el-upload>
</el-form-item>
......@@ -151,7 +170,7 @@
</el-card>
<!-- <el-card class="box-card">
<h3>商品库存</h3>
<h3>商品配件</h3>
<el-table :data="products">
<el-table-column property="value" label="货品规格">
<template #default="scope">
......@@ -241,15 +260,20 @@
</template>
<script setup lang="ts">
import { ref, computed, nextTick } from "vue";
import { ref } from "vue";
import { publishGoods, listCatAndBrand } from "@/services/api/commodityManage/list";
import { createStorage, uploadPath } from "@/services/api/storage";
import { uploadPath } from "@/services/api/storage";
import { ElMessageBox, ElMessage, ElNotification } from "element-plus";
import richTextEditor from '@/components/richTextEditor.vue'
import router from '@/router'
import { listGoods, deleteGoods } from "@/services/api/commodityManage/list";
let newKeywordVisible = ref(false);
let newPartsVisible = ref(false);
let newKeyword = ref("");
let newPart = ref("");
let keywords = ref([] as any);
let parts = ref([] as any);
let categoryList = ref([] as any);
let brandList = ref([] as any);
let goods = ref({
......@@ -264,16 +288,15 @@ let goods = ref({
unit: "",
brandId: "",
brief: "",
detail: '<p>你好啊!!</p>',
detail: '<p></p>',
categoryId: undefined,
keywords: undefined,
parts: undefined
});
let specVisiable = ref(false);
let specForm = ref({ specification: "", value: "", picUrl: "" } as any);
let multipleSpec = ref(false);
let specifications = ref([
{ specification: "规格", value: "标准", picUrl: "" },
]);
let specForm = ref({ specification: "", value: "", picUrl: "" });
let multipleSpec = ref(true);
let specifications = ref([] as any);
let productVisiable = ref(false);
let productForm = ref({
id: 0,
......@@ -282,9 +305,12 @@ let productForm = ref({
number: 0,
url: "",
});
let headers = ref({ 'Authorization': sessionStorage.getItem("token") })
let products = ref([
{ id: 0, specifications: ["标准"], price: 0.0, number: 0, url: "" },
]);
let attributeVisiable = ref(false);
let attributeForm = ref({ attribute: "", value: "" } as any);
let attributes = ref([] as any);
......@@ -293,10 +319,6 @@ let rules = ref({
name: [{ required: true, message: "商品名称不能为空", trigger: "blur" }],
});
let headers = computed(() => {
return { Authorization: localStorage.getItem("token") };
});
let init = () => {
listCatAndBrand().then((res: any) => {
categoryList.value = res.data.categoryList;
......@@ -305,24 +327,36 @@ let init = () => {
}
init()
let htmlChange = (value: any) => {
console.log('富文本value', value);
let partsList = ref()
let initList = () => {
listGoods({
page: 1,
limit: 10,
sort: "add_time",
order: "desc",
}).then((res: any) => {
if (res.code === 200) {
partsList.value = res.data.list;
}
})
}
initList()
let htmlChange = (value: any) => goods.value.detail = value
let handleCategoryChange = (value: any) => {
goods.value.categoryId = value[value.length - 1];
}
let handleCancel = () => {
router.push({ path: "/commodity/list" });
// $store.dispatch("tagsView/delView", $route);
// $router.push({ path: "/goods/list" });
}
let handlePublish = () => {
const finalGoods = {
goods: goods,
specifications: specifications,
products: products,
attributes: attributes,
goods: goods.value,
specifications: specifications.value,
products: products.value,
attributes: attributes.value,
};
publishGoods(finalGoods)
.then((res: any) => {
......@@ -332,7 +366,7 @@ let handlePublish = () => {
message: "创建成功",
});
// $store.dispatch("tagsView/delView", $route);
// $router.push({ path: "/goods/list" });
router.push({ path: "/commodity/list" });
})
.catch((res) => {
ElMessageBox.alert("业务错误:" + res.data.errmsg, "警告", {
......@@ -344,13 +378,17 @@ let handlePublish = () => {
let handleClose = (tag: any) => {
keywords.value.splice(keywords.value.indexOf(tag), 1);
goods.value.keywords = keywords.value.toString();
}
let handlePartsClose = (tag: any) => {
parts.value.splice(parts.value.indexOf(tag), 1);
goods.value.parts = keywords.value.toString();
}
let showInput = () => {
newKeywordVisible.value = true;
nextTick(() => {
// $refs.newKeywordInput.$refs.input.focus();
});
}
let showPartsInput = () => {
newPartsVisible.value = true;
}
let handleInputConfirm = () => {
const newKeywords: string = newKeyword.value;
......@@ -361,6 +399,16 @@ let handleInputConfirm = () => {
newKeywordVisible.value = false;
newKeyword.value = "";
}
let handlePartsConfirm = () => {
const newParts: string = newPart.value;
if (newParts) {
parts.value.push(newParts);
goods.value.parts = parts.value.toString();
}
newPartsVisible.value = false;
newPart.value = "";
}
let uploadPicUrl = (res: any) => {
goods.value.picUrl = res.data.url;
}
......@@ -410,10 +458,13 @@ let uploadSpecPicUrl = (res: any) => {
specForm.value.picUrl = res.data.url;
}
let handleSpecificationShow = () => {
specForm = { specification: "", value: "", picUrl: "" };
specForm.value = { specification: "", value: "", picUrl: "" };
specVisiable.value = true;
}
let handleSpecificationAdd = () => {
console.log(specifications.value);
console.log(specForm.value);
let index = specifications.value.length - 1;
for (let i = 0; i < specifications.value.length; i++) {
const v = specifications.value[i];
......@@ -423,7 +474,7 @@ let handleSpecificationAdd = () => {
type: "warning",
message: "已经存在规格值:" + v.value,
});
specForm.value = {};
specForm.value = { specification: "", value: "", picUrl: "" };
specVisiable.value = false;
return;
} else {
......@@ -432,7 +483,7 @@ let handleSpecificationAdd = () => {
}
}
specifications.value.splice(index + 1, 0, specForm);
specifications.value.splice(index + 1, 0, specForm.value);
specVisiable.value = false;
specToProduct();
......
......@@ -16,7 +16,7 @@
<el-table-column align="center" label="操作" width="200">
<template #default="scope">
<el-button type="primary" size="small" link @click="handleEdit(scope.row)">编辑</el-button>
<el-button type="primary" size="small" link @click="handleConfigure(scope.row.id)">商品配置</el-button>
<el-button type="primary" size="small" link @click="handleConfigure(scope.row.id)">规格配置</el-button>
<el-button type="danger" size="small" link @click="handleDelete(scope.row.id)">删除</el-button>
</template>
</el-table-column>
......
......@@ -37,10 +37,10 @@
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="200" class-name="small-padding fixed-width">
<el-table-column align="center" label="操作" width="200px" class-name="small-padding fixed-width">
<template #default="scope">
<el-button type="primary" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
<el-button type="primary" link @click="handleUpdate(scope.row)">编辑</el-button>
<el-button type="danger" link @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
......@@ -146,11 +146,7 @@ let rules = reactive({
name: [{ required: true, message: "类目名不能为空", trigger: "blur" }],
});
let headers = computed(() => {
return {
'Authorization': localStorage.getItem("token"),
};
});
let headers = ref({ 'Authorization': sessionStorage.getItem("token") })
let getList = () => {
listLoading.value = true;
......
......@@ -95,10 +95,10 @@
<el-table-column align="center" label="物流渠道" prop="shipChannel" />
<el-table-column align="center" label="操作" width="100" class-name="oper">
<el-table-column align="center" label="操作" width="150" class-name="oper">
<template #default="scope">
<el-button type="primary" size="small" @click="handleDetail(scope.row)">详情</el-button>
<el-button type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
<el-button type="primary" link @click="handleDetail(scope.row)">详情</el-button>
<el-button type="danger" link @click="handleDelete(scope.row)">删除</el-button>
<!-- <el-button type="warning" size="small" @click="handlePay(scope.row)">收款</el-button>
<el-button type="primary" size="small" @click="handleShip(scope.row)">发货</el-button>
<el-button type="danger" size="small" @click="handleRefund(scope.row)">退款</el-button> -->
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论