From 6863a4a507d5c78d617a30d93f35279ad97b79f3 Mon Sep 17 00:00:00 2001
From: peng <peng.com>
Date: 星期日, 04 一月 2026 11:12:38 +0800
Subject: [PATCH] 私厨定制
---
manager/src/views/kitchen/goods.vue | 1081 ++++++++++++++++++++++++
manager/src/views/kitchen/cover.vue | 442 ++++++++++
manager/src/api/kitchen.js | 178 ++++
manager/src/views/kitchen/img.vue | 451 ++++++++++
manager/src/views/kitchen/tag.vue | 464 ++++++++++
5 files changed, 2,616 insertions(+), 0 deletions(-)
diff --git a/manager/src/api/kitchen.js b/manager/src/api/kitchen.js
index 855cfe4..78f84fb 100644
--- a/manager/src/api/kitchen.js
+++ b/manager/src/api/kitchen.js
@@ -46,3 +46,181 @@
data: data
})
}
+// 绉佸帹鍒嗙被鏍囩
+export const getKitchenTagPage = (data) => {
+ return service({
+ url: "/lmk/kitchen-tag/page",
+ method: "GET",
+ params: data
+ })
+}
+
+// 鑾峰彇鍘ㄦ埧鏍囩鍒楄〃
+export const getKitchenTagList = () => {
+ return service({
+ url: "/lmk/kitchen-tag/list",
+ method: "GET"
+ })
+}
+// 娣诲姞绉佸帹鍒嗙被鏍囩
+export const addKitchenTag = (data) => {
+ return service({
+ url: "/lmk/kitchen-tag",
+ method: "POST",
+ data: data
+ })
+}
+// 缂栬緫绉佸帹鍒嗙被鏍囩
+export const editKitchenTag= (data) => {
+ return service({
+ url: "/lmk/kitchen-tag",
+ method: "PUT",
+ data: data
+ })
+}
+// 缂栬緫绉佸帹鍒嗙被鏍囩
+export const editKitchenTagStaus= (id,status) => {
+ return service({
+ url: `/lmk/kitchen-tag/${id}/${status}`,
+ method: "PUT"
+ })
+}
+// 鍒犻櫎绉佸帹鍒嗙被鏍囩
+export const delKitchenTag = (id) => {
+ return service({
+ url: "/lmk/kitchen-tag/"+id,
+ method: "DELETE",
+ })
+}
+// 鎵归噺鍒犻櫎绁炲帹鏍囩
+export const deleteTagBatch = (data) => {
+ return service({
+ url: "/lmk/kitchen-tag/batch",
+ method: "DELETE",
+ data: data
+ })
+}
+// 绉佸帹鍟嗗搧
+export const getKitchenGoodsPage = (data) => {
+ return service({
+ url: "/lmk/kitchen-customize/page",
+ method: "GET",
+ params: data
+ })
+}
+// 娣诲姞绉佸帹鍟嗗搧
+export const addKitchenGoods = (data) => {
+ return service({
+ url: "/lmk/kitchen-customize",
+ method: "POST",
+ data: data
+ })
+}
+// 缂栬緫绉佸帹鍟嗗搧
+export const editKitchenGoods= (data) => {
+ return service({
+ url: "/lmk/kitchen-customize",
+ method: "PUT",
+ data: data
+ })
+}
+// 缂栬緫绉佸帹鍟嗗搧
+export const editKitchenGoodsStaus= (id,status) => {
+ return service({
+ url: `/lmk/kitchen-customize/${id}/${status}`,
+ method: "PUT"
+ })
+}
+// 鍒犻櫎绉佸帹鍟嗗搧
+export const delKitchenGoods = (id) => {
+ return service({
+ url: "/lmk/kitchen-customize/"+id,
+ method: "DELETE",
+ })
+}
+// 鎵归噺鍒犻櫎绉佸帹鍟嗗搧
+export const deleteGoodsBatch = (data) => {
+ return service({
+ url: "/lmk/kitchen-customize/batch",
+ method: "DELETE",
+ data: data
+ })
+}
+// 绉佸帹banner
+export const getKitchenAdImgPage = (data) => {
+ return service({
+ url: "/lmk/ad-img/page",
+ method: "GET",
+ params: data
+ })
+}
+// 娣诲姞绉佸帹banner
+export const addKitchenAdImg = (data) => {
+ return service({
+ url: "/lmk/ad-img",
+ method: "POST",
+ data: data
+ })
+}
+// 缂栬緫绉佸帹banner
+export const editKitchenAdImg= (data) => {
+ return service({
+ url: "/lmk/ad-img",
+ method: "PUT",
+ data: data
+ })
+}
+// 鍒犻櫎绉佸帹banner
+export const delKitchenAdImg = (id) => {
+ return service({
+ url: "/lmk/ad-img/"+id,
+ method: "DELETE",
+ })
+}
+// 鎵归噺鍒犻櫎绉佸帹banner
+export const deleteAdImgBatch = (data) => {
+ return service({
+ url: "/lmk/ad-img",
+ method: "DELETE",
+ data: data
+ })
+}
+// 绉佸帹鍥剧墖
+export const getKitchenAdCoverPage = (data) => {
+ return service({
+ url: "/lmk/ad-cover/page",
+ method: "GET",
+ params: data
+ })
+}
+// 娣诲姞绉佸帹banner
+export const addKitchenAdCover = (data) => {
+ return service({
+ url: "/lmk/ad-cover",
+ method: "POST",
+ data: data
+ })
+}
+// 缂栬緫绉佸帹banner
+export const editKitchenAdCover= (data) => {
+ return service({
+ url: "/lmk/ad-cover",
+ method: "PUT",
+ data: data
+ })
+}
+// 鍒犻櫎绉佸帹banner
+export const delKitchenAdCover = (id) => {
+ return service({
+ url: "/lmk/ad-cover/"+id,
+ method: "DELETE",
+ })
+}
+// 鎵归噺鍒犻櫎绉佸帹banner
+export const deleteAdCoverBatch = (data) => {
+ return service({
+ url: "/lmk/ad-cover",
+ method: "DELETE",
+ data: data
+ })
+}
diff --git a/manager/src/views/kitchen/cover.vue b/manager/src/views/kitchen/cover.vue
new file mode 100644
index 0000000..9ab9335
--- /dev/null
+++ b/manager/src/views/kitchen/cover.vue
@@ -0,0 +1,442 @@
+<template>
+ <div>
+ <Card>
+ <Form
+ ref="searchForm"
+ @keydown.enter.native="handleSearch"
+ :model="searchForm"
+ inline
+ :label-width="70"
+ class="search-form"
+ >
+ <Button
+ @click="handleSearch"
+ type="primary"
+ icon="ios-search"
+ class="search-btn"
+ >鎼滅储</Button
+ >
+ </Form>
+
+ <Row class="operation padding-row">
+ <Button @click="openAdd" type="info">娣诲姞</Button>
+ <Button @click="delBatch" type="error">鎵归噺鍒犻櫎</Button>
+ </Row>
+
+ <Modal
+ v-model="modelShow"
+ :title="modelTitle"
+ >
+ <Form ref="form" :model="form" :label-width="100" :rules="rules">
+ <Row :gutter="24">
+ <Col span="24">
+ <FormItem label="灏侀潰鍥剧墖" prop="coverUrl">
+ <Upload
+ v-if="!coverTempUrl"
+ :before-upload="(file) => handleBeforeUpload(file, 'cover')"
+ :format="['jpg','jpeg','png','gif']"
+ :max-size="20480"
+ action=""
+ accept="image/*"
+ >
+ <Button icon="ios-cloud-upload-outline">涓婁紶灏侀潰鍥剧墖</Button>
+ </Upload>
+ <div v-else class="upload-file-info">
+ <img :src="coverTempUrl" alt="灏侀潰鍥剧墖" class="preview-image-limit">
+ <Button type="text" @click="handleRemove('cover')">鍒犻櫎</Button>
+ </div>
+ </FormItem>
+ </Col>
+ </Row>
+ </Form>
+ <div slot="footer">
+ <Button type="text" @click="modelClose">鍙栨秷</Button>
+ <Button type="primary" :loading="submitLoading" @click="saveOrUpdate">鎻愪氦</Button>
+ </div>
+ </Modal>
+
+ <Table
+ :loading="loading"
+ border
+ :columns="columns"
+ :data="data"
+ ref="table"
+ sortable="custom"
+ @on-sort-change="changeSort"
+ @on-selection-change="showSelect"
+ >
+ <template slot-scope="{ row, index }" slot="action">
+ <Button type="info" size="small" style="margin-right: 5px" @click="openEdit(row)">缂栬緫</Button>
+ <Button type="error" size="small" @click="delById(row)">鍒犻櫎</Button>
+ </template>
+ </Table>
+
+ <Row type="flex" justify="end" class="mt_10">
+ <Page
+ :current="searchForm.pageNumber"
+ :total="total"
+ :page-size="searchForm.pageSize"
+ @on-change="changePage"
+ @on-page-size-change="changePageSize"
+ :page-size-opts="[10, 20, 50]"
+ size="small"
+ show-total
+ show-elevator
+ show-sizer
+ ></Page>
+ </Row>
+ </Card>
+ </div>
+</template>
+
+<script>
+import JsonExcel from "vue-json-excel";
+import {addKitchenAdCover, deleteAdCoverBatch, delKitchenAdCover, editKitchenAdCover, getKitchenAdCoverPage} from "@/api/kitchen";
+import {uploadFileByLmk} from "@/api/common";
+export default {
+ name: "KitchenAdCoverList",
+ components: {
+ "download-excel": JsonExcel,
+ },
+ data() {
+ return {
+ // 淇濆瓨鍔犺浇
+ submitLoading: false,
+ // 鏂板淇敼琛ㄥ崟
+ form: {
+ id: '',
+ coverUrl: '',
+ },
+ rules: {
+ coverUrl: [
+ {
+ required: true,
+ message: '璇蜂笂浼犲皝闈㈠浘鐗�',
+ trigger: 'change',
+ validator: (rule, value, callback) => {
+ // 鍙湪鏂板鏃堕獙璇侊紝缂栬緫鏃跺鏋滃凡鏈夊浘鐗囧垯涓嶉渶瑕佷笂浼犳柊鍥剧墖
+ if (!this.form.id && !value && !this.coverFile) {
+ callback(new Error('璇蜂笂浼犲皝闈㈠浘鐗�'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ },
+ modelShow: false, // 寮圭獥鏄鹃殣
+ modelTitle: '', // 寮圭獥title
+ // 琛ㄦ牸鐨勮〃澶翠互鍙婂唴瀹�
+ fields: {
+ 鍥剧墖: "coverUrl",
+ 鎿嶄綔: "action"
+ },
+ // 鍥剧墖涓婁紶鐩稿叧
+ coverFile: null,
+ coverTempUrl: null,
+ loading: true, // 琛ㄥ崟鍔犺浇鐘舵��
+ searchForm: {
+ // 鎼滅储妗嗗垵濮嬪寲瀵硅薄
+ pageNumber: 1, // 褰撳墠椤垫暟
+ pageSize: 10, // 椤甸潰澶у皬
+ },
+ selectDate: null,
+ columns: [
+ {
+ title: "灏侀潰鍥剧墖",
+ key: "coverUrl",
+ minWidth: 170,
+ render: (h, params) => {
+ if (params.row.coverUrl) {
+ return h('div', [
+ h('img', {
+ attrs: {
+ src: params.row.coverUrl,
+ alt: '灏侀潰鍥剧墖',
+ },
+ style: {
+ width: '100px',
+ height: '60px',
+ objectFit: 'cover',
+ borderRadius: '4px',
+ },
+ }),
+ ]);
+ } else {
+ return h('span', '鏃犲浘鐗�');
+ }
+ },
+ },
+ {
+ title: "鎿嶄綔",
+ key: "action",
+ slot: "action",
+ align: "center",
+ width: 400,
+ },
+ ],
+ data: [], // 琛ㄥ崟鏁版嵁
+ total: 0, // 琛ㄥ崟鏁版嵁鎬绘暟
+ selectCount: 0, // 宸查�夋暟閲�
+ selectList: [], // 宸查�夋暟鎹垪琛�
+ };
+ },
+ methods: {
+ showSelect(e) {
+ this.selectList = e.map(d => d.id);
+ this.selectCount = e.length;
+ },
+ // 鎺掑簭
+ changeSort(e) {
+ this.searchForm.sort = e.key;
+ this.searchForm.order = e.order;
+ if (e.order == "normal") {
+ this.searchForm.order = "";
+ }
+ this.getDataList();
+ },
+ // 鎵归噺鍒犻櫎
+ delBatch() {
+ if (this.selectCount <= 0) {
+ this.$Message.warning("鎮ㄨ繕鏈�夋嫨瑕佸垹闄ょ殑鏁版嵁");
+ return;
+ }
+ this.$Modal.confirm({
+ title: "纭鍒犻櫎",
+ content: "鎮ㄧ‘璁よ鍒犻櫎鎵�閫夌殑 " + this.selectCount + " 鏉℃暟鎹�?",
+ loading: true,
+ onOk: () => {
+ deleteAdCoverBatch(this.selectList).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍒犻櫎鎴愬姛");
+ this.selectList = [];
+ this.selectCount = 0;
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // id鍒犻櫎
+ delById(row) {
+ this.$Modal.confirm({
+ title: "纭鍒犻櫎",
+ content: "鎮ㄧ‘璁よ鍒犻櫎灏侀潰鍥剧墖锛�",
+ loading: true,
+ onOk: () => {
+ delKitchenAdCover(row.id).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍒犻櫎鎴愬姛");
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // 鎵撳紑鏂板
+ openAdd() {
+ this.modelTitle = "鏂板灏侀潰鍥剧墖"
+ this.modelShow = true
+ this.form = {}
+ // 娓呯┖鍥剧墖涓婁紶鐘舵��
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ },
+ // 鎵撳紑淇敼
+ openEdit(row) {
+ this.modelTitle = "淇敼灏侀潰鍥剧墖"
+ this.form = {};
+ this.form.id = row.id
+ this.form.coverUrl = row.coverUrl || '';
+ // 濡傛灉鏈夊浘鐗嘦RL锛屽垯鏄剧ず棰勮
+ if (row.coverUrl) {
+ this.coverTempUrl = row.coverUrl;
+ }
+ this.modelShow = true
+ console.log(this.form)
+ },
+ // 涓婁紶鏂囦欢
+ async uploadFileByLmk() {
+ if (this.coverFile) {
+ this.submitLoading = true;
+ const formData = new FormData();
+ formData.append('file', this.coverFile);
+
+ await uploadFileByLmk(formData).then(res => {
+ this.submitLoading = false;
+ if (res.code === 200) {
+ this.form.coverUrl = res.data.fileKey;
+ } else {
+ this.$Message.error(res.msg || '涓婁紶澶辫触');
+ }
+ }).catch(() => {
+ this.submitLoading = false;
+ this.$Message.error('涓婁紶澶辫触');
+ });
+ }
+ },
+
+ // 鏂板鎴栦慨鏀�
+ async saveOrUpdate() {
+ await this.uploadFileByLmk();
+
+ this.$refs.form.validate(valid => {
+ try {
+ if (valid) {
+ this.submitLoading = true;
+ if (this.form.id) {
+ // 淇敼
+ editKitchenAdCover(this.form).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("淇敼鎴愬姛");
+ this.modelClose();
+ this.getDataList();
+ }
+ }).catch(() => {
+ this.submitLoading = false;
+ });
+ } else {
+ // 鏂板
+ addKitchenAdCover(this.form).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("娣诲姞鎴愬姛");
+ this.modelClose();
+ this.getDataList();
+ }
+ }).catch(() => {
+ this.submitLoading = false;
+ });
+ }
+ }
+ } finally {
+ this.submitLoading = false;
+ }
+ });
+ },
+ // 澶勭悊鍥剧墖涓婁紶鍓�
+ handleBeforeUpload(file, type) {
+ if ("cover" === type) {
+ this.coverFile = file;
+ this.coverTempUrl = URL.createObjectURL(file);
+ return false;
+ }
+ },
+
+ // 鍒犻櫎鍥剧墖
+ handleRemove(type) {
+ if ('cover' === type) {
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ this.form.coverUrl = '';
+ }
+ },
+
+ // 鍏抽棴寮圭獥
+ modelClose() {
+ this.submitLoading = false;
+ this.modelShow = false;
+ // 閲嶇疆鍥剧墖涓婁紶鐘舵��
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ this.form.coverUrl = '';
+ },
+ // 鍒濆鍖栨暟鎹�
+ init() {
+ this.getDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤电爜
+ changePage(v) {
+ this.searchForm.pageNumber = v;
+ this.getDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤垫暟
+ changePageSize(v) {
+ this.searchForm.pageNumber = 1;
+ this.searchForm.pageSize = v;
+ this.getDataList();
+ },
+ // 鎼滅储
+ handleSearch() {
+ this.searchForm.pageNumber = 1;
+ this.searchForm.pageSize = 10;
+ this.getDataList();
+ },
+ // 璧锋鏃堕棿浠庢柊璧嬪��
+ selectDateRange(v) {
+ if (v) {
+ this.searchForm.startDate = v[0];
+ this.searchForm.endDate = v[1];
+ }
+ },
+ // 鑾峰彇鍒楄〃鏁版嵁
+ getDataList() {
+ this.loading = true;
+ getKitchenAdCoverPage(this.searchForm).then((res) => {
+ console.log(res)
+ this.loading = false;
+ if (res.code == 200) {
+ this.data = res.data;
+ this.total = res.total;
+ }
+ });
+ this.total = this.data.length;
+ this.loading = false;
+ },
+ },
+ mounted() {
+ this.init();
+ },
+};
+</script>
+<style lang="scss" scoped>
+.export {
+ margin: 10px 20px 10px 0;
+}
+.export-excel-wrapper {
+ display: inline;
+}
+.order-tab {
+ width: 950px;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ background-color: #f0f0f0;
+ padding: 0 10px;
+ margin-bottom: 10px;
+ div {
+ text-align: center;
+ padding: 4px 12px;
+ border-radius: 4px;
+ cursor: pointer;
+ }
+ .current {
+ background-color: #ffffff;
+ }
+}
+
+.upload-file-info {
+ display: flex;
+ align-items: center;
+ margin-top: 10px;
+}
+
+.upload-file-info img {
+ max-width: 200px;
+ max-height: 100px;
+ margin-right: 10px;
+ border-radius: 4px;
+ object-fit: cover;
+}
+
+.preview-image-limit{
+ max-width: 100%;
+ max-height: 100px;
+ object-fit: cover;
+ border-radius: 4px;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+ display: block;
+}
+</style>
diff --git a/manager/src/views/kitchen/goods.vue b/manager/src/views/kitchen/goods.vue
new file mode 100644
index 0000000..03de387
--- /dev/null
+++ b/manager/src/views/kitchen/goods.vue
@@ -0,0 +1,1081 @@
+<template>
+ <div>
+ <Card>
+ <Form
+ ref="searchForm"
+ @keydown.enter.native="handleSearch"
+ :model="searchForm"
+ inline
+ :label-width="70"
+ class="search-form"
+ >
+ <Form-item label="濂楅鍚嶇О" prop="comboName">
+ <Input
+ type="text"
+ v-model="searchForm.comboName"
+ clearable
+ @on-clear="handleSearch"
+ @on-change="handleSearch"
+ style="width: 160px"
+ />
+ </Form-item>
+ <Form-item label="鍒嗙被" prop="tagId">
+ <Select
+ v-model="searchForm.tagId"
+ placeholder="璇烽�夋嫨鍒嗙被"
+ clearable
+ style="width: 160px"
+ filterable
+ >
+ <Option
+ v-for="tag in tagList"
+ :key="tag.id"
+ :label="tag.tagName"
+ :value="tag.id"
+ >
+ {{ tag.tagName }}
+ </Option>
+ </Select>
+ </Form-item>
+ <Form-item label="鍚敤鐘舵��" prop="status">
+ <Select
+ v-model="searchForm.status"
+ placeholder="鍏ㄩ儴鐘舵��"
+ clearable
+ style="width: 160px"
+ >
+ <Option value="ENABLE">鍚敤</Option>
+ <Option value="DISABLE">绂佺敤</Option>
+ </Select>
+ </Form-item>
+ <Button
+ @click="handleSearch"
+ type="primary"
+ icon="ios-search"
+ class="search-btn"
+ >鎼滅储
+ </Button
+ >
+ </Form>
+
+ <Row class="operation padding-row">
+ <Button @click="openAdd" type="info">娣诲姞</Button>
+ <Button @click="delBatch" type="error">鎵归噺鍒犻櫎</Button>
+ </Row>
+
+ <Modal
+ v-model="modelShow"
+ :title="modelTitle"
+ width="800"
+ >
+ <Form ref="form" :model="form" :label-width="70" :rules="rules">
+ <Row :gutter="24">
+ <Col span="12">
+ <FormItem label="濂楅鍚嶅瓧" prop="comboName">
+ <Input v-model="form.comboName" autocomplete="off"/>
+ </FormItem>
+ </Col>
+ <Col span="12">
+ <FormItem label="澶囨敞" prop="remark">
+ <Input v-model="form.remark" autocomplete="off"/>
+ </FormItem>
+ </Col>
+ </Row>
+ <Row :gutter="24">
+ <Col span="12">
+ <FormItem label="浜烘暟" prop="num">
+ <Input v-model="form.num" autocomplete="off"/>
+ </FormItem>
+ </Col>
+ <Col span="12">
+ <FormItem label="濂楅灏侀潰" prop="coverImg">
+ <Upload
+ v-if="!coverTempUrl"
+ :before-upload="(file) => handleBeforeUpload(file, 'cover')"
+ :format="['jpg','jpeg','png','gif']"
+ :max-size="20480"
+ action=""
+ accept="image/*"
+ >
+ <Button icon="ios-cloud-upload-outline">涓婁紶灏侀潰鍥剧墖</Button>
+ </Upload>
+ <div v-else class="upload-file-info">
+ <img :src="coverTempUrl" alt="灏侀潰鍥剧墖" class="preview-image-limit">
+ <Button type="text" @click="handleRemove('cover')">鍒犻櫎</Button>
+ </div>
+ </FormItem>
+ </Col>
+ </Row>
+ <Row :gutter="24">
+ <Col span="12">
+ <FormItem label="鍘熶环" prop="orginPrice">
+ <Input v-model="form.orginPrice" autocomplete="off"/>
+ </FormItem>
+ </Col>
+ <Col span="12">
+ <FormItem label="绉佸帹鍒嗙被" prop="tagId">
+ <Select
+ v-model="form.tagId"
+ placeholder="璇烽�夋嫨鍒嗙被"
+ clearable
+ style="width: 100%"
+ filterable
+ >
+ <Option
+ v-for="tag in tagList"
+ :key="tag.id"
+ :label="tag.tagName"
+ :value="tag.id"
+ >
+ {{ tag.tagName }}
+ </Option>
+ </Select>
+ </FormItem>
+ </Col>
+ </Row>
+ <Row :gutter="24">
+ <Col span="12">
+ <FormItem label="鍚敤鐘舵��" prop="status">
+ <Select v-model="form.status" placeholder="璇烽�夋嫨鐘舵��">
+ <Option value="ENABLE">鍚敤</Option>
+ <Option value="DISABLE">绂佺敤</Option>
+ </Select>
+ </FormItem>
+ </Col>
+ <Col span="12">
+ <FormItem label="鎺掑簭" prop="sort">
+ <Input v-model="form.sort" autocomplete="off"/>
+ </FormItem>
+ </Col>
+ </Row>
+ <Row :gutter="24">
+ <Col span="24">
+ <FormItem label="宸查�夊晢鍝�" :label-width="70">
+ <div style="height: 100px;overflow: auto;" v-if="form.goods">
+ <div style="display: flex;
+ align-items: center;justify-content: flex-start;border: 1px solid gray;margin-top: 10px;
+ padding: 10px;border-radius: 20px">
+ <div>
+ <img :src="getThumbnailUrl(form.goods.thumbnail)"
+ style="width: 80px;height: 80px">
+ </div>
+ <div style="display: flex;flex-direction: column;margin-left: 20px">
+ <div style="font-size: 1.5em;font-weight: bold">{{ form.goods.goodsName }}</div>
+ <div style="color: #ff6f6f">
+ 锟{ form.goods.price }}
+ </div>
+ </div>
+ <div style="margin-left: 10px">
+ <Button type="error" size="small" @click="removeGoods">绉婚櫎</Button>
+ </div>
+ </div>
+ </div>
+ <div v-else style="color: #999; padding: 10px;">
+ 鏆傛棤宸查�夊晢鍝�
+ </div>
+ </FormItem>
+ </Col>
+ </Row>
+ <Row :gutter="24">
+ <Col span="24">
+ <FormItem label="缁戝畾鍟嗗搧" :label-width="70">
+ <Input v-model="searchGoodsForm.keyword" style="width:200px" @on-change="searchGoodsList"></Input>
+ <div style="height: 300px;overflow: auto;">
+ <div v-for="item in goodsData" :key="item.id" style="display: flex;
+ align-items: center;justify-content: flex-start;border: 1px solid gray;margin-top: 10px;
+ padding: 10px;border-radius: 20px" @click="chooseGoods(item.id)">
+ <div>
+ <img :src="getThumbnailUrl(item.thumbnail)" style="width: 80px;height: 80px">
+ </div>
+ <div style="display: flex;flex-direction: column;margin-left: 20px">
+ <div style="font-size: 1.5em;font-weight: bold">{{ item.goodsName }}</div>
+ <div style="color: #ff6f6f">
+ 锟{ item.price }}
+ </div>
+ </div>
+ </div>
+ </div>
+ <Page
+ :current="searchGoodsForm.pageNumber"
+ :total="goodsTotal"
+ :page-size="searchGoodsForm.pageSize"
+ @on-change="goodsChangePage"
+ @on-page-size-change="goodsChangePageSize"
+ :page-size-opts="[10, 20, 50]"
+ size="small"
+ show-total
+ ></Page>
+ </FormItem>
+ </Col>
+ </Row>
+ </Form>
+ <div slot="footer">
+ <Button type="text" @click="modelClose">鍙栨秷</Button>
+ <Button type="primary" :loading="submitLoading" @click="saveOrUpdate">鎻愪氦</Button>
+ </div>
+ </Modal>
+
+ <Table
+ :loading="loading"
+ border
+ :columns="columns"
+ :data="data"
+ ref="table"
+ sortable="custom"
+ @on-sort-change="changeSort"
+ @on-selection-change="showSelect"
+ >
+ <template slot-scope="{ row, index }" slot="action">
+ <Button type="info" size="small" style="margin-right: 5px" @click="openEdit(row)">缂栬緫</Button>
+ <Button
+ v-if="row.status === 'DISABLE'"
+ type="success"
+ size="small"
+ style="margin-right: 5px"
+ @click="enableGoods(row)"
+ >鍚敤</Button>
+ <Button
+ v-if="row.status === 'ENABLE'"
+ type="warning"
+ size="small"
+ style="margin-right: 5px"
+ @click="disableGoods(row)"
+ >绂佺敤</Button>
+ <Button type="error" size="small" @click="delById(row)">鍒犻櫎</Button>
+ </template>
+ </Table>
+
+ <Row type="flex" justify="end" class="mt_10">
+ <Page
+ :current="searchForm.pageNumber"
+ :total="total"
+ :page-size="searchForm.pageSize"
+ @on-change="changePage"
+ @on-page-size-change="changePageSize"
+ :page-size-opts="[10, 20, 50]"
+ size="small"
+ show-total
+ show-elevator
+ show-sizer
+ ></Page>
+ </Row>
+ </Card>
+ </div>
+</template>
+
+<script>
+import JsonExcel from "vue-json-excel";
+import {deleteVideoTagById, getVideoTags, editVideoTag, addVideoTag, deleteVideoTagByIds} from "@/api/videoTag";
+import {addKitchenType, deleteBatch, delKitchenType, editKitchenType, getKitchenGoodsPage, addKitchenGoods, editKitchenGoods, delKitchenGoods, deleteGoodsBatch, getKitchenTagList, editKitchenGoodsStaus} from "@/api/kitchen";
+import {videoGoodsEsPage, recommend} from "@/api/videoTag";
+import {getSts} from "@/api/file";
+import {uploadFileByLmk} from "@/api/common";
+
+export default {
+ name: "KitchenCustomize",
+ components: {
+ "download-excel": JsonExcel,
+ uploadPicInput: () => import('@/components/lili/upload-pic-input.vue'),
+ },
+ data() {
+ return {
+ // 淇濆瓨鍔犺浇
+ submitLoading: false,
+ // 鏂板淇敼琛ㄥ崟
+ form: {
+ id: '',
+ goodsId: '', // 鍟嗗搧id - 閫夋嫨鍟嗗搧鍚庤嚜鍔ㄥ～鍏�
+ skuId: '', // skuId - 閫夋嫨鍟嗗搧鍚庤嚜鍔ㄥ～鍏�
+ comboName: '', // 濂楅鍚嶅瓧
+ remark: '', // 澶囨敞
+ num: '', // 浜烘暟
+ coverImg: '', // 灏侀潰鍥剧墖
+ orginPrice: '', // 鍘熶环
+ tagId: '', // 鏍囩id
+ status: '', // 鍚敤鐘舵��
+ sort: '', // 鎺掑簭
+ goods: null, // 缁戝畾鍟嗗搧
+ },
+ rules: {
+ comboName: [
+ {
+ required: true, message: "濂楅鍚嶅瓧涓嶈兘涓虹┖", trigger: "blur",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '') {
+ callback(new Error('濂楅鍚嶅瓧涓嶈兘涓虹┖'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ remark: [
+ {
+ required: true, message: "澶囨敞涓嶈兘涓虹┖", trigger: "blur",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '') {
+ callback(new Error('澶囨敞涓嶈兘涓虹┖'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ num: [
+ {
+ required: true, message: "浜烘暟涓嶈兘涓虹┖", trigger: "blur",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '') {
+ callback(new Error('浜烘暟涓嶈兘涓虹┖'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ coverImg: [
+ {
+ required: true, message: "灏侀潰鍥剧墖涓嶈兘涓虹┖", trigger: "change",
+ validator: (rule, value, callback) => {
+ // 鍙湪鏂板鏃堕獙璇侊紝缂栬緫鏃跺鏋滃凡鏈夊浘鐗囧垯涓嶉渶瑕佷笂浼犳柊鍥剧墖
+ if (!this.form.id && !value && !this.coverFile) {
+ callback(new Error('璇蜂笂浼犲皝闈㈠浘鐗�'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ orginPrice: [
+ {
+ required: true, message: "鍘熶环蹇呴』鏄暟瀛�", trigger: "blur",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '') {
+ callback(new Error('鍘熶环蹇呴』鏄暟瀛�'));
+ } else {
+ // 妫�鏌ユ槸鍚︿负鏁板瓧
+ const numValue = Number(value);
+ if (isNaN(numValue)) {
+ callback(new Error('鍘熶环蹇呴』鏄暟瀛�'));
+ } else if (numValue < 0.01 || numValue > 9999999.99) {
+ callback(new Error('鍘熶环蹇呴』鍦�0.01鍒�9999999.99涔嬮棿'));
+ } else {
+ callback();
+ }
+ }
+ }
+ }
+ ],
+ tagId: [
+ {
+ required: true, message: "鏍囩id涓嶈兘涓虹┖", trigger: "change",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '') {
+ callback(new Error('鏍囩id涓嶈兘涓虹┖'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ status: [
+ {
+ required: true, message: "鍚敤鐘舵�佷笉鑳戒负绌�", trigger: "change",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '') {
+ callback(new Error('鍚敤鐘舵�佷笉鑳戒负绌�'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ sort: [
+ {
+ required: true, message: "鎺掑簭涓嶈兘涓虹┖", trigger: "blur",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '') {
+ callback(new Error('鎺掑簭涓嶈兘涓虹┖'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ },
+ modelShow: false, // 寮圭獥鏄鹃殣
+ modelTitle: '', // 寮圭獥title
+ // 琛ㄦ牸鐨勮〃澶翠互鍙婂唴瀹�
+ fields: {
+ 鍟嗗搧ID: "goodsId",
+ 濂楅鍚嶅瓧: "comboName",
+ 浜烘暟: "num",
+ 鍘熶环: "orginPrice",
+ 鍚敤鐘舵��: "status",
+ 鎺掑簭: "sort",
+ 鎿嶄綔: "action"
+ },
+ loading: true, // 琛ㄥ崟鍔犺浇鐘舵��
+ searchForm: {
+ // 鎼滅储妗嗗垵濮嬪寲瀵硅薄
+ pageNumber: 1, // 褰撳墠椤垫暟
+ pageSize: 10, // 椤甸潰澶у皬
+ comboName: '', // 濂楅鍚嶇О
+ tagId: '', // 鏍囩ID
+ status: '', // 鍚敤鐘舵��
+ },
+ selectDate: null,
+ tagList: [], // 鏍囩鍒楄〃
+ columns: [
+ {
+ type: 'selection',
+ width: 60,
+ align: 'center'
+ },
+ {
+ title: "鍟嗗搧鍚嶇О",
+ key: "goodsName",
+ minWidth: 150,
+ tooltip: true,
+ },
+ {
+ title: "鍟嗗搧鍥剧墖",
+ key: "thumbnail",
+ width: 120,
+ align: 'center',
+ render: (h, params) => {
+ const thumbnail = params.row.thumbnail;
+ if (thumbnail) {
+ // 濡傛灉鏄暟瀛楃被鍨嬶紝鎷兼帴endpoint
+ let imgUrl = thumbnail;
+ if (typeof thumbnail === 'number') {
+ imgUrl = this.endpoint + '/' + thumbnail;
+ } else if (typeof thumbnail === 'string' && !thumbnail.startsWith('http')) {
+ // 濡傛灉鏄瓧绗︿覆浣嗕笉鍖呭惈http锛屽彲鑳芥槸ID锛屾嫾鎺ndpoint
+ imgUrl = this.endpoint + '/' + thumbnail;
+ }
+ return h('img', {
+ attrs: {
+ src: imgUrl,
+ alt: '鍟嗗搧鍥剧墖',
+ style: 'width: 50px; height: 50px; object-fit: cover; border-radius: 4px'
+ },
+ style: {
+ width: '50px',
+ height: '50px',
+ objectFit: 'cover',
+ borderRadius: '4px',
+ cursor: 'pointer'
+ },
+ on: {
+ click: () => {
+ // 鐐瑰嚮鍥剧墖鍙互棰勮澶у浘
+ window.open(imgUrl, '_blank');
+ }
+ }
+ });
+ } else {
+ return h('span', '鏆傛棤鍥剧墖');
+ }
+ }
+ },
+ {
+ title: "濂楅鍚嶅瓧",
+ key: "comboName",
+ minWidth: 70,
+ tooltip: true,
+ },
+ {
+ title: "濂楅灏侀潰",
+ key: "coverImg",
+ width: 120,
+ align: 'center',
+ render: (h, params) => {
+ const coverImg = params.row.coverImg;
+ if (coverImg) {
+ // 濡傛灉鏄暟瀛楃被鍨嬶紝鎷兼帴endpoint
+ let imgUrl = coverImg;
+ if (typeof coverImg === 'number') {
+ imgUrl = this.endpoint + '/' + coverImg;
+ } else if (typeof coverImg === 'string' && !coverImg.startsWith('http')) {
+ // 濡傛灉鏄瓧绗︿覆浣嗕笉鍖呭惈http锛屽彲鑳芥槸ID锛屾嫾鎺ndpoint
+ imgUrl = this.endpoint + '/' + coverImg;
+ }
+ return h('img', {
+ attrs: {
+ src: imgUrl,
+ alt: '濂楅灏侀潰',
+ style: 'width: 50px; height: 50px; object-fit: cover; border-radius: 4px'
+ },
+ style: {
+ width: '50px',
+ height: '50px',
+ objectFit: 'cover',
+ borderRadius: '4px',
+ cursor: 'pointer'
+ },
+ on: {
+ click: () => {
+ // 鐐瑰嚮鍥剧墖鍙互棰勮澶у浘
+ window.open(imgUrl, '_blank');
+ }
+ }
+ });
+ } else {
+ return h('span', '鏆傛棤鍥剧墖');
+ }
+ }
+ },
+
+ {
+ title: "浜烘暟",
+ key: "num",
+ width: 100
+ },
+ {
+ title: "鍘熶环",
+ key: "orginPrice",
+ width: 100
+ },
+ {
+ title: "鐜颁环",
+ key: "price",
+ width: 100
+ },
+ {
+ title: "鍚敤鐘舵��",
+ key: "status",
+ width: 100,
+ align: 'center',
+ render: (h, params) => {
+ const status = params.row.status;
+ const color = status === 'ENABLE' ? 'success' : status === 'DISABLE' ? 'default' : 'warning';
+ const text = status === 'ENABLE' ? '鍚敤' : status === 'DISABLE' ? '绂佺敤' : '鏈煡';
+ return h('Tag', {
+ props: {
+ color: color
+ }
+ }, text);
+ }
+ },
+ {
+ title: "鎺掑簭",
+ key: "sort",
+ width: 100
+ },
+ {
+ title: "澶囨敞",
+ key: "remark",
+ width: 100
+ },
+ {
+ title: "鎿嶄綔",
+ key: "action",
+ slot: "action",
+ align: "center",
+ fixed: "right",
+ width: 300,
+ },
+ ],
+ data: [], // 琛ㄥ崟鏁版嵁
+ total: 0, // 琛ㄥ崟鏁版嵁鎬绘暟
+ selectCount: 0, // 宸查�夋暟閲�
+ selectList: [], // 宸查�夋暟鎹垪琛�
+ // 鍟嗗搧閫夋嫨鐩稿叧鏁版嵁
+ goodsData: [], // 鍟嗗搧鍒楄〃
+ goodsTotal: 0, // 鍟嗗搧鎬绘暟
+ endpoint: '', // 鏂囦欢璁块棶绔偣
+ searchGoodsForm: {
+ // 鍟嗗搧鎼滅储妗嗗垵濮嬪寲瀵硅薄
+ pageNumber: 1, // 褰撳墠椤垫暟
+ pageSize: 10, // 椤甸潰澶у皬
+ keyword: '',
+ searchFromSelfStore: false
+ },
+ // 鍥剧墖涓婁紶鐩稿叧
+ coverFile: null,
+ coverTempUrl: null,
+ };
+ },
+ methods: {
+ showSelect(e) {
+ this.selectList = e.map(d => d.id);
+ this.selectCount = e.length;
+ },
+ // 鎺掑簭
+ changeSort(e) {
+ this.searchForm.sort = e.key;
+ this.searchForm.order = e.order;
+ if (e.order == "normal") {
+ this.searchForm.order = "";
+ }
+ this.getDataList();
+ },
+ // 鎵归噺鍒犻櫎
+ delBatch() {
+ if (this.selectCount <= 0) {
+ this.$Message.warning("鎮ㄨ繕鏈�夋嫨瑕佸垹闄ょ殑鏁版嵁");
+ return;
+ }
+ this.$Modal.confirm({
+ title: "纭鍒犻櫎",
+ content: "鎮ㄧ‘璁よ鍒犻櫎鎵�閫夌殑 " + this.selectCount + " 鏉℃暟鎹�?",
+ loading: true,
+ onOk: () => {
+ deleteGoodsBatch(this.selectList).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍒犻櫎鎴愬姛");
+ this.selectList = [];
+ this.selectCount = 0;
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // id鍒犻櫎
+ delById(row) {
+ this.$Modal.confirm({
+ title: "纭鍒犻櫎",
+ content: "鎮ㄧ‘璁よ鍒犻櫎锛� " + row.comboName + " ?",
+ loading: true,
+ onOk: () => {
+ delKitchenGoods(row.id).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍒犻櫎鎴愬姛");
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // 鎵撳紑鏂板
+ openAdd() {
+ this.modelTitle = "鏂板鏍囩"
+ this.modelShow = true
+ this.form = {
+ id: '',
+ goodsId: '', // 鍟嗗搧id
+ skuId: '', // skuId
+ comboName: '', // 濂楅鍚嶅瓧
+ remark: '', // 澶囨敞
+ num: '', // 浜烘暟
+ coverImg: '', // 灏侀潰鍥剧墖
+ orginPrice: '', // 鍘熶环
+ tagId: '', // 鏍囩id
+ status: '', // 鍚敤鐘舵��
+ sort: '', // 鎺掑簭
+ goods: null, // 缁戝畾鍟嗗搧
+ }
+ // 娓呯┖鍥剧墖涓婁紶鐘舵��
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ this.searchGoodsList(); // 鍔犺浇鍟嗗搧鍒楄〃
+ },
+ // 鎵撳紑淇敼
+ openEdit(row) {
+ this.modelTitle = "淇敼鏍囩"
+ // 鍒濆鍖栬〃鍗�
+ this.form = {
+ id: '',
+ goodsId: '',
+ skuId: '',
+ comboName: '',
+ remark: '',
+ num: '',
+ coverImg: '',
+ orginPrice: '',
+ tagId: '',
+ status: '',
+ sort: '',
+ goods: null,
+ };
+ // 浣跨敤Object.assign鍚堝苟鏁版嵁锛屼繚鐣檙ow涓殑goods淇℃伅
+ this.form = Object.assign(this.form, row);
+ this.modelShow = true
+ // 濡傛灉鏈夊皝闈㈠浘鐗嘦RL锛屽垯璁剧疆棰勮
+ if (row.coverImg) {
+ this.coverTempUrl = row.coverImg;
+ }
+ // 濡傛灉row涓寘鍚晢鍝佷俊鎭紝鐩存帴浣跨敤
+ if (this.form.goodsId && this.form.skuId) {
+ // 鐩存帴浣跨敤row涓殑鍟嗗搧淇℃伅鍒涘缓goods瀵硅薄鐢ㄤ簬鏄剧ず
+ this.form.goods = {
+ goodsId: this.form.goodsId,
+ goodsSkuId: this.form.skuId,
+ goodsName: this.form.goodsName || this.form.comboName || '',
+ thumbnail: this.form.thumbnail || this.form.goodsThumbnail || this.form.coverImg || '',
+ price: this.form.price || this.form.orginPrice || '',
+ };
+ // 濡傛灉灏侀潰鍥剧墖涓虹┖锛屼笖鍟嗗搧鏈夌缉鐣ュ浘锛屽垯浣跨敤鍟嗗搧缂╃暐鍥�
+ if (!this.form.coverImg && this.form.goods.thumbnail) {
+ // 濡傛灉thumbnail鏄暟瀛桰D锛岄渶瑕佹嫾鎺ユ垚URL
+ if (typeof this.form.goods.thumbnail === 'number') {
+ this.form.coverImg = this.endpoint + '/' + this.form.goods.thumbnail;
+ } else {
+ this.form.coverImg = this.form.goods.thumbnail;
+ }
+ }
+ }
+ // 鍔犺浇鍟嗗搧鍒楄〃
+ this.searchGoodsList();
+ console.log(this.form)
+ },
+ // 鏂板鎴栦慨鏀�
+ async saveOrUpdate() {
+ this.$refs.form.validate(valid => {
+ try {
+ if (valid) {
+ this.submitLoading = true
+ // 鍏堜笂浼犲皝闈㈠浘鐗囷紝浣嗕笉闃诲鍚庣画鎿嶄綔
+ this.uploadFileByLmk().then(() => {
+ // 澶勭悊鍟嗗搧缁戝畾鏁版嵁
+ let formData = { ...this.form };
+ // 濡傛灉娌℃湁閫夋嫨鍟嗗搧锛屽垯璁剧疆涓簄ull
+ if (!formData.goods) {
+ delete formData.goods;
+ }
+ if (this.form.id) {
+ // 淇敼
+ editKitchenGoods(formData).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("淇敼鎴愬姛");
+ this.modelClose()
+ this.getDataList()
+ }
+ })
+ } else {
+ // 鏂板
+ addKitchenGoods(formData).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("娣诲姞鎴愬姛");
+ this.modelClose()
+ this.getDataList()
+ }
+ })
+ }
+ }).catch(() => {
+ // 鍗充娇涓婁紶澶辫触锛屼篃瑕佺户缁墽琛屼繚瀛橀�昏緫
+ let formData = { ...this.form };
+ // 濡傛灉娌℃湁閫夋嫨鍟嗗搧锛屽垯璁剧疆涓簄ull
+ if (!formData.goods) {
+ delete formData.goods;
+ }
+ if (this.form.id) {
+ // 淇敼
+ editKitchenGoods(formData).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("淇敼鎴愬姛");
+ this.modelClose()
+ this.getDataList()
+ }
+ })
+ } else {
+ // 鏂板
+ addKitchenGoods(formData).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("娣诲姞鎴愬姛");
+ this.modelClose()
+ this.getDataList()
+ }
+ })
+ }
+ });
+ }
+ } finally {
+ this.submitLoading = false
+ }
+ });
+ },
+ // 鍏抽棴寮圭獥
+ modelClose() {
+ this.submitLoading = false
+ this.modelShow = false
+ // 閲嶇疆鍥剧墖涓婁紶鐘舵��
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ this.form.coverImg = '';
+ },
+ // 鍒濆鍖栨暟鎹�
+ init() {
+ this.getDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤电爜
+ changePage(v) {
+ this.searchForm.pageNumber = v;
+ this.getDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤垫暟
+ changePageSize(v) {
+ this.searchForm.pageNumber = 1;
+ this.searchForm.pageSize = v;
+ this.getDataList();
+ },
+ // 鎼滅储
+ handleSearch() {
+ this.searchForm.pageNumber = 1;
+ this.searchForm.pageSize = 10;
+ this.getDataList();
+ },
+ // 璧锋鏃堕棿浠庢柊璧嬪��
+ selectDateRange(v) {
+ if (v) {
+ this.searchForm.startDate = v[0];
+ this.searchForm.endDate = v[1];
+ }
+ },
+ // 鍟嗗搧閫夋嫨鐩稿叧鏂规硶
+ chooseGoods(id) {
+ const goods = this.goodsData.find(item => {
+ return item.id === id;
+ })
+ if (goods) {
+ // 鍙�夋嫨涓�涓晢鍝侊紝鐩存帴鏇挎崲褰撳墠鍟嗗搧
+ this.form.goods = {
+ goodsId: goods.goodsId,
+ goodsSkuId: goods.id,
+ goodsName: goods.goodsName,
+ thumbnail: goods.thumbnail,
+ price: goods.price,
+ }
+ // 鑷姩濉厖鍟嗗搧ID鍜孲KU ID
+ this.form.goodsId = goods.goodsId;
+ this.form.skuId = goods.id;
+ // 濡傛灉灏侀潰鍥剧墖涓虹┖锛岃嚜鍔ㄤ娇鐢ㄥ晢鍝佺缉鐣ュ浘
+ if (!this.form.coverImg) {
+ // 濡傛灉thumbnail鏄暟瀛桰D锛岄渶瑕佹嫾鎺ユ垚URL
+ if (typeof goods.thumbnail === 'number') {
+ this.form.coverImg = this.endpoint + '/' + goods.thumbnail;
+ } else {
+ this.form.coverImg = goods.thumbnail;
+ }
+ }
+ }
+ },
+ removeGoods() {
+ this.form.goods = null;
+ this.form.goodsId = '';
+ this.form.skuId = '';
+ },
+ // 鑾峰彇缂╃暐鍥綰RL
+ getThumbnailUrl(thumbnail) {
+ if (!thumbnail) {
+ return '';
+ }
+ // 濡傛灉鏄暟瀛楃被鍨嬶紝鎷兼帴endpoint
+ if (typeof thumbnail === 'number') {
+ return this.endpoint + '/' + thumbnail;
+ }
+ // 濡傛灉鏄瓧绗︿覆涓斿寘鍚玥ttp锛岀洿鎺ヨ繑鍥�
+ if (typeof thumbnail === 'string') {
+ if (thumbnail.startsWith('http')) {
+ return thumbnail;
+ } else {
+ // 濡傛灉鏄瓧绗︿覆浣嗕笉鍖呭惈http锛屽彲鑳芥槸ID锛屾嫾鎺ndpoint
+ return this.endpoint + '/' + thumbnail;
+ }
+ }
+ return thumbnail;
+ },
+ searchGoodsList() {
+ this.searchGoodsForm.pageNumber = 1;
+ return this.getGoodsDataList();
+ },
+ // 鑾峰彇鍟嗗搧鍒楄〃鏁版嵁
+ getGoodsDataList() {
+ let search = this.searchGoodsForm;
+ if (search.pageNumber > 0) {
+ search.pageNumber = search.pageNumber - 1;
+ }
+ return new Promise((resolve, reject) => {
+ videoGoodsEsPage(search).then((res) => {
+ if (res.code == 200) {
+ this.goodsData = res.data;
+ getSts().then(res => {
+ this.endpoint = res.data.endpoint
+ })
+ this.goodsTotal = res.total;
+ resolve(res);
+ } else {
+ reject(res);
+ }
+ }).catch(error => {
+ reject(error);
+ });
+ });
+ },
+ // 鍒嗛〉 鏀瑰彉椤电爜
+ goodsChangePage(v) {
+ this.searchGoodsForm.pageNumber = v;
+ this.getGoodsDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤垫暟
+ goodsChangePageSize(v) {
+ this.searchGoodsForm.pageNumber = 1;
+ this.searchGoodsForm.pageSize = v;
+ this.getGoodsDataList();
+ },
+ // 涓婁紶鏂囦欢
+ async uploadFileByLmk() {
+ if (this.coverFile) {
+ this.submitLoading = true;
+ const formData = new FormData();
+ formData.append('file', this.coverFile);
+
+ await uploadFileByLmk(formData).then(res => {
+ this.submitLoading = false;
+ if (res.code === 200) {
+ this.form.coverImg = res.data.fileKey;
+ } else {
+ this.$Message.error(res.msg || '涓婁紶澶辫触');
+ }
+ }).catch(() => {
+ this.submitLoading = false;
+ this.$Message.error('涓婁紶澶辫触');
+ });
+ }
+ },
+ // 澶勭悊鍥剧墖涓婁紶鍓�
+ handleBeforeUpload(file, type) {
+ if ("cover" === type) {
+ this.coverFile = file;
+ this.coverTempUrl = URL.createObjectURL(file);
+ return false;
+ }
+ },
+ // 鍒犻櫎鍥剧墖
+ handleRemove(type) {
+ if ('cover' === type) {
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ this.form.coverImg = '';
+ }
+ },
+ // 鍚敤鍘ㄦ埧鍟嗗搧
+ enableGoods(row) {
+ this.$Modal.confirm({
+ title: "纭鍚敤",
+ content: "鎮ㄧ‘璁よ鍚敤鍘ㄦ埧鍟嗗搧锛� " + row.comboName + " ?",
+ loading: true,
+ onOk: () => {
+ const params = {
+ id: row.id,
+ status: 'ENABLE'
+ };
+ editKitchenGoodsStaus(params.id, params.status).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍚敤鎴愬姛");
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // 绂佺敤鍘ㄦ埧鍟嗗搧
+ disableGoods(row) {
+ this.$Modal.confirm({
+ title: "纭绂佺敤",
+ content: "鎮ㄧ‘璁よ绂佺敤鍘ㄦ埧鍟嗗搧锛� " + row.comboName + " ?",
+ loading: true,
+ onOk: () => {
+ const params = {
+ id: row.id,
+ status: 'DISABLE'
+ };
+ editKitchenGoodsStaus(params.id, params.status).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("绂佺敤鎴愬姛");
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // 鑾峰彇鍒楄〃鏁版嵁
+ getDataList() {
+ this.loading = true;
+ getKitchenGoodsPage(this.searchForm).then((res) => {
+ console.log(res)
+ this.loading = false;
+ if (res.code == 200) {
+ this.data = res.data;
+ this.total = res.total;
+ }
+ });
+ this.total = this.data.length;
+ this.loading = false;
+ },
+ // 鑾峰彇鏍囩鍒楄〃
+ getTagList() {
+ getKitchenTagList().then(res => {
+ if (res.code === 200) {
+ this.tagList = res.data;
+ }
+ });
+ },
+ },
+ mounted() {
+ this.init();
+ // 鍒濆鍖栧晢鍝佸垪琛�
+ this.getGoodsDataList();
+ // 鍒濆鍖栨爣绛惧垪琛�
+ this.getTagList();
+ },
+};
+</script>
+<style lang="scss" scoped>
+.export {
+ margin: 10px 20px 10px 0;
+}
+
+.export-excel-wrapper {
+ display: inline;
+}
+
+.order-tab {
+ width: 950px;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ background-color: #f0f0f0;
+ padding: 0 10px;
+ margin-bottom: 10px;
+
+ div {
+ text-align: center;
+ padding: 4px 12px;
+ border-radius: 4px;
+ cursor: pointer;
+ }
+
+ .current {
+ background-color: #ffffff;
+ }
+}
+
+.upload-file-info {
+ display: flex;
+ align-items: center;
+ margin-top: 10px;
+}
+
+.upload-file-info img {
+ max-width: 200px;
+ max-height: 200px;
+ margin-right: 10px;
+ border-radius: 4px;
+}
+
+.preview-image-limit{
+ max-width: 100%;
+ max-height: 200px;
+ object-fit: contain;
+ border-radius: 4px;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+ display: block;
+}</style>
diff --git a/manager/src/views/kitchen/img.vue b/manager/src/views/kitchen/img.vue
new file mode 100644
index 0000000..ea19b42
--- /dev/null
+++ b/manager/src/views/kitchen/img.vue
@@ -0,0 +1,451 @@
+<template>
+ <div>
+ <Card>
+<!-- <Form-->
+<!-- ref="searchForm"-->
+<!-- @keydown.enter.native="handleSearch"-->
+<!-- :model="searchForm"-->
+<!-- inline-->
+<!-- :label-width="70"-->
+<!-- class="search-form"-->
+<!-- >-->
+<!-- <Button-->
+<!-- @click="handleSearch"-->
+<!-- type="primary"-->
+<!-- icon="ios-search"-->
+<!-- class="search-btn"-->
+<!-- >鎼滅储</Button-->
+<!-- >-->
+<!-- </Form>-->
+
+ <Row class="operation padding-row">
+ <Button @click="openAdd" type="info">娣诲姞鍥剧墖</Button>
+ <!-- <Button @click="delBatch" type="error">鎵归噺鍒犻櫎</Button> -->
+ </Row>
+
+ <Modal
+ v-model="modelShow"
+ :title="modelTitle"
+ >
+ <Form ref="form" :model="form" :label-width="100" :rules="rules">
+ <Row :gutter="24">
+ <Col span="24">
+ <FormItem label="灏侀潰鍥剧墖" prop="coverUrl">
+ <Upload
+ v-if="!coverTempUrl"
+ :before-upload="(file) => handleBeforeUpload(file, 'cover')"
+ :format="['jpg','jpeg','png','gif']"
+ :max-size="20480"
+ action=""
+ accept="image/*"
+ >
+ <Button icon="ios-cloud-upload-outline">涓婁紶灏侀潰鍥剧墖</Button>
+ </Upload>
+ <div v-else class="upload-file-info">
+ <img :src="coverTempUrl" alt="灏侀潰鍥剧墖" class="preview-image-limit">
+ <Button type="text" @click="handleRemove('cover')">鍒犻櫎</Button>
+ </div>
+ </FormItem>
+ </Col>
+ </Row>
+ </Form>
+ <div slot="footer">
+ <Button type="text" @click="modelClose">鍙栨秷</Button>
+ <Button type="primary" :loading="submitLoading" @click="saveOrUpdate">鎻愪氦</Button>
+ </div>
+ </Modal>
+
+ <Table
+ :loading="loading"
+ border
+ :columns="columns"
+ :data="data"
+ ref="table"
+ sortable="custom"
+ @on-sort-change="changeSort"
+ @on-selection-change="showSelect"
+ >
+ <template slot-scope="{ row, index }" slot="action">
+ <Button type="info" size="small" style="margin-right: 5px" @click="openEdit(row)">缂栬緫</Button>
+ <Button type="error" size="small" @click="delById(row)">鍒犻櫎</Button>
+ </template>
+ </Table>
+
+ <Row type="flex" justify="end" class="mt_10">
+ <Page
+ :current="searchForm.pageNumber"
+ :total="total"
+ :page-size="searchForm.pageSize"
+ @on-change="changePage"
+ @on-page-size-change="changePageSize"
+ :page-size-opts="[10, 20, 50]"
+ size="small"
+ show-total
+ show-elevator
+ show-sizer
+ ></Page>
+ </Row>
+ </Card>
+ </div>
+</template>
+
+<script>
+import JsonExcel from "vue-json-excel";
+import {deleteVideoTagById, getVideoTags, editVideoTag, addVideoTag, deleteVideoTagByIds} from "@/api/videoTag";
+import {
+ addKitchenAdImg,
+ deleteAdImgBatch,
+ delKitchenAdImg,
+ editKitchenAdImg,
+ getKitchenAdImgPage
+} from "@/api/kitchen";
+import {uploadFileByLmk} from "@/api/common";
+export default {
+ name: "VideoTagList",
+ components: {
+ "download-excel": JsonExcel,
+ },
+ data() {
+ return {
+ // 淇濆瓨鍔犺浇
+ submitLoading: false,
+ // 鏂板淇敼琛ㄥ崟
+ form: {
+ id: '',
+ coverUrl: '',
+ },
+ rules: {
+ coverUrl: [
+ {
+ required: true,
+ message: '璇蜂笂浼犲皝闈㈠浘鐗�',
+ trigger: 'change',
+ validator: (rule, value, callback) => {
+ // 鍙湪鏂板鏃堕獙璇侊紝缂栬緫鏃跺鏋滃凡鏈夊浘鐗囧垯涓嶉渶瑕佷笂浼犳柊鍥剧墖
+ if (!this.form.id && !value && !this.coverFile) {
+ callback(new Error('璇蜂笂浼犲皝闈㈠浘鐗�'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ },
+ modelShow: false, // 寮圭獥鏄鹃殣
+ modelTitle: '', // 寮圭獥title
+ // 琛ㄦ牸鐨勮〃澶翠互鍙婂唴瀹�
+ fields: {
+ 绫诲瀷: "tagName",
+ 寮曠敤娆℃暟: "useNum",
+ 鎺掑簭: "sort_num",
+ 鎿嶄綔: "action"
+ },
+ loading: true, // 琛ㄥ崟鍔犺浇鐘舵��
+ searchForm: {
+ // 鎼滅储妗嗗垵濮嬪寲瀵硅薄
+ pageNumber: 1, // 褰撳墠椤垫暟
+ pageSize: 10, // 椤甸潰澶у皬
+ },
+ selectDate: null,
+ columns: [
+
+ {
+ title: "鍥剧墖",
+ key: "coverUrl",
+ minWidth: 170,
+ render: (h, params) => {
+ if (params.row.coverUrl) {
+ return h('div', [
+ h('img', {
+ attrs: {
+ src: params.row.coverUrl,
+ alt: '灏侀潰鍥剧墖',
+ },
+ style: {
+ width: '100px',
+ height: '60px',
+ objectFit: 'cover',
+ borderRadius: '4px',
+ },
+ }),
+ ]);
+ } else {
+ return h('span', '鏃犲浘鐗�');
+ }
+ },
+ },
+ {
+ title: "鎿嶄綔",
+ key: "action",
+ slot: "action",
+ align: "center",
+ width: 400,
+ },
+ ],
+ data: [], // 琛ㄥ崟鏁版嵁
+ total: 0, // 琛ㄥ崟鏁版嵁鎬绘暟
+ selectCount: 0, // 宸查�夋暟閲�
+ selectList: [], // 宸查�夋暟鎹垪琛�
+ // 鍥剧墖涓婁紶鐩稿叧
+ coverFile: null,
+ coverTempUrl: null,
+ };
+ },
+ methods: {
+ showSelect(e) {
+ this.selectList = e.map(d => d.id);
+ this.selectCount = e.length;
+ },
+ // 鎺掑簭
+ changeSort(e) {
+ this.searchForm.sort = e.key;
+ this.searchForm.order = e.order;
+ if (e.order == "normal") {
+ this.searchForm.order = "";
+ }
+ this.getDataList();
+ },
+ // 鎵归噺鍒犻櫎
+ delBatch() {
+ if (this.selectCount <= 0) {
+ this.$Message.warning("鎮ㄨ繕鏈�夋嫨瑕佸垹闄ょ殑鍥剧墖");
+ return;
+ }
+ this.$Modal.confirm({
+ title: "纭鍒犻櫎",
+ content: "鎮ㄧ‘璁よ鍒犻櫎鎵�閫夌殑 " + this.selectCount + " 寮犲浘鐗�?",
+ loading: true,
+ onOk: () => {
+ deleteAdImgBatch(this.selectList).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍒犻櫎鎴愬姛");
+ this.selectList = [];
+ this.selectCount = 0;
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // id鍒犻櫎
+ delById(row) {
+ this.$Modal.confirm({
+ title: "纭鍒犻櫎",
+ content: "鎮ㄧ‘璁よ鍒犻櫎鍥剧墖锛�",
+ loading: true,
+ onOk: () => {
+ delKitchenAdImg(row.id).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍒犻櫎鎴愬姛");
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // 鎵撳紑鏂板
+ openAdd() {
+ this.modelTitle = "鏂板鍥剧墖"
+ this.modelShow = true
+ this.form = {}
+ // 娓呯┖鍥剧墖涓婁紶鐘舵��
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ },
+ // 鎵撳紑淇敼
+ openEdit(row) {
+ this.modelTitle = "淇敼鍥剧墖"
+ this.form = {};
+ this.form.id = row.id
+ this.form.coverUrl = row.coverUrl || '';
+ // 濡傛灉鏈夊浘鐗嘦RL锛屽垯鏄剧ず棰勮
+ if (row.coverUrl) {
+ this.coverTempUrl = row.coverUrl;
+ }
+ this.modelShow = true
+ console.log(this.form)
+ },
+ // 涓婁紶鏂囦欢
+ async uploadFileByLmk() {
+ if (this.coverFile) {
+ this.submitLoading = true;
+ const formData = new FormData();
+ formData.append('file', this.coverFile);
+
+ await uploadFileByLmk(formData).then(res => {
+ this.submitLoading = false;
+ if (res.code === 200) {
+ this.form.coverUrl = res.data.fileKey;
+ } else {
+ this.$Message.error(res.msg || '涓婁紶澶辫触');
+ }
+ }).catch(() => {
+ this.submitLoading = false;
+ this.$Message.error('涓婁紶澶辫触');
+ });
+ }
+ },
+
+ // 鏂板鎴栦慨鏀�
+ async saveOrUpdate() {
+ await this.uploadFileByLmk();
+
+ this.$refs.form.validate(valid => {
+ try {
+ if (valid) {
+ this.submitLoading = true;
+ if (this.form.id) {
+ // 淇敼
+ editKitchenAdImg(this.form).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("淇敼鎴愬姛");
+ this.modelClose();
+ this.getDataList();
+ }
+ }).catch(() => {
+ this.submitLoading = false;
+ });
+ } else {
+ // 鏂板
+ addKitchenAdImg(this.form).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("娣诲姞鎴愬姛");
+ this.modelClose();
+ this.getDataList();
+ }
+ }).catch(() => {
+ this.submitLoading = false;
+ });
+ }
+ }
+ } finally {
+ this.submitLoading = false;
+ }
+ });
+ },
+ // 澶勭悊鍥剧墖涓婁紶鍓�
+ handleBeforeUpload(file, type) {
+ if ("cover" === type) {
+ this.coverFile = file;
+ this.coverTempUrl = URL.createObjectURL(file);
+ return false;
+ }
+ },
+
+ // 鍒犻櫎鍥剧墖
+ handleRemove(type) {
+ if ('cover' === type) {
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ this.form.coverUrl = '';
+ }
+ },
+
+ // 鍏抽棴寮圭獥
+ modelClose() {
+ this.submitLoading = false;
+ this.modelShow = false;
+ // 閲嶇疆鍥剧墖涓婁紶鐘舵��
+ this.coverFile = null;
+ this.coverTempUrl = null;
+ this.form.coverUrl = '';
+ },
+ // 鍒濆鍖栨暟鎹�
+ init() {
+ this.getDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤电爜
+ changePage(v) {
+ this.searchForm.pageNumber = v;
+ this.getDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤垫暟
+ changePageSize(v) {
+ this.searchForm.pageNumber = 1;
+ this.searchForm.pageSize = v;
+ this.getDataList();
+ },
+ // 鎼滅储
+ handleSearch() {
+ this.searchForm.pageNumber = 1;
+ this.searchForm.pageSize = 10;
+ this.getDataList();
+ },
+ // 璧锋鏃堕棿浠庢柊璧嬪��
+ selectDateRange(v) {
+ if (v) {
+ this.searchForm.startDate = v[0];
+ this.searchForm.endDate = v[1];
+ }
+ },
+ // 鑾峰彇鍒楄〃鏁版嵁
+ getDataList() {
+ this.loading = true;
+ getKitchenAdImgPage(this.searchForm).then((res) => {
+ console.log(res)
+ this.loading = false;
+ if (res.code == 200) {
+ this.data = res.data;
+ this.total = res.total;
+ }
+ });
+ this.total = this.data.length;
+ this.loading = false;
+ },
+ },
+ mounted() {
+ this.init();
+ },
+};
+</script>
+<style lang="scss" scoped>
+.export {
+ margin: 10px 20px 10px 0;
+}
+.export-excel-wrapper {
+ display: inline;
+}
+.order-tab {
+ width: 950px;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ background-color: #f0f0f0;
+ padding: 0 10px;
+ margin-bottom: 10px;
+ div {
+ text-align: center;
+ padding: 4px 12px;
+ border-radius: 4px;
+ cursor: pointer;
+ }
+ .current {
+ background-color: #ffffff;
+ }
+}
+
+.upload-file-info {
+ display: flex;
+ align-items: center;
+ margin-top: 10px;
+}
+
+.upload-file-info img {
+ max-width: 200px;
+ max-height: 200px;
+ margin-right: 10px;
+ border-radius: 4px;
+}
+
+.preview-image-limit{
+ max-width: 100%;
+ max-height: 200px;
+ object-fit: contain;
+ border-radius: 4px;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+ display: block;
+}
+</style>
diff --git a/manager/src/views/kitchen/tag.vue b/manager/src/views/kitchen/tag.vue
new file mode 100644
index 0000000..053fa1e
--- /dev/null
+++ b/manager/src/views/kitchen/tag.vue
@@ -0,0 +1,464 @@
+<template>
+ <div>
+ <Card>
+ <Form
+ ref="searchForm"
+ @keydown.enter.native="handleSearch"
+ :model="searchForm"
+ inline
+ :label-width="70"
+ class="search-form"
+ >
+ <Form-item label="鍒嗙被鍚嶇О" prop="tagName">
+ <Input
+ type="text"
+ v-model="searchForm.tagName"
+ clearable
+ @on-clear="handleSearch"
+ @on-change="handleSearch"
+ style="width: 160px"
+ />
+ </Form-item>
+ <Form-item label="鏄惁鍚敤" prop="enable">
+ <Select
+ v-model="searchForm.enable"
+ placeholder="鍏ㄩ儴鐘舵��"
+ clearable
+ style="width: 160px"
+ >
+ <Option value="ENABLE">鍚敤</Option>
+ <Option value="DISABLE">绂佺敤</Option>
+ </Select>
+ </Form-item>
+ <Button
+ @click="handleSearch"
+ type="primary"
+ icon="ios-search"
+ class="search-btn"
+ >鎼滅储</Button
+ >
+ </Form>
+
+ <Row class="operation padding-row">
+ <Button @click="openAdd" type="info">娣诲姞</Button>
+ <Button @click="delBatch" type="error">鎵归噺鍒犻櫎</Button>
+ </Row>
+
+ <Modal
+ v-model="modelShow"
+ :title="modelTitle"
+ >
+ <Form ref="form" :model="form" :label-width="70" :rules="rules">
+ <Row :gutter="24">
+ <Col span="12">
+ <FormItem label="鍒嗙被鍚嶇О" prop="tagName">
+ <Input v-model="form.tagName" autocomplete="off"/>
+ </FormItem>
+ </Col>
+ <Col span="12">
+ <FormItem label="鎺掑簭" prop="sort">
+ <Input-number :min="0" :max="999" v-model="form.sort" autocomplete="off"/>
+ </FormItem>
+ </Col>
+ <Col span="12">
+ <FormItem label="鏄惁鍚敤" prop="enable">
+ <Select v-model="form.enable" placeholder="璇烽�夋嫨鐘舵��">
+ <Option value="ENABLE">鍚敤</Option>
+ <Option value="DISABLE">绂佺敤</Option>
+ </Select>
+ </FormItem>
+ </Col>
+ </Row>
+ </Form>
+ <div slot="footer">
+ <Button type="text" @click="modelClose">鍙栨秷</Button>
+ <Button type="primary" :loading="submitLoading" @click="saveOrUpdate">鎻愪氦</Button>
+ </div>
+ </Modal>
+
+ <Table
+ :loading="loading"
+ border
+ :columns="columns"
+ :data="data"
+ ref="table"
+ sortable="custom"
+ @on-sort-change="changeSort"
+ @on-selection-change="showSelect"
+ >
+ <template slot-scope="{ row, index }" slot="action">
+ <Button type="info" size="small" style="margin-right: 5px" @click="openEdit(row)">缂栬緫</Button>
+ <Button
+ v-if="row.enable === 'DISABLE'"
+ type="success"
+ size="small"
+ style="margin-right: 5px"
+ @click="enableTag(row)"
+ >鍚敤</Button>
+ <Button
+ v-if="row.enable === 'ENABLE'"
+ type="warning"
+ size="small"
+ style="margin-right: 5px"
+ @click="disableTag(row)"
+ >绂佺敤</Button>
+ <Button type="error" size="small" @click="delById(row)">鍒犻櫎</Button>
+ </template>
+ </Table>
+
+ <Row type="flex" justify="end" class="mt_10">
+ <Page
+ :current="searchForm.pageNumber"
+ :total="total"
+ :page-size="searchForm.pageSize"
+ @on-change="changePage"
+ @on-page-size-change="changePageSize"
+ :page-size-opts="[10, 20, 50]"
+ size="small"
+ show-total
+ show-elevator
+ show-sizer
+ ></Page>
+ </Row>
+ </Card>
+ </div>
+</template>
+
+<script>
+import JsonExcel from "vue-json-excel";
+import {deleteVideoTagById, getVideoTags, editVideoTag, addVideoTag, deleteVideoTagByIds} from "@/api/videoTag";
+import {addKitchenTag, deleteTagBatch, delKitchenTag, editKitchenTag, getKitchenTagPage,editKitchenTagStaus} from "@/api/kitchen";
+export default {
+ name: "VideoTagList",
+ components: {
+ "download-excel": JsonExcel,
+ },
+ data() {
+ return {
+ // 淇濆瓨鍔犺浇
+ submitLoading: false,
+ // 鏂板淇敼琛ㄥ崟
+ form: {
+ id: '',
+ tagName: '',
+ sort: 0,
+ enable: 'ENABLE',
+ },
+ rules: {
+ tagName: [
+ {required: true, message: "鏍囩鍚嶇О涓嶈兘涓虹┖", trigger: "blur",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '') {
+ callback(new Error('鏍囩鍚嶇О涓嶈兘涓虹┖'));
+ } else {
+ callback();
+ }
+ }
+ }
+ ],
+ sort : [
+ {required: true, message: "鎺掑簭涓嶈兘涓虹┖", trigger: "blur",
+ validator: (rule, value, callback) => {
+ if (value === null || value === '' || value === undefined) {
+ callback(new Error('鎺掑簭涓嶈兘涓虹┖'));
+ } else {
+ callback();
+ }
+ }}
+ ],
+ enable : [
+ {required: true, message: "璇烽�夋嫨鍚敤鐘舵��", trigger: "change"}
+ ],
+ },
+ modelShow: false, // 寮圭獥鏄鹃殣
+ modelTitle: '', // 寮圭獥title
+ // 琛ㄦ牸鐨勮〃澶翠互鍙婂唴瀹�
+ fields: {
+ 绫诲瀷: "tagName",
+ 寮曠敤娆℃暟: "useNum",
+ 鎺掑簭: "sort_num",
+ 鎿嶄綔: "action"
+ },
+ loading: true, // 琛ㄥ崟鍔犺浇鐘舵��
+ searchForm: {
+ // 鎼滅储妗嗗垵濮嬪寲瀵硅薄
+ pageNumber: 1, // 褰撳墠椤垫暟
+ pageSize: 10, // 椤甸潰澶у皬
+ tagName: '', // 鏍囩鍚嶇О
+ enable: '',
+ },
+ selectDate: null,
+ columns: [
+ {
+ type: 'selection',
+ width: 60,
+ align: 'center'
+ },
+ {
+ title: "鍒嗙被鍚嶇О",
+ key: "tagName",
+ minWidth: 170,
+ tooltip: true,
+ },
+ {
+ title: "鎺掑簭",
+ key: "sort",
+ width: 400,
+ },
+ {
+ title: "鏄惁鍚敤",
+ key: "enable",
+ minWidth: 120,
+ align: 'center',
+ render: (h, params) => {
+ const enable = params.row.enable;
+ const color = enable === 'ENABLE' ? 'success' : enable === 'DISABLE' ? 'default' : 'warning';
+ const text = enable === 'ENABLE' ? '鍚敤' : enable === 'DISABLE' ? '绂佺敤' : '鏈煡';
+ return h('Tag', {
+ props: {
+ color: color
+ }
+ }, text);
+ }
+ },
+ {
+ title: "鎿嶄綔",
+ key: "action",
+ slot: "action",
+ align: "center",
+ width: 400,
+ },
+ ],
+ data: [], // 琛ㄥ崟鏁版嵁
+ total: 0, // 琛ㄥ崟鏁版嵁鎬绘暟
+ selectCount: 0, // 宸查�夋暟閲�
+ selectList: [], // 宸查�夋暟鎹垪琛�
+ };
+ },
+ methods: {
+ showSelect(e) {
+ this.selectList = e.map(d => d.id);
+ this.selectCount = e.length;
+ },
+ // 鎺掑簭
+ changeSort(e) {
+ this.searchForm.sort = e.key;
+ this.searchForm.order = e.order;
+ if (e.order == "normal") {
+ this.searchForm.order = "";
+ }
+ this.getDataList();
+ },
+ // 鎵归噺鍒犻櫎
+ delBatch() {
+ if (this.selectCount <= 0) {
+ this.$Message.warning("鎮ㄨ繕鏈�夋嫨瑕佸垹闄ょ殑鏁版嵁");
+ return;
+ }
+ this.$Modal.confirm({
+ title: "纭鍒犻櫎",
+ content: "鎮ㄧ‘璁よ鍒犻櫎鎵�閫夌殑 " + this.selectCount + " 鏉℃暟鎹�?",
+ loading: true,
+ onOk: () => {
+ deleteTagBatch(this.selectList).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍒犻櫎鎴愬姛");
+ this.selectList = [];
+ this.selectCount = 0;
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // id鍒犻櫎
+ delById(row) {
+ this.$Modal.confirm({
+ title: "纭鍒犻櫎",
+ content: "鎮ㄧ‘璁よ鍒犻櫎鍒嗙被锛� " + row.tagName + " ?",
+ loading: true,
+ onOk: () => {
+ delKitchenTag(row.id).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍒犻櫎鎴愬姛");
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // 鎵撳紑鏂板
+ openAdd() {
+ this.modelTitle = "鏂板鏍囩"
+ this.modelShow = true
+ this.form ={}
+ this.form.sort = 0
+ this.form.enable = 'ENABLE'
+ },
+ // 鎵撳紑淇敼
+ openEdit(row) {
+ this.modelTitle = "淇敼鏍囩"
+ this.form = {};
+ this.form.id = row.id
+ this.form.tagName = row.tagName
+ this.form.sort = row.sort !== undefined && row.sort !== null ? parseInt(row.sort) : 0
+ this.form.enable = row.enable
+ this.modelShow = true
+ console.log(this.form)
+ },
+ // 鏂板鎴栦慨鏀�
+ saveOrUpdate() {
+ this.$refs.form.validate(valid => {
+ try {
+ if (valid) {
+ this.submitLoading = true
+ if (this.form.id) {
+ // 淇敼
+ editKitchenTag(this.form).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("淇敼鎴愬姛");
+ this.modelClose()
+ this.getDataList()
+ }
+ })
+ } else {
+ // 鏂板
+ addKitchenTag(this.form).then(res => {
+ if (res.code == 200) {
+ this.$Message.success("娣诲姞鎴愬姛");
+ this.modelClose()
+ this.getDataList()
+ }
+ })
+ }
+ }
+ }finally {
+ this.submitLoading = false
+ }
+ });
+ },
+ // 鍏抽棴寮圭獥
+ modelClose() {
+ this.submitLoading = false
+ this.modelShow = false
+ },
+ // 鍚敤鏍囩
+ enableTag(row) {
+ this.$Modal.confirm({
+ title: "纭鍚敤",
+ content: "鎮ㄧ‘璁よ鍚敤鏍囩锛� " + row.tagName + " ?",
+ loading: true,
+ onOk: () => {
+ const params = {
+ id: row.id,
+ enable: 'ENABLE'
+ };
+ console.log(params,'------------------->');
+ editKitchenTagStaus(params.id,params.enable).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("鍚敤鎴愬姛");
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // 绂佺敤鏍囩
+ disableTag(row) {
+ this.$Modal.confirm({
+ title: "纭绂佺敤",
+ content: "鎮ㄧ‘璁よ绂佺敤鏍囩锛� " + row.tagName + " ?",
+ loading: true,
+ onOk: () => {
+ const params = {
+ id: row.id,
+ enable: 'DISABLE'
+ };
+ editKitchenTagStaus(params.id,params.enable).then(res => {
+ this.$Modal.remove();
+ if (res.code == 200) {
+ this.$Message.success("绂佺敤鎴愬姛");
+ this.getDataList();
+ }
+ });
+ }
+ });
+ },
+ // 鍒濆鍖栨暟鎹�
+ init() {
+ this.getDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤电爜
+ changePage(v) {
+ this.searchForm.pageNumber = v;
+ this.getDataList();
+ },
+ // 鍒嗛〉 鏀瑰彉椤垫暟
+ changePageSize(v) {
+ this.searchForm.pageNumber = 1;
+ this.searchForm.pageSize = v;
+ this.getDataList();
+ },
+ // 鎼滅储
+ handleSearch() {
+ this.searchForm.pageNumber = 1;
+ this.searchForm.pageSize = 10;
+ this.getDataList();
+ },
+ // 璧锋鏃堕棿浠庢柊璧嬪��
+ selectDateRange(v) {
+ if (v) {
+ this.searchForm.startDate = v[0];
+ this.searchForm.endDate = v[1];
+ }
+ },
+ // 鑾峰彇鍒楄〃鏁版嵁
+ getDataList() {
+ this.loading = true;
+ getKitchenTagPage(this.searchForm).then((res) => {
+ console.log(res)
+ this.loading = false;
+ if (res.code == 200) {
+ this.data = res.data;
+ this.total = res.total;
+ }
+ });
+ this.total = this.data.length;
+ this.loading = false;
+ },
+ },
+ mounted() {
+ this.init();
+ },
+};
+</script>
+<style lang="scss" scoped>
+.export {
+ margin: 10px 20px 10px 0;
+}
+.export-excel-wrapper {
+ display: inline;
+}
+.order-tab {
+ width: 950px;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ background-color: #f0f0f0;
+ padding: 0 10px;
+ margin-bottom: 10px;
+ div {
+ text-align: center;
+ padding: 4px 12px;
+ border-radius: 4px;
+ cursor: pointer;
+ }
+ .current {
+ background-color: #ffffff;
+ }
+}
+</style>
--
Gitblit v1.8.0