Compare commits
2 Commits
d5512ad8d3
...
472dd212f0
| Author | SHA1 | Date | |
|---|---|---|---|
| 472dd212f0 | |||
| fc627b7666 |
28
src/api/modules/productAccessoryType.ts
Normal file
28
src/api/modules/productAccessoryType.ts
Normal file
@@ -0,0 +1,28 @@
|
||||
import http from "@/api";
|
||||
|
||||
const URL = `product/compat/parts/`;
|
||||
// 配件类型列表
|
||||
export const getProductAccessoryTypeListApi = (params: any) => {
|
||||
return http.get<any>(`${URL}/index`, params);
|
||||
};
|
||||
// 配件类型详情
|
||||
export const getProductAccessoryTypeDetailsApi = (params: any) => {
|
||||
return http.get<any>(`${URL}/read/${params}`);
|
||||
};
|
||||
// 配件类型删除
|
||||
export const getProductAccessoryTypeDelApi = (params: any) => {
|
||||
return http.delete<any>(`${URL}/delete/${params}`);
|
||||
};
|
||||
// 配件类型更新
|
||||
export const getProductAccessoryTypeUpApi = (params: any) => {
|
||||
const { id } = params;
|
||||
return http.put<any>(`${URL}/update/${id}`, params);
|
||||
};
|
||||
//配件类型新增
|
||||
export const getProductAccessoryTypeAddApi = (params: any) => {
|
||||
return http.post<any>(`${URL}/save`, params, {
|
||||
headers: {
|
||||
"Content-Type": "application/x-www-form-urlencoded"
|
||||
}
|
||||
});
|
||||
};
|
||||
33
src/api/modules/productCompatibility.ts
Normal file
33
src/api/modules/productCompatibility.ts
Normal file
@@ -0,0 +1,33 @@
|
||||
import http from "@/api";
|
||||
|
||||
const PRODUCT_Compatibility = `/product/compat`;
|
||||
// 列表
|
||||
export const getProductCompatibilityListApi = (params: any) => {
|
||||
return http.get<any>(`${PRODUCT_Compatibility}/index`, params);
|
||||
};
|
||||
// 详情
|
||||
export const getProductCompatibilityDetailsApi = (params: any) => {
|
||||
return http.get<any>(`${PRODUCT_Compatibility}/read/${params}`);
|
||||
};
|
||||
// 删除
|
||||
export const getProductCompatibilityDelApi = (params: any) => {
|
||||
return http.delete<any>(`${PRODUCT_Compatibility}/delete/${params}`);
|
||||
};
|
||||
// 更新
|
||||
export const getProductCompatibilityUpApi = (params: any) => {
|
||||
const { id } = params;
|
||||
return http.put<any>(`${PRODUCT_Compatibility}/update/${id}`, params);
|
||||
};
|
||||
//新增
|
||||
export const getProductCompatibilityAddApi = (params: any) => {
|
||||
return http.post<any>(`${PRODUCT_Compatibility}/save`, params, {
|
||||
headers: {
|
||||
"Content-Type": "application/x-www-form-urlencoded"
|
||||
}
|
||||
});
|
||||
};
|
||||
//导入
|
||||
export const getProductCompatibilityListImportApi = (params: any) => {
|
||||
return http.post<any>(`${PRODUCT_Compatibility}/import`, params);
|
||||
};
|
||||
//getProductCompatibilityListApi,getProductCompatibilityDetailsApi,getProductCompatibilityDelApi,getProductCompatibilityUpApi,getProductCompatibilityUpApi,getProductCompatibilityAddApi,getProductCompatibilityAddApi
|
||||
1
src/components.d.ts
vendored
1
src/components.d.ts
vendored
@@ -46,7 +46,6 @@ declare module "vue" {
|
||||
ElTabs: typeof import("element-plus/es")["ElTabs"];
|
||||
ElTag: typeof import("element-plus/es")["ElTag"];
|
||||
ElTooltip: typeof import("element-plus/es")["ElTooltip"];
|
||||
ElTree: typeof import("element-plus/es")["ElTree"];
|
||||
ElTreeSelect: typeof import("element-plus/es")["ElTreeSelect"];
|
||||
ElUpload: typeof import("element-plus/es")["ElUpload"];
|
||||
IEpArrowDown: typeof import("~icons/ep/arrow-down")["default"];
|
||||
|
||||
@@ -32,18 +32,18 @@ export const EDIT_FORM_DATA: FormItem[] = [
|
||||
label: "排序: "
|
||||
},
|
||||
{
|
||||
prop: "recommend",
|
||||
prop: "disabled",
|
||||
placeholder: "请输入",
|
||||
type: "radio",
|
||||
label: "是否启用: ",
|
||||
options: [
|
||||
{
|
||||
label: "是",
|
||||
value: 1
|
||||
value: 0
|
||||
},
|
||||
{
|
||||
label: "否",
|
||||
value: 0
|
||||
value: 1
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
export const RULES = {
|
||||
name: [{ required: true, message: "视频名称不能为空 ! ", trigger: "blur" }],
|
||||
category_id1: [{ required: true, message: "视频分类不能为空 ! ", trigger: "blur" }],
|
||||
sort: [{ required: true, message: "视频排序不能为空 ! ", trigger: "blur" }]
|
||||
name: [{ required: true, message: "配件类型不能为空 ! ", trigger: "blur" }],
|
||||
sort: [{ required: true, message: "排序不能为空 ! ", trigger: "blur" }]
|
||||
};
|
||||
|
||||
@@ -15,7 +15,7 @@ export const COLUMNS = [
|
||||
{
|
||||
align: "left",
|
||||
label: "使用状态",
|
||||
prop: "category_name"
|
||||
prop: "disabled"
|
||||
},
|
||||
|
||||
{
|
||||
@@ -26,7 +26,7 @@ export const COLUMNS = [
|
||||
{
|
||||
align: "left",
|
||||
label: "更新时间",
|
||||
prop: "created_at"
|
||||
prop: "updated_at"
|
||||
},
|
||||
// {
|
||||
// align: "center",
|
||||
|
||||
@@ -3,21 +3,17 @@
|
||||
<div class="table-box">
|
||||
<div style="padding-bottom: 16px">
|
||||
<el-button type="primary" @click="handleAdd"> 添加 </el-button>
|
||||
<el-button type="primary" @click="handleExport"> 导出 </el-button>
|
||||
</div>
|
||||
<ProTable
|
||||
ref="proTableRef"
|
||||
:formData="dataStore.formData"
|
||||
:columns="dataStore.columns"
|
||||
:request-api="getVideoListApi"
|
||||
:request-api="getProductAccessoryTypeListApi"
|
||||
:init-param="dataStore.initParam"
|
||||
>
|
||||
<template #image="scope">
|
||||
<el-image :src="scope.row.image ? h + scope.row.image : ''" style="width: 60px; height: 60px" />
|
||||
</template>
|
||||
<template #status="scope">
|
||||
<el-tag :type="scope.row.status == 1 ? 'success' : 'danger'" effect="dark">{{
|
||||
scope.row.status == 1 ? "启用" : "禁用"
|
||||
<template #disabled="scope">
|
||||
<el-tag :type="scope.row.stdisabledatus == 1 ? 'danger' : 'success'" effect="dark">{{
|
||||
scope.row.disabled == 1 ? "禁用" : "启用"
|
||||
}}</el-tag>
|
||||
</template>
|
||||
<template #operation="scope">
|
||||
@@ -43,7 +39,6 @@
|
||||
:formData="dataStore.editFormData"
|
||||
:rules="dataStore.rules"
|
||||
ref="formRef"
|
||||
@handleSelectChangeEmits="handleSelectChangeEmits"
|
||||
>
|
||||
</rulesForm>
|
||||
</div>
|
||||
@@ -65,29 +60,23 @@ import { useMsg } from "@/hooks/useMsg";
|
||||
|
||||
//列表接口
|
||||
import {
|
||||
getVideoListApi,
|
||||
getVideoListExportApi,
|
||||
getVideoListDelApi,
|
||||
getVideoReadApi,
|
||||
getVideoUpdateApi,
|
||||
getVideoSaveApi,
|
||||
getVideoClassListApi
|
||||
} from "@/api/modules/videoList";
|
||||
import { recursiveCompare } from "@/utils/recursiveCompare";
|
||||
// import { getVideoClassListApi } from "@/api/modules/videoClass";
|
||||
getProductAccessoryTypeUpApi,
|
||||
getProductAccessoryTypeAddApi,
|
||||
getProductAccessoryTypeDelApi,
|
||||
getProductAccessoryTypeDetailsApi,
|
||||
getProductAccessoryTypeListApi
|
||||
} from "@/api/modules/productAccessoryType";
|
||||
|
||||
//深拷贝方法
|
||||
import { cloneDeep } from "lodash-es";
|
||||
//表格和搜索條件
|
||||
import { RULE_FORM, FORM_DATA, COLUMNS, EDIT_FORM_DATA, EDIT_RULE_FORM, RULES } from "./constant/index";
|
||||
import { useExport } from "@/hooks/useExport";
|
||||
// 获取 ProTable 元素,调用其获取刷新数据方法(还能获取到当前查询参数,方便导出携带参数)
|
||||
const proTableRef = ref<any>(null);
|
||||
const formRef: any = ref(null);
|
||||
//图片地址
|
||||
import { h } from "@/utils/url";
|
||||
// 数据源
|
||||
const dataStore = reactive<any>({
|
||||
title: "添加视频",
|
||||
title: "添加配件类型",
|
||||
columns: COLUMNS, //列表配置项
|
||||
rules: cloneDeep(RULES), //抽屉表单验证
|
||||
editRuleForm: cloneDeep(EDIT_RULE_FORM),
|
||||
@@ -104,7 +93,7 @@ const handleConfirmClick = () => {
|
||||
if (!formRef.value!.ruleFormRef) return;
|
||||
formRef!.value!.ruleFormRef!.validate((valid: any) => {
|
||||
if (valid) {
|
||||
dataStore.title === "添加视频" ? getVideoSave() : getVideoUpdate();
|
||||
dataStore.title === "添加配件类型" ? getProductAccessoryTypeSave() : getProductAccessoryTypeUpdate();
|
||||
} else {
|
||||
console.log("error submit!");
|
||||
return false;
|
||||
@@ -118,54 +107,54 @@ const resetFields = () => {
|
||||
};
|
||||
//抽屉重置
|
||||
const handleResetClick = () => {
|
||||
if (dataStore.title === "添加视频") {
|
||||
if (dataStore.title === "添加配件类型") {
|
||||
resetFields();
|
||||
} else {
|
||||
getVideoRead(dataStore.selectRow.id);
|
||||
getProductAccessoryTypeRead(dataStore.selectRow.id);
|
||||
}
|
||||
};
|
||||
|
||||
//视频分类接口
|
||||
const getVideoClassList = async () => {
|
||||
const result = await getVideoClassListApi();
|
||||
if (result?.code === 0) {
|
||||
let arr: any[] = [];
|
||||
if (result?.data?.length) {
|
||||
result?.data?.forEach((item: any) => {
|
||||
let obj = {
|
||||
value: item.id,
|
||||
label: item.name
|
||||
};
|
||||
arr.push(obj);
|
||||
});
|
||||
dataStore.formData[1].options = arr;
|
||||
}
|
||||
}
|
||||
};
|
||||
getVideoClassList();
|
||||
// //视频分类接口
|
||||
// const getProductAccessoryTypeClassList = async () => {
|
||||
// const result = await getProductAccessoryTypeClassListApi();
|
||||
// if (result?.code === 0) {
|
||||
// let arr: any[] = [];
|
||||
// if (result?.data?.length) {
|
||||
// result?.data?.forEach((item: any) => {
|
||||
// let obj = {
|
||||
// value: item.id,
|
||||
// label: item.name
|
||||
// };
|
||||
// arr.push(obj);
|
||||
// });
|
||||
// dataStore.formData[1].options = arr;
|
||||
// }
|
||||
// }
|
||||
// };
|
||||
// getProductAccessoryTypeClassList();
|
||||
|
||||
const getVideoClassEditList = async () => {
|
||||
const result = await getVideoClassListApi({ is_show: 1 });
|
||||
if (result?.code === 0) {
|
||||
let arr: any[] = [];
|
||||
if (result?.data?.length) {
|
||||
result?.data?.forEach((item: any) => {
|
||||
let obj = {
|
||||
value: item.id,
|
||||
label: item.name
|
||||
};
|
||||
arr.push(obj);
|
||||
});
|
||||
dataStore.editFormData[1].options = arr;
|
||||
}
|
||||
}
|
||||
};
|
||||
getVideoClassEditList();
|
||||
// const getProductAccessoryTypeClassEditList = async () => {
|
||||
// const result = await getProductAccessoryTypeClassListApi({ is_show: 1 });
|
||||
// if (result?.code === 0) {
|
||||
// let arr: any[] = [];
|
||||
// if (result?.data?.length) {
|
||||
// result?.data?.forEach((item: any) => {
|
||||
// let obj = {
|
||||
// value: item.id,
|
||||
// label: item.name
|
||||
// };
|
||||
// arr.push(obj);
|
||||
// });
|
||||
// dataStore.editFormData[1].options = arr;
|
||||
// }
|
||||
// }
|
||||
// };
|
||||
// getProductAccessoryTypeClassEditList();
|
||||
|
||||
//添加
|
||||
const handleAdd = () => {
|
||||
dataStore.visible = true;
|
||||
dataStore.title = "添加视频";
|
||||
dataStore.title = "添加配件类型";
|
||||
};
|
||||
//抽屉关闭前的钩子
|
||||
const handleBeforeClone = () => {
|
||||
@@ -174,32 +163,16 @@ const handleBeforeClone = () => {
|
||||
dataStore.visible = false;
|
||||
};
|
||||
//详情
|
||||
const getVideoRead = async (id: any) => {
|
||||
const result = await getVideoReadApi(id);
|
||||
const getProductAccessoryTypeRead = async (id: any) => {
|
||||
const result = await getProductAccessoryTypeDetailsApi(id);
|
||||
if (result?.code === 0) {
|
||||
dataStore.editRuleForm = result?.data;
|
||||
// let is = dataStore.editFormData[1].options.some((item: any) => {
|
||||
// console.log(item.id);
|
||||
// console.log(dataStore.editRuleForm.category_id);
|
||||
// return item.value == dataStore.editRuleForm.category_id;
|
||||
// });
|
||||
let is = dataStore.editFormData[1].options.some((item: any) =>
|
||||
recursiveCompare(item, dataStore.editRuleForm.category_id)
|
||||
);
|
||||
dataStore.editRuleForm.category_id1 = is ? dataStore.editRuleForm.category_id : dataStore.editRuleForm.category_name;
|
||||
}
|
||||
};
|
||||
|
||||
const handleSelectChangeEmits = (value: any) => {
|
||||
console.log(value, "========value=33========");
|
||||
if (value.prop === "category_id1") {
|
||||
dataStore.editRuleForm.category_id = value.id;
|
||||
}
|
||||
};
|
||||
|
||||
//保存
|
||||
const getVideoSave = async () => {
|
||||
const result = await getVideoSaveApi(dataStore.editRuleForm);
|
||||
const getProductAccessoryTypeSave = async () => {
|
||||
const result = await getProductAccessoryTypeAddApi(dataStore.editRuleForm);
|
||||
if (result?.code === 0) {
|
||||
const { msg } = result;
|
||||
useMsg("success", msg);
|
||||
@@ -209,8 +182,8 @@ const getVideoSave = async () => {
|
||||
}
|
||||
};
|
||||
//更新
|
||||
const getVideoUpdate = async () => {
|
||||
const result = await getVideoUpdateApi(dataStore.editRuleForm);
|
||||
const getProductAccessoryTypeUpdate = async () => {
|
||||
const result = await getProductAccessoryTypeUpApi(dataStore.editRuleForm);
|
||||
if (result?.code === 0) {
|
||||
const { msg } = result;
|
||||
useMsg("success", msg);
|
||||
@@ -219,18 +192,11 @@ const getVideoUpdate = async () => {
|
||||
proTableRef?.value?.getTableList();
|
||||
}
|
||||
};
|
||||
//导出接口
|
||||
const getProductListExport = async () => {
|
||||
const result = await getVideoListExportApi({
|
||||
...proTableRef?.value?.searchParam,
|
||||
...proTableRef?.value?.pageable
|
||||
});
|
||||
await useExport(result);
|
||||
};
|
||||
|
||||
//删除
|
||||
const getVideoListDel = (id: any) => {
|
||||
const getProductAccessoryTypeListDel = (id: any) => {
|
||||
messageBox("你确定要删除?", async () => {
|
||||
const result = await getVideoListDelApi(id);
|
||||
const result = await getProductAccessoryTypeDelApi(id);
|
||||
if (result?.code === 0) {
|
||||
const { msg } = result;
|
||||
useMsg("success", msg);
|
||||
@@ -244,19 +210,15 @@ const handleBtnClick = (type: any, row: any) => {
|
||||
//编辑
|
||||
if (type === "编辑") {
|
||||
dataStore.visible = true;
|
||||
dataStore.title = "编辑视频";
|
||||
getVideoRead(row.id);
|
||||
dataStore.title = "编辑配件类型";
|
||||
getProductAccessoryTypeRead(row.id);
|
||||
return;
|
||||
}
|
||||
//删除
|
||||
if (type === "删除") {
|
||||
getVideoListDel(row.id);
|
||||
getProductAccessoryTypeListDel(row.id);
|
||||
}
|
||||
};
|
||||
//导出
|
||||
const handleExport = () => {
|
||||
getProductListExport();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@@ -19,64 +19,65 @@ interface FormItem {
|
||||
}
|
||||
export const EDIT_FORM_DATA: FormItem[] = [
|
||||
{
|
||||
prop: "name",
|
||||
prop: "label_name",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "标签名称: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "part_id",
|
||||
placeholder: "请输入",
|
||||
type: "select",
|
||||
label: "配件类型: "
|
||||
label: "配件类型: ",
|
||||
options: []
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "brand_name",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "品牌: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "level_name",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "级别: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "class_name",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "类别: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "series_name",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "系列: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "model",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "市场型号: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "capacity",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "容器: "
|
||||
label: "容量: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "interface_type",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "接口类型: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "compat_status",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "兼容类型: "
|
||||
label: "兼容状态: "
|
||||
},
|
||||
{
|
||||
prop: "sort",
|
||||
@@ -85,18 +86,18 @@ export const EDIT_FORM_DATA: FormItem[] = [
|
||||
label: "排序: "
|
||||
},
|
||||
{
|
||||
prop: "recommend",
|
||||
prop: "disabled",
|
||||
placeholder: "请输入",
|
||||
type: "radio",
|
||||
label: "是否启用: ",
|
||||
options: [
|
||||
{
|
||||
label: "是",
|
||||
value: 1
|
||||
value: 0
|
||||
},
|
||||
{
|
||||
label: "否",
|
||||
value: 0
|
||||
value: 1
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
export const RULES = {
|
||||
label_name: [{ required: true, message: "标签名称不能为空 ! ", trigger: "blur" }],
|
||||
brand_name: [{ required: true, message: "标签名称不能为空 ! ", trigger: "blur" }],
|
||||
sort: [{ required: true, message: "视频排序不能为空 ! ", trigger: "blur" }]
|
||||
};
|
||||
@@ -17,13 +17,13 @@ interface FormItem {
|
||||
}
|
||||
export const FORM_DATA: FormItem[] = [
|
||||
{
|
||||
prop: "name",
|
||||
prop: "label_name",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "标签名称: "
|
||||
},
|
||||
{
|
||||
prop: "name",
|
||||
prop: "model",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "型号: "
|
||||
@@ -10,56 +10,72 @@ export const COLUMNS = [
|
||||
{
|
||||
align: "left",
|
||||
label: "标签名称",
|
||||
prop: "name"
|
||||
prop: "label_name",
|
||||
width: 200,
|
||||
fixed: true
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "配件类型",
|
||||
prop: "category_name"
|
||||
prop: "part_name",
|
||||
width: 200,
|
||||
fixed: true
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "品牌",
|
||||
prop: "sort",
|
||||
width: 160
|
||||
prop: "brand_name",
|
||||
width: 200,
|
||||
fixed: true
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "级别",
|
||||
prop: "sort",
|
||||
prop: "level_name",
|
||||
width: 160
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "系列",
|
||||
prop: "sort",
|
||||
width: 160
|
||||
prop: "series_name",
|
||||
width: 200
|
||||
},
|
||||
|
||||
{
|
||||
align: "left",
|
||||
label: "型号",
|
||||
prop: "created_at"
|
||||
prop: "model",
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "容量",
|
||||
prop: "created_at"
|
||||
prop: "capacity",
|
||||
width: 160
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "接口型号",
|
||||
prop: "created_at"
|
||||
prop: "interface_type",
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "兼容性状态",
|
||||
prop: "created_at"
|
||||
prop: "compat_status",
|
||||
width: 160
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "排序",
|
||||
prop: "created_at"
|
||||
prop: "sort",
|
||||
width: 160
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
label: "使用状态",
|
||||
prop: "disabled",
|
||||
width: 160
|
||||
},
|
||||
{
|
||||
align: "left",
|
||||
@@ -69,7 +85,8 @@ export const COLUMNS = [
|
||||
{
|
||||
align: "left",
|
||||
label: "更新时间",
|
||||
prop: "created_at"
|
||||
prop: "updated_at"
|
||||
},
|
||||
|
||||
{ prop: "operation", label: "操作", fixed: "right", width: 200 }
|
||||
];
|
||||
@@ -9,15 +9,12 @@
|
||||
ref="proTableRef"
|
||||
:formData="dataStore.formData"
|
||||
:columns="dataStore.columns"
|
||||
:request-api="getVideoListApi"
|
||||
:request-api="getProductCompatibilityListApi"
|
||||
:init-param="dataStore.initParam"
|
||||
>
|
||||
<template #image="scope">
|
||||
<el-image :src="scope.row.image ? h + scope.row.image : ''" style="width: 60px; height: 60px" />
|
||||
</template>
|
||||
<template #status="scope">
|
||||
<el-tag :type="scope.row.status == 1 ? 'success' : 'danger'" effect="dark">{{
|
||||
scope.row.status == 1 ? "启用" : "禁用"
|
||||
<template #disabled="scope">
|
||||
<el-tag :type="scope.row.stdisabledatus == 1 ? 'danger' : 'success'" effect="dark">{{
|
||||
scope.row.disabled == 1 ? "禁用" : "启用"
|
||||
}}</el-tag>
|
||||
</template>
|
||||
<template #operation="scope">
|
||||
@@ -61,20 +58,21 @@
|
||||
<script setup lang="ts" name="productCompatibilityList">
|
||||
import ProTable from "@/components/ProTable/index.vue";
|
||||
import rulesForm from "@/components/rulesForm/index.vue";
|
||||
import ImportExcel from "@/components/ImportExcel/index.vue";
|
||||
import { messageBox } from "@/utils/messageBox";
|
||||
import { useMsg } from "@/hooks/useMsg";
|
||||
const importRef = ref();
|
||||
|
||||
//列表接口
|
||||
import {
|
||||
getVideoListApi,
|
||||
getVideoListDelApi,
|
||||
getVideoReadApi,
|
||||
getVideoUpdateApi,
|
||||
getVideoSaveApi,
|
||||
getVideoClassListApi
|
||||
} from "@/api/modules/videoList";
|
||||
import { recursiveCompare } from "@/utils/recursiveCompare";
|
||||
// import { getVideoClassListApi } from "@/api/modules/videoClass";
|
||||
getProductCompatibilityListApi,
|
||||
getProductCompatibilityDetailsApi,
|
||||
getProductCompatibilityDelApi,
|
||||
getProductCompatibilityUpApi,
|
||||
getProductCompatibilityAddApi,
|
||||
getProductCompatibilityListImportApi
|
||||
} from "@/api/modules/productCompatibility";
|
||||
//列表接口
|
||||
import { getProductAccessoryTypeListApi } from "@/api/modules/productAccessoryType";
|
||||
//深拷贝方法
|
||||
import { cloneDeep } from "lodash-es";
|
||||
//表格和搜索條件
|
||||
@@ -83,11 +81,10 @@ import { RULE_FORM, FORM_DATA, COLUMNS, EDIT_FORM_DATA, EDIT_RULE_FORM, RULES }
|
||||
// 获取 ProTable 元素,调用其获取刷新数据方法(还能获取到当前查询参数,方便导出携带参数)
|
||||
const proTableRef = ref<any>(null);
|
||||
const formRef: any = ref(null);
|
||||
//图片地址
|
||||
import { h } from "@/utils/url";
|
||||
const importRef = ref(null);
|
||||
// 数据源
|
||||
const dataStore = reactive<any>({
|
||||
title: "添加视频",
|
||||
title: "添加",
|
||||
columns: COLUMNS, //列表配置项
|
||||
rules: cloneDeep(RULES), //抽屉表单验证
|
||||
editRuleForm: cloneDeep(EDIT_RULE_FORM),
|
||||
@@ -104,7 +101,7 @@ const handleConfirmClick = () => {
|
||||
if (!formRef.value!.ruleFormRef) return;
|
||||
formRef!.value!.ruleFormRef!.validate((valid: any) => {
|
||||
if (valid) {
|
||||
dataStore.title === "添加视频" ? getVideoSave() : getVideoUpdate();
|
||||
dataStore.title === "添加" ? getSave() : getUpdate();
|
||||
} else {
|
||||
console.log("error submit!");
|
||||
return false;
|
||||
@@ -118,54 +115,37 @@ const resetFields = () => {
|
||||
};
|
||||
//抽屉重置
|
||||
const handleResetClick = () => {
|
||||
if (dataStore.title === "添加视频") {
|
||||
if (dataStore.title === "添加") {
|
||||
resetFields();
|
||||
} else {
|
||||
getVideoRead(dataStore.selectRow.id);
|
||||
getRead(dataStore.selectRow.id);
|
||||
}
|
||||
};
|
||||
|
||||
//视频分类接口
|
||||
const getVideoClassList = async () => {
|
||||
const result = await getVideoClassListApi();
|
||||
const getProductAccessoryTypeList = async () => {
|
||||
const result = await getProductAccessoryTypeListApi({ is_show: 1 });
|
||||
console.log(result?.data.data, "==================>");
|
||||
if (result?.code === 0) {
|
||||
let arr: any[] = [];
|
||||
if (result?.data?.length) {
|
||||
result?.data?.forEach((item: any) => {
|
||||
let obj = {
|
||||
value: item.id,
|
||||
label: item.name
|
||||
};
|
||||
arr.push(obj);
|
||||
});
|
||||
dataStore.formData[1].options = arr;
|
||||
}
|
||||
}
|
||||
};
|
||||
getVideoClassList();
|
||||
|
||||
const getVideoClassEditList = async () => {
|
||||
const result = await getVideoClassListApi({ is_show: 1 });
|
||||
if (result?.code === 0) {
|
||||
let arr: any[] = [];
|
||||
if (result?.data?.length) {
|
||||
result?.data?.forEach((item: any) => {
|
||||
if (result?.data?.data?.length) {
|
||||
result?.data?.data?.forEach((item: any) => {
|
||||
let obj = {
|
||||
value: item.id,
|
||||
label: item.name
|
||||
};
|
||||
arr.push(obj);
|
||||
});
|
||||
console.log(arr, "=================");
|
||||
dataStore.editFormData[1].options = arr;
|
||||
}
|
||||
}
|
||||
};
|
||||
getVideoClassEditList();
|
||||
getProductAccessoryTypeList();
|
||||
|
||||
//添加
|
||||
const handleAdd = () => {
|
||||
dataStore.visible = true;
|
||||
dataStore.title = "添加视频";
|
||||
dataStore.title = "添加";
|
||||
};
|
||||
//抽屉关闭前的钩子
|
||||
const handleBeforeClone = () => {
|
||||
@@ -174,32 +154,20 @@ const handleBeforeClone = () => {
|
||||
dataStore.visible = false;
|
||||
};
|
||||
//详情
|
||||
const getVideoRead = async (id: any) => {
|
||||
const result = await getVideoReadApi(id);
|
||||
const getRead = async (id: any) => {
|
||||
const result = await getProductCompatibilityDetailsApi(id);
|
||||
if (result?.code === 0) {
|
||||
dataStore.editRuleForm = result?.data;
|
||||
// let is = dataStore.editFormData[1].options.some((item: any) => {
|
||||
// console.log(item.id);
|
||||
// console.log(dataStore.editRuleForm.category_id);
|
||||
// return item.value == dataStore.editRuleForm.category_id;
|
||||
// });
|
||||
let is = dataStore.editFormData[1].options.some((item: any) =>
|
||||
recursiveCompare(item, dataStore.editRuleForm.category_id)
|
||||
);
|
||||
dataStore.editRuleForm.category_id1 = is ? dataStore.editRuleForm.category_id : dataStore.editRuleForm.category_name;
|
||||
}
|
||||
};
|
||||
|
||||
const handleSelectChangeEmits = (value: any) => {
|
||||
console.log(value, "========value=33========");
|
||||
if (value.prop === "category_id1") {
|
||||
dataStore.editRuleForm.category_id = value.id;
|
||||
}
|
||||
};
|
||||
|
||||
//保存
|
||||
const getVideoSave = async () => {
|
||||
const result = await getVideoSaveApi(dataStore.editRuleForm);
|
||||
const getSave = async () => {
|
||||
const result = await getProductCompatibilityAddApi(dataStore.editRuleForm);
|
||||
if (result?.code === 0) {
|
||||
const { msg } = result;
|
||||
useMsg("success", msg);
|
||||
@@ -209,8 +177,8 @@ const getVideoSave = async () => {
|
||||
}
|
||||
};
|
||||
//更新
|
||||
const getVideoUpdate = async () => {
|
||||
const result = await getVideoUpdateApi(dataStore.editRuleForm);
|
||||
const getUpdate = async () => {
|
||||
const result = await getProductCompatibilityUpApi(dataStore.editRuleForm);
|
||||
if (result?.code === 0) {
|
||||
const { msg } = result;
|
||||
useMsg("success", msg);
|
||||
@@ -221,9 +189,9 @@ const getVideoUpdate = async () => {
|
||||
};
|
||||
|
||||
//删除
|
||||
const getVideoListDel = (id: any) => {
|
||||
const getListDel = (id: any) => {
|
||||
messageBox("你确定要删除?", async () => {
|
||||
const result = await getVideoListDelApi(id);
|
||||
const result = await getProductCompatibilityDelApi(id);
|
||||
if (result?.code === 0) {
|
||||
const { msg } = result;
|
||||
useMsg("success", msg);
|
||||
@@ -237,13 +205,13 @@ const handleBtnClick = (type: any, row: any) => {
|
||||
//编辑
|
||||
if (type === "编辑") {
|
||||
dataStore.visible = true;
|
||||
dataStore.title = "编辑视频";
|
||||
getVideoRead(row.id);
|
||||
dataStore.title = "编辑";
|
||||
getRead(row.id);
|
||||
return;
|
||||
}
|
||||
//删除
|
||||
if (type === "删除") {
|
||||
getVideoListDel(row.id);
|
||||
getListDel(row.id);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -252,7 +220,7 @@ const handleImport = () => {
|
||||
let params = {
|
||||
title: "数据",
|
||||
tempApi: "",
|
||||
importApi: "",
|
||||
importApi: getProductCompatibilityListImportApi,
|
||||
proTableRef: proTableRef
|
||||
};
|
||||
importRef.value.acceptParams(params);
|
||||
@@ -1,5 +0,0 @@
|
||||
export const RULES = {
|
||||
name: [{ required: true, message: "视频名称不能为空 ! ", trigger: "blur" }],
|
||||
category_id1: [{ required: true, message: "视频分类不能为空 ! ", trigger: "blur" }],
|
||||
sort: [{ required: true, message: "视频排序不能为空 ! ", trigger: "blur" }]
|
||||
};
|
||||
@@ -1,28 +1,15 @@
|
||||
//兼容性信息(否)
|
||||
export const FORM_DATA_LV1: any[] = [
|
||||
{
|
||||
prop: "tag",
|
||||
prop: "compat_id",
|
||||
placeholder: "请输入",
|
||||
type: "selectMultiple",
|
||||
label: "关联标签: ",
|
||||
options: [
|
||||
{
|
||||
value: 1,
|
||||
label: "测试1"
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
label: "测试2"
|
||||
},
|
||||
{
|
||||
value: 3,
|
||||
label: "测试3"
|
||||
}
|
||||
]
|
||||
options: []
|
||||
},
|
||||
|
||||
{
|
||||
prop: "is_show",
|
||||
prop: "show_series_name",
|
||||
placeholder: "请输入",
|
||||
type: "radio",
|
||||
label: "是否显示系列名: ",
|
||||
@@ -47,14 +34,14 @@ export const FORM_DATA_LV1: any[] = [
|
||||
//兼容性信息(是)
|
||||
export const FORM_DATA_LV2: any[] = [
|
||||
{
|
||||
prop: "tag",
|
||||
prop: "compat_id",
|
||||
placeholder: "请输入",
|
||||
type: "selectMultiple",
|
||||
label: "关联标签: "
|
||||
},
|
||||
|
||||
{
|
||||
prop: "is_show",
|
||||
prop: "show_series_name",
|
||||
placeholder: "请输入",
|
||||
type: "radio",
|
||||
label: "是否显示系列名: ",
|
||||
@@ -72,7 +59,7 @@ export const FORM_DATA_LV2: any[] = [
|
||||
|
||||
//
|
||||
{
|
||||
prop: "className",
|
||||
prop: "series_name",
|
||||
placeholder: "请输入",
|
||||
type: "input",
|
||||
label: "产品系列名: "
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
export const RULES_LV1 = {
|
||||
tag: [{ required: true, message: "所属系列名称不能为空 ! ", trigger: "change" }]
|
||||
compat_id: [{ required: true, message: "所属系列名称不能为空 ! ", trigger: "change" }]
|
||||
};
|
||||
export const RULES_LV2 = {
|
||||
tag: [{ required: true, message: "所属系列名称不能为空 ! ", trigger: "change" }],
|
||||
className: [{ required: true, message: "产品系列名不能为空 ! ", trigger: "blur" }]
|
||||
compat_id: [{ required: true, message: "所属系列名称不能为空 ! ", trigger: "change" }],
|
||||
series_name: [{ required: true, message: "产品系列名不能为空 ! ", trigger: "blur" }]
|
||||
};
|
||||
|
||||
@@ -54,13 +54,14 @@ import { ref, reactive } from "vue";
|
||||
import Editor from "@/components/Editor/index.vue";
|
||||
import rulesForm from "@/components/rulesForm/index.vue";
|
||||
import { FORM_DATA_LV2, FORM_DATA_LV1, RULES_LV1, RULES_LV2 } from "./constant/index";
|
||||
console.log(FORM_DATA_LV2, RULES_LV2);
|
||||
|
||||
import {
|
||||
getProductDetailsApi,
|
||||
getProductListApi,
|
||||
getProductAttrsListApi,
|
||||
getProductCategoryListApi
|
||||
} from "@/api/modules/productList";
|
||||
import { getProductCompatibilityListApi } from "@/api/modules/productCompatibility";
|
||||
// import { getProductCategoryListApi } from "@/api/modules/productClass";
|
||||
import { RELATED_INFO_COLUMNS } from "./constant/related";
|
||||
import { cloneDeep, debounce } from "lodash-es";
|
||||
@@ -157,6 +158,26 @@ const getProductCategoryList = async () => {
|
||||
};
|
||||
getProductCategoryList();
|
||||
|
||||
//兼容性信息(后端大佬说直接掉列表接口)
|
||||
const getProductCompatibilityList = async () => {
|
||||
const result = await getProductCompatibilityListApi({ is_show: 1 });
|
||||
if (result?.code === 0) {
|
||||
let arr: any[] = [];
|
||||
if (result?.data?.data?.length) {
|
||||
result?.data?.data?.forEach((item: any) => {
|
||||
let obj = {
|
||||
value: item.id,
|
||||
label: item.label_name
|
||||
};
|
||||
arr.push(obj);
|
||||
});
|
||||
|
||||
dataStore.formData[0].options = arr;
|
||||
}
|
||||
}
|
||||
};
|
||||
getProductCompatibilityList();
|
||||
|
||||
//相关信息及行远程搜索下拉框点击
|
||||
const handleRemoteClick = (params: any) => {
|
||||
const { item, index } = params;
|
||||
@@ -188,14 +209,16 @@ const handleRemote = debounce((params: any) => {
|
||||
getProductList(params.query);
|
||||
}, 800);
|
||||
const handleTabClick = () => {
|
||||
formRef.value.ruleFormRef.clearValidate("tag");
|
||||
formRef.value.ruleFormRef.clearValidate("compat_id");
|
||||
};
|
||||
const handleRadioGroupEmits = (params: any) => {
|
||||
if (params === 1) {
|
||||
dataStore.formData = cloneDeep(FORM_DATA_LV2);
|
||||
dataStore.rules = cloneDeep(RULES_LV2);
|
||||
} else {
|
||||
dataStore.ruleForm.className = "";
|
||||
dataStore.formData = cloneDeep(FORM_DATA_LV1);
|
||||
dataStore.rules = cloneDeep(RULES_LV1);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -62,6 +62,7 @@ import {
|
||||
getProductListExportApi,
|
||||
getProductCategoryListApi
|
||||
} from "@/api/modules/productList";
|
||||
|
||||
// import { getProductCategoryListApi } from "@/api/modules/productClass";
|
||||
import { addLabelValue } from "@/utils/addLabelValue";
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { cloneDeep } from "lodash-es";
|
||||
import { FORM_DATA_LV2, FORM_DATA_LV1, RULES_LV1, RULES_LV2 } from "../../constant/index";
|
||||
// import { convertSpanToDiv } from "@/utils/convertSpanToDiv";
|
||||
const hasIdRecursive = (data: any, targetId: any) => {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
@@ -88,4 +89,20 @@ export const initDetailParams = (dataStore: any, data: any, editorRef: any) => {
|
||||
if (data.related) {
|
||||
dataStore.relatedTableData = cloneDeep(data.related);
|
||||
}
|
||||
if (data.compat.length) {
|
||||
dataStore.ruleForm = data.compat[0];
|
||||
let ids: any[] = [];
|
||||
dataStore.ruleForm?.compat.forEach((item: any) => {
|
||||
ids.push(item.compat_id);
|
||||
});
|
||||
dataStore.ruleForm.compat_id = ids;
|
||||
if (dataStore.ruleForm.show_series_name === 1) {
|
||||
dataStore.formData = cloneDeep(FORM_DATA_LV2);
|
||||
dataStore.rules = cloneDeep(RULES_LV2);
|
||||
} else {
|
||||
dataStore.ruleForm.className = "";
|
||||
dataStore.formData = cloneDeep(FORM_DATA_LV1);
|
||||
dataStore.rules = cloneDeep(RULES_LV1);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -7,7 +7,7 @@ const WARN: any = {
|
||||
category_id: "产品分类不能为空 !",
|
||||
sort: "产品排序不能为空 !",
|
||||
tag: "关联标签不能为空 !",
|
||||
className: "产品系列名不能为空 !"
|
||||
seriesName: "产品系列名不能为空 !"
|
||||
};
|
||||
//警告
|
||||
const warnFunction = (data: any, data1: any) => {
|
||||
@@ -27,12 +27,12 @@ const warnFunction = (data: any, data1: any) => {
|
||||
useMsg("warning", WARN["sort"]);
|
||||
return false;
|
||||
}
|
||||
if (!data1.tag) {
|
||||
useMsg("warning", WARN["tag"]);
|
||||
return false;
|
||||
}
|
||||
if (data1.is_show && !data1.className) {
|
||||
useMsg("warning", WARN["className"]);
|
||||
// if (!data1.tag) {
|
||||
// useMsg("warning", WARN["tag"]);
|
||||
// return false;
|
||||
// }
|
||||
if (data1.is_show && !data1.series_name) {
|
||||
useMsg("warning", WARN["seriesName"]);
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
@@ -71,8 +71,11 @@ export const handleSubmit = async (infoRef: any, imgInfoRef: any, formRef: any,
|
||||
});
|
||||
console.log(skusClone, "=skusClone=");
|
||||
let skusCloneStr = JSON.stringify(skusClone);
|
||||
// cloneDeep
|
||||
let ruleForm: any = cloneDeep(dataStore.ruleForm);
|
||||
ruleForm.compat_id = ruleForm.compat_id.join(",");
|
||||
console.log(typeof skusCloneStr);
|
||||
|
||||
console.log(dataStore.ruleForm, "=ruleForm=");
|
||||
const params = {
|
||||
...infoRef.ruleForm,
|
||||
cover_image,
|
||||
@@ -80,7 +83,8 @@ export const handleSubmit = async (infoRef: any, imgInfoRef: any, formRef: any,
|
||||
video_img,
|
||||
skus: skusCloneStr,
|
||||
detail: dataStore.detail,
|
||||
related: JSON.stringify(relatedData) || []
|
||||
related: JSON.stringify(relatedData) || [],
|
||||
compat: JSON.stringify(ruleForm) || {}
|
||||
};
|
||||
|
||||
console.log(params, "===========params=============");
|
||||
|
||||
Reference in New Issue
Block a user