mirror of
https://gitee.com/hhyykk/ipms-sjy.git
synced 2025-07-17 20:45:06 +08:00
Merge branch 'master' of https://gitee.com/zhijiantianya/ruoyi-vue-pro into feature/bpm-back
Conflicts: README.md yudao-framework/pom.xml yudao-framework/yudao-spring-boot-starter-biz-error-code/pom.xml yudao-framework/yudao-spring-boot-starter-web/src/main/java/cn/iocoder/yudao/framework/swagger/config/YudaoSwaggerAutoConfiguration.java yudao-module-system/yudao-module-system-biz/src/main/java/cn/iocoder/yudao/module/system/framework/security/config/SecurityConfiguration.java
This commit is contained in:
YunaiV
@ -217,7 +217,7 @@ export default {
|
||||
return result.value || ' ';
|
||||
},
|
||||
/** 复制代码成功 */
|
||||
clipboardSuccess(){
|
||||
clipboardSuccess() {
|
||||
this.$modal.msgSuccess("复制成功");
|
||||
},
|
||||
/** 生成 files 目录 **/
|
||||
@ -292,7 +292,9 @@ export default {
|
||||
/** 修改按钮操作 */
|
||||
handleEditTable(row) {
|
||||
const tableId = row.id;
|
||||
this.$router.push("/codegen/edit/" + tableId);
|
||||
const tableName = row.tableName || this.tableNames[0];
|
||||
const params = { pageNum: this.queryParams.pageNum };
|
||||
this.$tab.openPage("修改[" + tableName + "]生成配置", '/codegen/edit/' + tableId, params);
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
|
||||
@ -27,7 +27,7 @@ export default {
|
||||
return {
|
||||
height: document.documentElement.clientHeight - 94.5 + "px;",
|
||||
loading: true,
|
||||
src: undefined,
|
||||
src: "undefined",
|
||||
};
|
||||
},
|
||||
mounted: function() {
|
||||
|
||||
@ -26,8 +26,9 @@
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="文件名" align="center" prop="path" />
|
||||
<el-table-column label="URL" align="center" prop="url" />
|
||||
<el-table-column label="文件名" align="center" prop="name" />
|
||||
<el-table-column label="文件路径" align="center" prop="path" />
|
||||
<el-table-column label="文件 URL" align="center" prop="url" />
|
||||
<el-table-column label="文件大小" align="center" prop="size" width="120" :formatter="sizeFormat" />
|
||||
<el-table-column label="文件类型" align="center" prop="type" width="80" />
|
||||
<!-- <el-table-column label="文件内容" align="center" prop="content">-->
|
||||
@ -160,7 +161,7 @@ export default {
|
||||
},
|
||||
/** 处理上传的文件发生变化 */
|
||||
handleFileChange(file, fileList) {
|
||||
this.upload.data.path = file.name;
|
||||
|
||||
},
|
||||
/** 处理文件上传中 */
|
||||
handleFileUploadProgress(event, file, fileList) {
|
||||
|
||||
@ -77,7 +77,7 @@
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item label="存储器" prop="storage">
|
||||
<el-select v-model="form.storage" placeholder="请选择存储器" :disabled="form.id">
|
||||
<el-select v-model="form.storage" placeholder="请选择存储器" :disabled="form.id !== undefined">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.INFRA_FILE_STORAGE)"
|
||||
:key="dict.value" :label="dict.label" :value="parseInt(dict.value)" />
|
||||
</el-select>
|
||||
@ -91,7 +91,7 @@
|
||||
<el-input v-model="form.config.host" placeholder="请输入主机地址" />
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.storage >= 11 && form.storage <= 12" label="主机端口" prop="config.port">
|
||||
<el-input-number min="0" v-model="form.config.port" placeholder="请输入主机端口" />
|
||||
<el-input-number :min="0" v-model="form.config.port" placeholder="请输入主机端口" />
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.storage >= 11 && form.storage <= 12" label="用户名" prop="config.username">
|
||||
<el-input v-model="form.config.username" placeholder="请输入密码" />
|
||||
|
||||
265
yudao-ui-admin/src/views/mall/market/banner/index.vue
Normal file
265
yudao-ui-admin/src/views/mall/market/banner/index.vue
Normal file
@ -0,0 +1,265 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="标题" prop="title">
|
||||
<el-input v-model="queryParams.title" placeholder="请输入标题" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['market:banner:create']">新增
|
||||
</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="标题" align="center" prop="title"/>
|
||||
|
||||
<el-table-column label="缩略图" align="center" prop="picUrl">
|
||||
<template slot-scope="scope">
|
||||
<img v-if="scope.row.picUrl" :src="scope.row.picUrl" alt="缩略图片" class="img-height"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="跳转链接" align="center" prop="url"/>
|
||||
<el-table-column label="排序" align="center" prop="sort"/>
|
||||
<el-table-column label="描述" align="center" prop="memo"/>
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['market:banner:update']">修改
|
||||
</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['market:banner:delete']">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="标题" prop="title">
|
||||
<el-input v-model="form.title" placeholder="请输入标题"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="缩略图" prop="picUrl">
|
||||
<imageUpload v-model="form.picUrl" :limit="1"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="跳转链接" prop="url">
|
||||
<el-input v-model="form.url" placeholder="请输入跳转链接"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="sort">
|
||||
<el-input v-model="form.sort" placeholder="请输入排序"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述" prop="memo">
|
||||
<el-input v-model="form.memo" type="textarea" placeholder="请输入描述"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{ dict.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
createBanner,
|
||||
deleteBanner,
|
||||
exportBannerExcel,
|
||||
getBanner,
|
||||
getBannerPage,
|
||||
updateBanner
|
||||
} from "@/api/mall/market/banner";
|
||||
import ImageUpload from '@/components/ImageUpload';
|
||||
|
||||
export default {
|
||||
name: "Banner",
|
||||
components: {
|
||||
ImageUpload
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 导出遮罩层
|
||||
exportLoading: false,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 品牌列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
title: null,
|
||||
status: null,
|
||||
},
|
||||
// 商品分类树选项
|
||||
categoryOptions: [],
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
title: [{required: true, message: "标题不能不空", trigger: "blur"}],
|
||||
picUrl: [{required: true, message: "图片地址不能为空", trigger: "blur"}],
|
||||
url: [{required: true, message: "跳转地址不能为空", trigger: "blur"}],
|
||||
sort: [{required: true, message: "排序不能为空", trigger: "blur"}],
|
||||
status: [{required: true, message: "状态不能为空", trigger: "change"}],
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getBannerPage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
title: undefined,
|
||||
link: undefined,
|
||||
imgUrl: undefined,
|
||||
sort: undefined,
|
||||
memo: undefined,
|
||||
status: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加Banner";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getBanner(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改Banner";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateBanner(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createBanner(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$modal.confirm('是否确认删除Banner编号为"' + id + '"的数据项?').then(function () {
|
||||
return deleteBanner(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
//
|
||||
.img-height {
|
||||
height: 150px;
|
||||
}
|
||||
</style>
|
||||
314
yudao-ui-admin/src/views/mall/product/brand/index.vue
Normal file
314
yudao-ui-admin/src/views/mall/product/brand/index.vue
Normal file
@ -0,0 +1,314 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="品牌名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入品牌名称" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['product:brand:create']">新增
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
:loading="exportLoading"
|
||||
v-hasPermi="['product:brand:export']">导出
|
||||
</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="商品分类" align="center" prop="categoryId"/>
|
||||
<el-table-column label="品牌名称" align="center" prop="name"/>
|
||||
<el-table-column label="品牌图片" align="center" prop="bannerUrl">
|
||||
<template slot-scope="scope">
|
||||
<img v-if="scope.row.bannerUrl" :src="scope.row.bannerUrl" alt="分类图片" class="img-height"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="品牌排序" align="center" prop="sort"/>
|
||||
<el-table-column label="品牌描述" align="center" prop="description"/>
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['product:brand:update']">修改
|
||||
</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['product:brand:delete']">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="商品分类" prop="categoryId">
|
||||
<Treeselect v-model="form.categoryId" :options="categoryOptions" :normalizer="normalizer" :show-count="true"
|
||||
placeholder="请选择商品分类"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入品牌名称"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌图片" prop="bannerUrl">
|
||||
<imageUpload v-model="form.bannerUrl" :limit="1"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌排序" prop="sort">
|
||||
<el-input v-model="form.sort" placeholder="请输入品牌排序"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="品牌描述" prop="description">
|
||||
<el-input v-model="form.description" type="textarea" placeholder="请输入内容"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{ dict.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
createBrand,
|
||||
deleteBrand,
|
||||
exportBrandExcel,
|
||||
getBrand,
|
||||
getBrandPage,
|
||||
updateBrand
|
||||
} from "@/api/mall/product/brand";
|
||||
import {listCategory} from "@/api/mall/product/category";
|
||||
import ImageUpload from '@/components/ImageUpload';
|
||||
import Treeselect from "@riophae/vue-treeselect";
|
||||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||
|
||||
export default {
|
||||
name: "Brand",
|
||||
components: {
|
||||
ImageUpload, Treeselect,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 导出遮罩层
|
||||
exportLoading: false,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 品牌列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
categoryId: null,
|
||||
name: null,
|
||||
status: null,
|
||||
},
|
||||
// 商品分类树选项
|
||||
categoryOptions: [],
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
categoryId: [{required: true, message: "分类编号不能为空", trigger: "blur"}],
|
||||
name: [{required: true, message: "品牌名称不能为空", trigger: "blur"}],
|
||||
bannerUrl: [{required: true, message: "品牌图片不能为空", trigger: "blur"}],
|
||||
status: [{required: true, message: "状态不能为空", trigger: "change"}],
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getTreeselect();
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getBrandPage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 转换菜单数据结构 */
|
||||
normalizer(node) {
|
||||
if (node.children && !node.children.length) {
|
||||
delete node.children;
|
||||
}
|
||||
return {
|
||||
id: node.id,
|
||||
label: node.name,
|
||||
children: node.children
|
||||
};
|
||||
},
|
||||
/** 查询分类下拉树结构 */
|
||||
getTreeselect() {
|
||||
listCategory().then(response => {
|
||||
this.categoryOptions = [];
|
||||
const menu = {id: 0, name: '商品分类', children: []};
|
||||
menu.children = this.handleTree(response.data, "id", "pid");
|
||||
this.categoryOptions.push(menu);
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
categoryId: undefined,
|
||||
name: undefined,
|
||||
bannerUrl: undefined,
|
||||
sort: undefined,
|
||||
description: undefined,
|
||||
status: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.getTreeselect();
|
||||
this.open = true;
|
||||
this.title = "添加品牌";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
this.getTreeselect();
|
||||
const id = row.id;
|
||||
getBrand(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改品牌";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateBrand(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createBrand(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$modal.confirm('是否确认删除品牌编号为"' + id + '"的数据项?').then(function () {
|
||||
return deleteBrand(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$modal.confirm('是否确认导出所有品牌数据项?').then(() => {
|
||||
this.exportLoading = true;
|
||||
return exportBrandExcel(params);
|
||||
}).then(response => {
|
||||
this.$download.excel(response, "品牌.xls");
|
||||
this.exportLoading = false;
|
||||
}).catch(() => {
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
//
|
||||
.img-height {
|
||||
height: 150px;
|
||||
}
|
||||
</style>
|
||||
337
yudao-ui-admin/src/views/mall/product/category/index.vue
Normal file
337
yudao-ui-admin/src/views/mall/product/category/index.vue
Normal file
@ -0,0 +1,337 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="分类名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入分类名称" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="开启状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择开启状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['product:category:create']">新增
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
:loading="exportLoading"
|
||||
v-hasPermi="['product:category:export']">导出
|
||||
</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-if="refreshTable" v-loading="loading" :data="list" row-key="id" :default-expand-all="isExpandAll"
|
||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
|
||||
<el-table-column label="分类名称" align="center" prop="name"/>
|
||||
<el-table-column label="分类图标" align="center" prop="icon">
|
||||
<template slot-scope="scope">
|
||||
<svg-icon :icon-class="scope.row.icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="分类图片" align="center" prop="bannerUrl">
|
||||
<template slot-scope="scope">
|
||||
<img v-if="scope.row.bannerUrl" :src="scope.row.bannerUrl" alt="分类图片" class="img-height"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="分类排序" align="center" prop="sort"/>
|
||||
<el-table-column label="开启状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['product:category:update']">修改
|
||||
</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['product:category:delete']">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="上级分类" prop="parentId">
|
||||
<Treeselect v-model="form.parentId" :options="parentCategoryOptions" :normalizer="normalizer"
|
||||
:show-count="true"
|
||||
placeholder="上级分类"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入分类名称"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类图标" prop="icon">
|
||||
<el-popover placement="bottom-start" width="460" trigger="click" @show="$refs['iconSelect'].reset()">
|
||||
<IconSelect ref="iconSelect" @selected="iconSelected"/>
|
||||
<el-input slot="reference" v-model="form.icon" placeholder="点击选择分类图标" readonly>
|
||||
<svg-icon v-if="form.icon" slot="prefix" :icon-class="form.icon" class="el-input__icon"
|
||||
style="height: 32px;width: 16px;"/>
|
||||
<i v-else slot="prefix" class="el-icon-search el-input__icon"/>
|
||||
</el-input>
|
||||
</el-popover>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类图片" prop="bannerUrl">
|
||||
<ImageUpload v-model="form.bannerUrl" :limit="1"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类排序" prop="sort">
|
||||
<el-input-number v-model="form.sort" controls-position="right" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="分类描述">
|
||||
<editor v-model="form.description" :min-height="192"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="开启状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{ dict.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
createCategory,
|
||||
deleteCategory,
|
||||
exportCategoryExcel,
|
||||
getCategory,
|
||||
listCategory,
|
||||
updateCategory
|
||||
} from "@/api/mall/product/category";
|
||||
import Editor from '@/components/Editor';
|
||||
import Treeselect from "@riophae/vue-treeselect";
|
||||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||
import IconSelect from "@/components/IconSelect";
|
||||
import ImageUpload from '@/components/ImageUpload';
|
||||
|
||||
export default {
|
||||
name: "Category",
|
||||
components: {
|
||||
Editor, Treeselect, IconSelect, ImageUpload
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 导出遮罩层
|
||||
exportLoading: false,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 商品分类列表
|
||||
list: [],
|
||||
// 商品分类树选项
|
||||
parentCategoryOptions: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 是否展开，默认全部折叠
|
||||
isExpandAll: false,
|
||||
// 重新渲染表格状态
|
||||
refreshTable: true,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
name: null,
|
||||
status: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
parentId: [{required: true, message: "请选择上级分类", trigger: "blur"}],
|
||||
name: [{required: true, message: "分类名称不能为空", trigger: "blur"}],
|
||||
icon: [{required: true, message: "分类图标不能为空", trigger: "blur"}],
|
||||
bannerUrl: [{required: true, message: "分类图片不能为空", trigger: "blur"}],
|
||||
status: [{required: true, message: "开启状态不能为空", trigger: "blur"}],
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
// 执行查询
|
||||
listCategory(params).then(response => {
|
||||
this.list = this.handleTree(response.data, "id", "parentId");
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 选择图标
|
||||
iconSelected(name) {
|
||||
this.form.icon = name;
|
||||
},
|
||||
/** 转换菜单数据结构 */
|
||||
normalizer(node) {
|
||||
if (node.children && !node.children.length) {
|
||||
delete node.children;
|
||||
}
|
||||
return {
|
||||
id: node.id,
|
||||
label: node.name,
|
||||
children: node.children
|
||||
};
|
||||
},
|
||||
/** 查询分类下拉树结构 */
|
||||
getTreeselect() {
|
||||
listCategory().then(response => {
|
||||
this.parentCategoryOptions = [];
|
||||
const menu = {id: 0, name: '主分类', children: []};
|
||||
menu.children = this.handleTree(response.data, "id", "parentId");
|
||||
this.parentCategoryOptions.push(menu);
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
parentId: undefined,
|
||||
name: undefined,
|
||||
icon: undefined,
|
||||
bannerUrl: undefined,
|
||||
sort: undefined,
|
||||
description: undefined,
|
||||
status: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 展开/折叠操作 */
|
||||
toggleExpandAll() {
|
||||
this.refreshTable = false;
|
||||
this.isExpandAll = !this.isExpandAll;
|
||||
this.$nextTick(() => {
|
||||
this.refreshTable = true;
|
||||
});
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.getTreeselect();
|
||||
this.open = true;
|
||||
this.title = "添加商品分类";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
this.getTreeselect();
|
||||
const id = row.id;
|
||||
getCategory(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改商品分类";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateCategory(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createCategory(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$modal.confirm('是否确认删除商品分类编号为"' + id + '"的数据项?').then(function () {
|
||||
return deleteCategory(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
// 执行导出
|
||||
this.$modal.confirm('是否确认导出所有商品分类数据项?').then(() => {
|
||||
this.exportLoading = true;
|
||||
return exportCategoryExcel(params);
|
||||
}).then(response => {
|
||||
this.$download.excel(response, '商品分类.xls');
|
||||
this.exportLoading = false;
|
||||
}).catch(() => {
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
//
|
||||
.img-height {
|
||||
height: 150px;
|
||||
}
|
||||
</style>
|
||||
280
yudao-ui-admin/src/views/mall/product/property/index.vue
Normal file
280
yudao-ui-admin/src/views/mall/product/property/index.vue
Normal file
@ -0,0 +1,280 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="规格名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入规格名称" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="开启状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择开启状态" clearable size="small">
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['product:property:create']">新增</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="规格名称" align="center" prop="name" />
|
||||
<el-table-column label="规格名称" align="center" prop="propertyValueList">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatList(scope.row.propertyValueList)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="开启状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['product:property:update']">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['product:property:delete']">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="规格名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入规格名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="开启状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
|
||||
:key="dict.value" :label="parseInt(dict.value)">{{ dict.label }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="属性值">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="addPropertyValue()">添加</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-for="(domain, index) in form.propertyValueList"
|
||||
:key="domain.key"
|
||||
:prop="'propertyValueList.' + index + '.name'"
|
||||
:rules="{
|
||||
required: true, message: '属性值不能为空', trigger: 'blur'
|
||||
}"
|
||||
>
|
||||
<el-row>
|
||||
<el-col :span="18">
|
||||
<el-input v-model="domain.name" size="mini"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-button style="margin-left: 20px;" size="mini" @click.prevent="removePropertyValue(domain)">删除</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createProperty, updateProperty, deleteProperty, getProperty, getPropertyPage, exportPropertyExcel } from "@/api/mall/product/property";
|
||||
|
||||
export default {
|
||||
name: "Property",
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 导出遮罩层
|
||||
exportLoading: false,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 规格名称列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
name: null,
|
||||
status: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
name:'',
|
||||
status:'',
|
||||
propertyValueList: [{
|
||||
name: ''
|
||||
}],
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getPropertyPage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
this.form = {
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
status: undefined,
|
||||
propertyValueList: [{
|
||||
name: ''
|
||||
}]
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加规格";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getProperty(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改规格";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateProperty(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createProperty(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$modal.confirm('是否确认删除规格名称为"' + row.name + '"的数据项?').then(function() {
|
||||
return deleteProperty(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$modal.confirm('是否确认导出所有规格名称数据项?').then(() => {
|
||||
this.exportLoading = true;
|
||||
return exportPropertyExcel(params);
|
||||
}).then(response => {
|
||||
this.$download.excel(response, '规格名称.xls');
|
||||
this.exportLoading = false;
|
||||
}).catch(() => {});
|
||||
},
|
||||
removePropertyValue(item) {
|
||||
var index = this.form.propertyValueList.indexOf(item)
|
||||
if (index !== -1) {
|
||||
this.form.propertyValueList.splice(index, 1)
|
||||
}
|
||||
},
|
||||
addPropertyValue() {
|
||||
this.form.propertyValueList.push({
|
||||
name: ''
|
||||
});
|
||||
},
|
||||
formatList(list) {
|
||||
let str = ''
|
||||
for (var i = 0; i < list.length; i++) {
|
||||
str += list[i].name;
|
||||
if(i != list.length-1){
|
||||
str+="/";
|
||||
}
|
||||
}
|
||||
return str
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
743
yudao-ui-admin/src/views/mall/product/spu/index.vue
Normal file
743
yudao-ui-admin/src/views/mall/product/spu/index.vue
Normal file
@ -0,0 +1,743 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="商品名称" prop="name">
|
||||
<el-input v-model="queryParams.name" placeholder="请输入商品名称" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="卖点" prop="sellPoint">
|
||||
<el-input v-model="queryParams.sellPoint" placeholder="请输入卖点" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类id" prop="categoryId">
|
||||
<el-input v-model="queryParams.categoryId" placeholder="请输入分类id" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="价格(分)" prop="price">
|
||||
<el-input v-model="queryParams.price" placeholder="请输入价格 单位使用：分" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="库存数量" prop="quantity">
|
||||
<el-input v-model="queryParams.quantity" placeholder="请输入库存数量" clearable @keyup.enter.native="handleQuery"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择上下架状态" clearable size="small">
|
||||
<el-option label="请选择字典生成" value=""/>
|
||||
<el-option label="上架" value="0"/>
|
||||
<el-option label="下架" value="1"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="创建时间">
|
||||
<el-date-picker v-model="dateRangeCreateTime" style="width: 240px" value-format="yyyy-MM-dd"
|
||||
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['product:spu:create']">新增
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
||||
:loading="exportLoading"
|
||||
v-hasPermi="['product:spu:export']">导出
|
||||
</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<!-- 列表 -->
|
||||
<el-table v-loading="loading" :data="list">
|
||||
<el-table-column label="主键" align="center" prop="id"/>
|
||||
<el-table-column label="商品名称" align="center" prop="name"/>
|
||||
<!-- <el-table-column label="卖点" align="center" prop="sellPoint"/>-->
|
||||
<!-- <el-table-column label="描述" align="center" prop="description"/>-->
|
||||
<el-table-column label="分类id" align="center" prop="categoryId"/>
|
||||
<el-table-column label="商品主图地址" align="center" prop="picUrls">
|
||||
<template slot-scope="scope">
|
||||
<img v-if="scope.row.picUrls" :src="scope.row.picUrls[0]" alt="分类图片" class="img-height"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="排序字段" align="center" prop="sort"/>
|
||||
<el-table-column label="点赞初始人数" align="center" prop="likeCount"/>
|
||||
<el-table-column label="价格 (分)" align="center" prop="price"/>
|
||||
<el-table-column label="库存数量" align="center" prop="quantity"/>
|
||||
<!-- <el-table-column label="状态" align="center" prop="status"/>-->
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['product:spu:update']">修改
|
||||
</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['product:spu:delete']">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="商品名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入商品名称"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="卖点" prop="sellPoint">
|
||||
<el-input v-model="form.sellPoint" placeholder="请输入卖点"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述">
|
||||
<editor v-model="form.description" :min-height="192"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类id" prop="categoryIds">
|
||||
<el-cascader
|
||||
v-model="form.categoryIds"
|
||||
placeholder="请输入分类id"
|
||||
style="width: 100%"
|
||||
:options="categoryList"
|
||||
:props="propName"
|
||||
clearable></el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品主图地址" prop="picUrls">
|
||||
<ImageUpload v-model="form.picUrls" :limit="10"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品规格">
|
||||
<el-button size="mini" @click="shopTagInput()">添加规格</el-button>
|
||||
<div v-for="(tag, tagIndex) in skuTags" :key="tagIndex">
|
||||
<span>{{tag.name}}</span>
|
||||
<el-button style="margin-left: 10px" class="button-new-tag" type="text" icon="el-icon-delete"
|
||||
@click="removeTag(tagIndex)">删除
|
||||
</el-button>
|
||||
<br/>
|
||||
<el-tag
|
||||
v-for="(tagItem, tagItemIndex) in tag.selectValues"
|
||||
:key="tagItem"
|
||||
style="margin-right: 10px"
|
||||
:disable-transitions="false">
|
||||
{{tagItem}}
|
||||
</el-tag>
|
||||
<!-- <el-input-->
|
||||
<!-- class="input-new-tag"-->
|
||||
<!-- v-if="tagItemInputs[tagIndex] && tagItemInputs[tagIndex].visible"-->
|
||||
<!-- v-model="tagItemInputs[tagIndex].value"-->
|
||||
<!-- :ref="`saveTagInput${tagIndex}`"-->
|
||||
<!-- size="small"-->
|
||||
<!-- @keyup.enter.native="handleInputConfirm(tagIndex)"-->
|
||||
<!-- @blur="handleInputConfirm(tagIndex)">-->
|
||||
<!-- </el-input>-->
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="规格名" v-show="isShowTagInput">
|
||||
<el-col :span="8">
|
||||
<el-select v-model="addTagInput.name" filterable allow-create default-first-option placeholder="请选择"
|
||||
@change="handleTagClick">
|
||||
<el-option
|
||||
v-for="item in unUseTags"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.name">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="规格值" v-show="isShowTagInput">
|
||||
<el-col :span="8">
|
||||
<el-select v-model="addTagInput.selectValues" multiple filterable allow-create default-first-option
|
||||
placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in dbTagValues"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.name">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button size="mini" type="primary" @click="addTag()" v-show="isShowTagInput">确定</el-button>
|
||||
<el-button size="mini" @click="hideTagInput()" v-show="isShowTagInput">取消</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.skus.length>0">
|
||||
<el-table
|
||||
:data="form.skus"
|
||||
border
|
||||
style="width: 100%; margin-top: 20px"
|
||||
:span-method="tableSpanMethod">
|
||||
<el-table-column v-for="(leftTitle, index) in skuTags" :key="index" :label="leftTitle.name">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.propertyChildNames[index]}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="skuTags.length"
|
||||
prop="picUrl"
|
||||
label="sku图片"
|
||||
width="180">
|
||||
<template slot-scope="scope">
|
||||
<ImageUpload v-model="scope.row.picUrl" :limit="1">
|
||||
</ImageUpload>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="prodName"
|
||||
label="条形码"
|
||||
width="250" v-if="skuTags.length">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.barCode" type="textarea" :disabled="scope.row.status==1"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="price"
|
||||
label="销售价">
|
||||
<template slot-scope="scope">
|
||||
<el-input-number
|
||||
size="small"
|
||||
v-model="scope.row.price"
|
||||
controls-position="right"
|
||||
:precision="2"
|
||||
:max="1000000000"
|
||||
:min="0.01"
|
||||
:disabled="scope.row.status==1">
|
||||
</el-input-number>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="oriPrice"
|
||||
label="成本价">
|
||||
<template slot-scope="scope">
|
||||
<el-input-number
|
||||
size="small"
|
||||
v-model="scope.row.costPrice"
|
||||
controls-position="right"
|
||||
:precision="2"
|
||||
:max="1000000000"
|
||||
:min="0.01"
|
||||
:disabled="scope.row.status==1">
|
||||
</el-input-number>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="oriPrice"
|
||||
label="原价">
|
||||
<template slot-scope="scope">
|
||||
<el-input-number
|
||||
size="small"
|
||||
v-model="scope.row.originalPrice"
|
||||
controls-position="right"
|
||||
:precision="2"
|
||||
:max="1000000000"
|
||||
:min="0.01"
|
||||
:disabled="scope.row.status==1">
|
||||
</el-input-number>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" size="small" @click="changeSkuStatus(`${scope.$index}`)" v-if="scope.row.status===0">
|
||||
正常
|
||||
</el-button>
|
||||
<el-button type="text" size="small" @click="changeSkuStatus(`${scope.$index}`)" v-else>已禁用</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序字段" prop="sort">
|
||||
<el-input v-model="form.sort" placeholder="请输入排序字段"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="点赞初始人数" prop="likeCount">
|
||||
<el-input v-model="form.likeCount" placeholder="请输入点赞初始人数"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="价格 单位使用：分" prop="price">
|
||||
<el-input v-model="form.price" placeholder="请输入价格 单位使用：分"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="库存数量" prop="quantity">
|
||||
<el-input v-model="form.quantity" placeholder="请输入库存数量"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="上下架状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio label="0">上架</el-radio>
|
||||
<el-radio label="1">下架</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {createSpu, updateSpu, deleteSpu, getSpu, getSpuPage, exportSpuExcel} from "@/api/mall/product/spu";
|
||||
import {
|
||||
createCategory,
|
||||
deleteCategory,
|
||||
exportCategoryExcel,
|
||||
getCategory,
|
||||
listCategory,
|
||||
updateCategory
|
||||
} from "@/api/mall/product/category";
|
||||
import {
|
||||
createProperty,
|
||||
updateProperty,
|
||||
deleteProperty,
|
||||
getProperty,
|
||||
getPropertyPage,
|
||||
exportPropertyExcel
|
||||
} from "@/api/mall/product/property";
|
||||
|
||||
import Editor from '@/components/Editor';
|
||||
import ImageUpload from '@/components/ImageUpload';
|
||||
|
||||
export default {
|
||||
name: "Spu",
|
||||
components: {
|
||||
Editor, ImageUpload
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableLeftTitles: [],
|
||||
dbTagValues: [],
|
||||
allhistoryTags: [],
|
||||
unUseTags: [],
|
||||
propertyPageList: [],
|
||||
isShowTagInput: false,
|
||||
addTagInput: {
|
||||
name: '',
|
||||
propertyId: '',
|
||||
selectValues: [],
|
||||
selectValueIds: [],
|
||||
},
|
||||
skuTags: [],
|
||||
propName: {
|
||||
checkStrictly: true,
|
||||
label: 'name',
|
||||
value: 'id'
|
||||
},
|
||||
categoryList: [],
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 导出遮罩层
|
||||
exportLoading: false,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 商品spu列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
dateRangeCreateTime: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
name: null,
|
||||
sellPoint: null,
|
||||
description: null,
|
||||
categoryId: null,
|
||||
picUrls: null,
|
||||
sort: null,
|
||||
likeCount: null,
|
||||
price: null,
|
||||
quantity: null,
|
||||
status: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
sellPoint: undefined,
|
||||
description: undefined,
|
||||
categoryId: undefined,
|
||||
categoryIds: [],
|
||||
picUrls: undefined,
|
||||
sort: undefined,
|
||||
likeCount: undefined,
|
||||
price: undefined,
|
||||
quantity: undefined,
|
||||
status: undefined,
|
||||
isShowTagInput: undefined,
|
||||
skus:[],
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
sellPoint: [{required: true, message: "卖点不能为空", trigger: "blur"}],
|
||||
description: [{required: true, message: "描述不能为空", trigger: "blur"}],
|
||||
categoryIds: [{required: true, message: "分类id不能为空", trigger: "blur"}],
|
||||
picUrls: [{required: true, message: "商品主图地址", trigger: "blur"}],
|
||||
sort: [{required: true, message: "排序字段不能为空", trigger: "blur"}],
|
||||
},
|
||||
tagIndex:0,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
||||
this.getList();
|
||||
|
||||
},
|
||||
methods: {
|
||||
getTableSpecData() {
|
||||
return this.value
|
||||
},
|
||||
tableSpanMethod({row, column, rowIndex, columnIndex}) {
|
||||
|
||||
},
|
||||
changeSkuStatus(tagIndex) {
|
||||
if(this.form.skus[tagIndex].status == 0){
|
||||
this.form.skus[tagIndex].status = 1 ;
|
||||
}else {
|
||||
this.form.skus[tagIndex].status = 0 ;
|
||||
}
|
||||
|
||||
},
|
||||
skuAddProdName() {
|
||||
if (this.initing) {
|
||||
return
|
||||
}
|
||||
let skuList = []
|
||||
for (let i = 0; i < this.value.length; i++) {
|
||||
const sku = Object.assign({}, this.value[i])
|
||||
if (!sku.properties) {
|
||||
return
|
||||
}
|
||||
sku.skuName = ''
|
||||
let properties = sku.properties.split(';')
|
||||
for (const propertiesKey in properties) {
|
||||
sku.skuName += properties[propertiesKey].split(':')[1] + ' '
|
||||
}
|
||||
sku.prodName = this.prodName + ' ' + sku.skuName
|
||||
skuList.push(sku)
|
||||
}
|
||||
this.$emit('input', skuList)
|
||||
},
|
||||
handleTagClose(tagIndex, tagItemIndex) {
|
||||
|
||||
},
|
||||
//确定添加sku规格
|
||||
addTag() {
|
||||
|
||||
let skus = this.unUseTags.map(function (item, index) {
|
||||
return item.name
|
||||
});
|
||||
console.log("skus=="+JSON.stringify(skus))
|
||||
let index = skus.indexOf(this.addTagInput.name);
|
||||
console.log("index=="+index)
|
||||
console.log("skus[index].id=="+this.unUseTags[index].id)
|
||||
console.log("this.unUseTags[index].propertyValueList=="+JSON.stringify(this.unUseTags[index].propertyValueList))
|
||||
this.addTagInput.propertyId = this.unUseTags[index].id;
|
||||
for (let i = 0; i < this.addTagInput.selectValues.length; i++) {
|
||||
for (let j = 0; j < this.unUseTags[index].propertyValueList.length; j++) {
|
||||
if (this.addTagInput.selectValues[i] === this.unUseTags[index].propertyValueList[j].name) {
|
||||
this.addTagInput.selectValueIds.push(this.unUseTags[index].propertyValueList[j].id)
|
||||
}
|
||||
}
|
||||
}
|
||||
let addTagInput = JSON.parse(JSON.stringify(this.addTagInput))
|
||||
console.log("addTagInput=="+JSON.stringify(addTagInput))
|
||||
this.skuTags.push(addTagInput);
|
||||
this.unUseTags.splice(index, 1);
|
||||
this.isShowTagInput = false;
|
||||
this.getTable();
|
||||
},
|
||||
getTable(){
|
||||
this.form.skus=[];
|
||||
let skuTags = JSON.parse(JSON.stringify(this.skuTags));
|
||||
let sku1s = [];
|
||||
let skuIds = [];
|
||||
let propertyIds = [];
|
||||
let propertyNames = [];
|
||||
for (let i = 0; i < skuTags.length; i++) {
|
||||
sku1s.push(skuTags[i].selectValues);
|
||||
skuIds.push(skuTags[i].selectValueIds);
|
||||
propertyIds.push(skuTags[i].propertyId);
|
||||
propertyNames.push(skuTags[i].name);
|
||||
}
|
||||
let skuAll = sku1s.reduce((x,y) =>{
|
||||
let arr = [];
|
||||
x.forEach(m => y.forEach(y => arr.push(m.concat([y]))))
|
||||
return arr;
|
||||
},[[]])
|
||||
console.log(skuAll);
|
||||
|
||||
let skuIdAll = skuIds.reduce((x,y) =>{
|
||||
let arr = [];
|
||||
x.forEach(m => y.forEach(y => arr.push(m.concat([y]))))
|
||||
return arr;
|
||||
},[[]])
|
||||
console.log(skuIdAll);
|
||||
for (let i = 0; i < skuAll.length; i++) {
|
||||
let han = {
|
||||
propertyNames:propertyNames,
|
||||
propertyIds:propertyIds,
|
||||
propertyChildNames:skuAll[i],
|
||||
propertyChildIds:skuIdAll[i],
|
||||
properties: [],
|
||||
picUrl: '',
|
||||
costPrice: '',
|
||||
originalPrice: '',
|
||||
spuId: '',
|
||||
prodName: '',
|
||||
price: '',
|
||||
barCode: '',
|
||||
status: '0',
|
||||
}
|
||||
this.form.skus.push(han);
|
||||
}
|
||||
this.form.skus.forEach(x=>{
|
||||
x.properties=[];
|
||||
for (let i = 0; i <x.propertyIds.length ; i++) {
|
||||
x.properties.push({
|
||||
propertyId:x.propertyIds[i],
|
||||
valueId:x.propertyChildIds[i]
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
console.log("this.skus=="+JSON.stringify(this.form.skus))
|
||||
},
|
||||
hideTagInput() {
|
||||
this.isShowTagInput = false;
|
||||
this.addTagInput = {
|
||||
name: '',
|
||||
propertyId: '',
|
||||
selectValues: [],
|
||||
selectValueIds: [],
|
||||
};
|
||||
},
|
||||
shopTagInput() {
|
||||
if (this.unUseTags.length <= 0) {
|
||||
return this.$message.error("规格已经添加完毕")
|
||||
}
|
||||
this.isShowTagInput = true;
|
||||
this.addTagInput = {
|
||||
name: '',
|
||||
propertyId: '',
|
||||
selectValues: [],
|
||||
selectValueIds: [],
|
||||
};
|
||||
},
|
||||
//删除已选的规格
|
||||
removeTag(row) {
|
||||
let skus = this.allhistoryTags.map(function (item, index) {
|
||||
return item.name
|
||||
})
|
||||
let index = skus.indexOf(this.skuTags[row].name);
|
||||
this.unUseTags.push(this.allhistoryTags[index]);
|
||||
this.skuTags.splice(row, 1);
|
||||
this.getTable();
|
||||
},
|
||||
handleTagClick(row) {
|
||||
for (let i = 0; i < this.propertyPageList.length; i++) {
|
||||
if (row == this.propertyPageList[i].name) {
|
||||
this.dbTagValues = this.propertyPageList[i].propertyValueList
|
||||
}
|
||||
}
|
||||
},
|
||||
/** 查询规格 */
|
||||
getPropertyPageList() {
|
||||
// 执行查询
|
||||
getPropertyPage().then(response => {
|
||||
this.propertyPageList = response.data.list;
|
||||
|
||||
this.unUseTags = this.propertyPageList.map(function (item, index) {
|
||||
return item
|
||||
})
|
||||
this.allhistoryTags = JSON.parse(JSON.stringify(this.unUseTags));
|
||||
console.log(this.propertyPageList)
|
||||
});
|
||||
},
|
||||
/** 查询分类 */
|
||||
getListCategory() {
|
||||
// 执行查询
|
||||
listCategory().then(response => {
|
||||
this.categoryList = this.handleTree(response.data, "id", "parentId");
|
||||
|
||||
});
|
||||
},
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行查询
|
||||
getSpuPage(params).then(response => {
|
||||
this.list = response.data.list;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
/** 表单重置 */
|
||||
reset() {
|
||||
|
||||
this.form = {
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
sellPoint: undefined,
|
||||
description: undefined,
|
||||
categoryId: undefined,
|
||||
categoryIds: [],
|
||||
picUrls: undefined,
|
||||
sort: undefined,
|
||||
likeCount: undefined,
|
||||
price: undefined,
|
||||
quantity: undefined,
|
||||
status: undefined,
|
||||
isShowTagInput: undefined,
|
||||
skus:[],
|
||||
};
|
||||
this.skuTags=[];
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRangeCreateTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加商品spu";
|
||||
this.getListCategory();
|
||||
this.getPropertyPageList();
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
const id = row.id;
|
||||
getSpu(id).then(response => {
|
||||
console.log(">>>>>> response.data:" + JSON.stringify(response.data))
|
||||
let dataSpu = response.data;
|
||||
this.form = {
|
||||
id: dataSpu.id,
|
||||
name: dataSpu.name,
|
||||
sellPoint: dataSpu.sellPoint,
|
||||
description: dataSpu.sellPoint,
|
||||
categoryId: dataSpu.sellPoint,
|
||||
categoryIds: dataSpu.categoryIds,
|
||||
picUrls: dataSpu.picUrls,
|
||||
sort: dataSpu.sort,
|
||||
likeCount: dataSpu.likeCount,
|
||||
price: dataSpu.price,
|
||||
quantity: dataSpu.quantity,
|
||||
status: dataSpu.status,
|
||||
isShowTagInput:undefined,
|
||||
skus:dataSpu.skus
|
||||
// skus:dataSpu.productSkuRespVOS,
|
||||
};
|
||||
this.open = true;
|
||||
this.title = "修改商品spu";
|
||||
});
|
||||
},
|
||||
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
console.log(this.form.picUrls.split(','));
|
||||
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
this.form.picUrls = this.form.picUrls.split(',');
|
||||
this.form.categoryId = this.form.categoryIds[(this.form.categoryIds.length - 1)];
|
||||
this.form.status = Number(this.form.status);
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
updateSpu(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
createSpu(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$modal.confirm('是否确认删除商品spu编号为"' + id + '"的数据项?').then(function () {
|
||||
return deleteSpu(id);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 处理查询参数
|
||||
let params = {...this.queryParams};
|
||||
params.pageNo = undefined;
|
||||
params.pageSize = undefined;
|
||||
this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
|
||||
// 执行导出
|
||||
this.$modal.confirm('是否确认导出所有商品spu数据项?').then(() => {
|
||||
this.exportLoading = true;
|
||||
return exportSpuExcel(params);
|
||||
}).then(response => {
|
||||
this.$download.excel(response, '商品spu.xls');
|
||||
this.exportLoading = false;
|
||||
}).catch(() => {
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.app-container {
|
||||
.el-tag + .el-tag {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.button-new-tag {
|
||||
margin-left: 10px;
|
||||
height: 32px;
|
||||
line-height: 30px;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.input-new-tag {
|
||||
width: 90px;
|
||||
margin-left: 10px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.img-height {
|
||||
height: 65px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -87,6 +87,8 @@ export default {
|
||||
username: "admin",
|
||||
password: "admin123",
|
||||
rememberMe: false,
|
||||
code: "",
|
||||
uuid: "",
|
||||
},
|
||||
loginRules: {
|
||||
username: [
|
||||
@ -170,16 +172,20 @@ export default {
|
||||
removeUsername()
|
||||
removePassword()
|
||||
}
|
||||
this.$store.dispatch("SocialLogin2", {
|
||||
code: this.code,
|
||||
state: this.state,
|
||||
type: this.type,
|
||||
this.$store.dispatch("Login", {
|
||||
socialCode: this.code,
|
||||
socialState: this.state,
|
||||
socialType: this.type,
|
||||
// 账号密码登录
|
||||
username: this.loginForm.username,
|
||||
password: this.loginForm.password
|
||||
password: this.loginForm.password,
|
||||
code: this.loginForm.code,
|
||||
uuid: this.loginForm.uuid,
|
||||
}).then(() => {
|
||||
this.$router.push({ path: this.redirect || "/" }).catch(()=>{});
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.getCode()
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
<el-form-item style="width:100%;">
|
||||
<el-button :loading="loading" size="medium" type="primary" style="width:60%;"
|
||||
@click.native.prevent="handleAuthorize(true)">
|
||||
<span v-if="!loading">统一授权</span>
|
||||
<span v-if="!loading">同意授权</span>
|
||||
<span v-else>授 权 中...</span>
|
||||
</el-button>
|
||||
<el-button size="medium" style="width:36%"
|
||||
|
||||
@ -103,9 +103,10 @@
|
||||
<el-form-item label="刷新令牌的有效期" prop="refreshTokenValiditySeconds">
|
||||
<el-input-number v-model="form.refreshTokenValiditySeconds" placeholder="单位：秒" />
|
||||
</el-form-item>
|
||||
<el-form-item label="可重定向的 URI 地址" prop="redirectUris">
|
||||
<el-select v-model="form.redirectUris" multiple filterable allow-create placeholder="请输入可重定向的 URI 地址" style="width: 500px" >
|
||||
<el-option v-for="redirectUri in form.redirectUris" :key="redirectUri" :label="redirectUri" :value="redirectUri"/>
|
||||
<el-form-item label="授权类型" prop="authorizedGrantTypes">
|
||||
<el-select v-model="form.authorizedGrantTypes" multiple filterable placeholder="请输入授权类型" style="width: 500px" >
|
||||
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.SYSTEM_OAUTH2_GRANT_TYPE)"
|
||||
:key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="授权范围" prop="scopes">
|
||||
@ -113,11 +114,16 @@
|
||||
<el-option v-for="scope in form.scopes" :key="scope" :label="scope" :value="scope"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="自动授权" prop="autoApproveScopes">
|
||||
<el-form-item label="自动授权范围" prop="autoApproveScopes">
|
||||
<el-select v-model="form.autoApproveScopes" multiple filterable placeholder="请输入授权范围" style="width: 500px" >
|
||||
<el-option v-for="scope in form.scopes" :key="scope" :label="scope" :value="scope"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="可重定向的 URI 地址" prop="redirectUris">
|
||||
<el-select v-model="form.redirectUris" multiple filterable allow-create placeholder="请输入可重定向的 URI 地址" style="width: 500px" >
|
||||
<el-option v-for="redirectUri in form.redirectUris" :key="redirectUri" :label="redirectUri" :value="redirectUri"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="权限" prop="authorities">
|
||||
<el-select v-model="form.authorities" multiple filterable allow-create placeholder="请输入权限" style="width: 500px" >
|
||||
<el-option v-for="authority in form.authorities" :key="authority" :label="authority" :value="authority"/>
|
||||
|
||||
@ -44,10 +44,6 @@
|
||||
|
||||
<!-- 操作工具栏 -->
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
||||
v-hasPermi="['system:sms-log:create']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" :loading="exportLoading"
|
||||
v-hasPermi="['system:sms-log:export']">导出</el-button>
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode"
|
||||
ref="tree" default-expand-all @node-click="handleNodeClick"/>
|
||||
ref="tree" default-expand-all highlight-current @node-click="handleNodeClick"/>
|
||||
</div>
|
||||
</el-col>
|
||||
<!--用户数据-->
|
||||
|
||||
Reference in New Issue
Block a user