|
|
@@ -1,169 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="seasonal-foods admin-page">
|
|
|
- <el-card>
|
|
|
- <div slot="header" class="admin-page-header">
|
|
|
- <span class="admin-page-title">应季食材配置</span>
|
|
|
- <div class="flex items-center gap-sm">
|
|
|
- <el-select
|
|
|
- v-model="monthFilter"
|
|
|
- placeholder="选择月份"
|
|
|
- size="mini"
|
|
|
- @change="loadList"
|
|
|
- >
|
|
|
- <el-option v-for="m in 12" :key="m" :label="m + '月'" :value="m" />
|
|
|
- </el-select>
|
|
|
- <el-input v-model="keyword" placeholder="搜索..." prefix-icon="el-icon-search" clearable @keyup.enter.native="handleSearch" @clear="handleSearch" />
|
|
|
- <el-button type="primary" size="mini" @click="openCreate">新增应季映射</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="table-scroll-wrap">
|
|
|
- <el-table :data="list" v-loading="loading" border stripe :max-height="tableHeight">
|
|
|
- <el-table-column prop="id" label="ID" width="80" />
|
|
|
- <el-table-column prop="foodId" label="食材ID" width="80" />
|
|
|
- <el-table-column label="月份" width="80">
|
|
|
- <template slot-scope="{ row }">{{ row.month }}月</template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="推荐等级" width="100">
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <el-tag :type="row.peak >= 3 ? 'danger' : row.peak >= 2 ? 'warning' : 'info'" size="mini">
|
|
|
- {{ row.peak }}
|
|
|
- </el-tag>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="操作" width="200" fixed="right">
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <el-dropdown trigger="hover" @command="(cmd) => handleActionCmd(row, cmd)">
|
|
|
- <el-button size="mini">
|
|
|
- 更多<i class="el-icon-arrow-down el-icon--right"></i>
|
|
|
- </el-button>
|
|
|
- <el-dropdown-menu slot="dropdown">
|
|
|
- <el-dropdown-item command="delete" icon="el-icon-delete">删除</el-dropdown-item>
|
|
|
- </el-dropdown-menu>
|
|
|
- </el-dropdown>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table></div>
|
|
|
- </el-card>
|
|
|
-
|
|
|
- <el-dialog title="新增应季映射" :visible.sync="dialogVisible" width="400px">
|
|
|
- <el-form label-width="100px">
|
|
|
- <el-form-item label="食材ID">
|
|
|
- <el-input-number v-model="form.foodId" :min="1" style="width:100%" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="月份">
|
|
|
- <el-select v-model="form.month" style="width:100%">
|
|
|
- <el-option v-for="m in 12" :key="m" :label="m + '月'" :value="m" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="推荐等级">
|
|
|
- <el-select v-model="form.peak" style="width:100%">
|
|
|
- <el-option label="1-普通" :value="1" />
|
|
|
- <el-option label="2-推荐" :value="2" />
|
|
|
- <el-option label="3-强烈推荐" :value="3" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <div slot="footer">
|
|
|
- <el-button @click="dialogVisible = false">取消</el-button>
|
|
|
- <el-button type="primary" :loading="submitting" @click="saveItem">保存</el-button>
|
|
|
- </div>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-export default {
|
|
|
- name: 'SeasonalFoods',
|
|
|
- computed: {
|
|
|
- tableHeight() {
|
|
|
- return window.innerHeight - 300
|
|
|
- }
|
|
|
- },
|
|
|
- data() {
|
|
|
- const now = new Date()
|
|
|
- return {
|
|
|
- submitting: false,
|
|
|
- loading: false,
|
|
|
- list: [],
|
|
|
- dialogVisible: false,
|
|
|
- keyword: '',
|
|
|
- monthFilter: now.getMonth() + 1,
|
|
|
- form: {
|
|
|
- foodId: null,
|
|
|
- month: now.getMonth() + 1,
|
|
|
- peak: 1
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.loadList()
|
|
|
- },
|
|
|
- methods: {
|
|
|
- async loadList() {
|
|
|
- this.loading = true
|
|
|
- try {
|
|
|
- const baseURL = process.env.VUE_APP_BASE_API || ''
|
|
|
- const token = localStorage.getItem('token')
|
|
|
- const axios = this.$axios || (await import('axios')).default
|
|
|
- const res = await axios.post(baseURL + '/api/admin/seasonal/list', { month: this.monthFilter, keyword: this.keyword }, {
|
|
|
- headers: { Authorization: 'Bearer ' + token }
|
|
|
- })
|
|
|
- this.list = res.data && res.data.data || []
|
|
|
- } catch (e) {
|
|
|
- this.$message && this.$message.error && this.$message.error('加载失败')
|
|
|
- } finally {
|
|
|
- this.loading = false
|
|
|
- }
|
|
|
- },
|
|
|
- handleSearch() {
|
|
|
- this.loadList()
|
|
|
- },
|
|
|
- openCreate() {
|
|
|
- this.form = { foodId: null, month: new Date().getMonth() + 1, peak: 1 }
|
|
|
- this.dialogVisible = true
|
|
|
- },
|
|
|
- async saveItem() {
|
|
|
- if (!this.form.foodId) {
|
|
|
- this.$message && this.$message.warning && this.$message.warning('请输入食材ID')
|
|
|
- return
|
|
|
- }
|
|
|
- try {
|
|
|
- const baseURL = process.env.VUE_APP_BASE_API || ''
|
|
|
- const token = localStorage.getItem('token')
|
|
|
- const axios = this.$axios || (await import('axios')).default
|
|
|
- await axios.post(baseURL + '/api/admin/seasonal/create', this.form, {
|
|
|
- headers: { Authorization: 'Bearer ' + token }
|
|
|
- })
|
|
|
- this.$message && this.$message.success && this.$message.success('创建成功')
|
|
|
- this.dialogVisible = false
|
|
|
- this.loadList()
|
|
|
- } catch (e) {
|
|
|
- this.$message && this.$message.error && this.$message.error('保存失败')
|
|
|
- }
|
|
|
- },
|
|
|
- async deleteItem(row) {
|
|
|
- this.$confirm('确定删除该应季映射吗?', '提示', { type: 'warning' }).then(async () => {
|
|
|
- try {
|
|
|
- const baseURL = process.env.VUE_APP_BASE_API || ''
|
|
|
- const token = localStorage.getItem('token')
|
|
|
- const axios = this.$axios || (await import('axios')).default
|
|
|
- await axios.post(baseURL + '/api/admin/seasonal/delete', { id: row.id }, {
|
|
|
- headers: { Authorization: 'Bearer ' + token }
|
|
|
- })
|
|
|
- this.$message && this.$message.success && this.$message.success('删除成功')
|
|
|
- this.loadList()
|
|
|
- } catch (e) {
|
|
|
- this.$message && this.$message.error && this.$message.error('删除失败')
|
|
|
- }
|
|
|
- }).catch(() => {})
|
|
|
- },
|
|
|
- handleActionCmd(row, cmd) {
|
|
|
- switch (cmd) {
|
|
|
- case 'delete':
|
|
|
- this.deleteItem(row)
|
|
|
- break
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|