复制功能
This commit is contained in:
parent
0d36574c50
commit
4f08bedf61
stdiet-ui/src
store/modules
views/custom/recipesBuild/RecipesView/RecipesCom
@ -28,7 +28,8 @@ const oriState = {
|
||||
startNum: 0,
|
||||
endNum: 0,
|
||||
reviewStatus: 0,
|
||||
templateInfo: undefined
|
||||
templateInfo: undefined,
|
||||
copyData: undefined
|
||||
};
|
||||
|
||||
const mutations = {
|
||||
@ -37,7 +38,7 @@ const mutations = {
|
||||
obj => obj.id === payload.id
|
||||
);
|
||||
if (tarDishes) {
|
||||
if (tarDishes.dishesId !== payload.dishesId) {
|
||||
if (payload.dishesId || payload.type !== undefined) {
|
||||
// 替换菜品
|
||||
Object.keys(payload).forEach(key => {
|
||||
if (key === "num") {
|
||||
@ -282,6 +283,7 @@ const actions = {
|
||||
// console.log(params);
|
||||
},
|
||||
async addDishes({ commit, state }, payload) {
|
||||
console.log(payload);
|
||||
const tarDishesList = state.recipesData[payload.num].dishes.filter(
|
||||
obj => obj.type === payload.data.type
|
||||
);
|
||||
@ -367,26 +369,34 @@ const actions = {
|
||||
);
|
||||
if (tarDishes) {
|
||||
const mTarDishes = JSON.parse(JSON.stringify(tarDishes));
|
||||
const tarIgd = mTarDishes.igdList.find(obj => obj.id === payload.igdId);
|
||||
if (tarIgd) {
|
||||
payload.weight && (tarIgd.weight = payload.weight);
|
||||
payload.cusWeight && (tarIgd.cusWeight = payload.cusWeight);
|
||||
payload.cusUnit && (tarIgd.cusUnit = payload.cusUnit);
|
||||
let params = {
|
||||
id: mTarDishes.id
|
||||
};
|
||||
if (payload.type !== undefined) {
|
||||
// 修改餐类
|
||||
params.type = payload.type;
|
||||
} else {
|
||||
// 修改食材
|
||||
const tarIgd = mTarDishes.igdList.find(
|
||||
obj => obj.id === payload.igdId
|
||||
);
|
||||
if (tarIgd) {
|
||||
payload.weight && (tarIgd.weight = payload.weight);
|
||||
payload.cusWeight && (tarIgd.cusWeight = payload.cusWeight);
|
||||
payload.cusUnit && (tarIgd.cusUnit = payload.cusUnit);
|
||||
|
||||
const params = {
|
||||
id: mTarDishes.id,
|
||||
detail: mTarDishes.igdList.map(igd => ({
|
||||
params.detail = mTarDishes.igdList.map(igd => ({
|
||||
id: igd.id,
|
||||
weight: igd.weight,
|
||||
cus_unit: igd.cusUnit,
|
||||
cus_weight: igd.cusWeight
|
||||
}))
|
||||
};
|
||||
const result = await updateDishesDetailApi(params);
|
||||
if (result.code === 200) {
|
||||
commit("updateRecipesDishesDetail", payload);
|
||||
}));
|
||||
}
|
||||
}
|
||||
const result = await updateDishesDetailApi(params);
|
||||
if (result.code === 200) {
|
||||
commit("updateRecipesDishesDetail", payload);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
commit("updateRecipesDishesDetail", payload);
|
||||
@ -408,7 +418,21 @@ const actions = {
|
||||
commit("deleteSomeDayDishes", payload);
|
||||
}
|
||||
},
|
||||
async deleteMenu({ commit }, payload) {}
|
||||
async deleteMenu({ commit }, payload) {},
|
||||
async setCopyData({ commit, state }, payload) {
|
||||
return new Promise((res, rej) => {
|
||||
const tarDishes = state.recipesData[payload.num].dishes.find(
|
||||
obj => obj.id === payload.id
|
||||
);
|
||||
if (tarDishes) {
|
||||
commit("updateStateData", { copyData: tarDishes });
|
||||
|
||||
res("复制成功");
|
||||
} else {
|
||||
rej("复制失败");
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const getters = {
|
||||
|
@ -92,13 +92,14 @@ export default {
|
||||
data.name
|
||||
}」`;
|
||||
this.id = data.id;
|
||||
this.type = data.type;
|
||||
} else if (type) {
|
||||
this.title = `添加第${numDay}天${this.typeDict[type]}菜品`;
|
||||
this.type = type;
|
||||
}
|
||||
this.visible = true;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.dishesRef.getList({ type });
|
||||
this.$refs.dishesRef.getList({ type: this.type });
|
||||
});
|
||||
},
|
||||
handleOnClosed(done) {
|
||||
|
98
stdiet-ui/src/views/custom/recipesBuild/RecipesView/RecipesCom/DishesSettingDialog/index.vue
Normal file
98
stdiet-ui/src/views/custom/recipesBuild/RecipesView/RecipesCom/DishesSettingDialog/index.vue
Normal file
@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
:title="title"
|
||||
:visible.sync="visible"
|
||||
width="320px"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<div v-loading="loading" @click="handleClick" class="reuse_dialog_wrapper">
|
||||
<div style="margin-bottom: 12px">餐类</div>
|
||||
<el-radio-group v-model="type">
|
||||
<el-radio
|
||||
style="padding: 8px 0"
|
||||
v-for="item in menuTypeOptions"
|
||||
:key="item.dictValue"
|
||||
:label="item.dictValue"
|
||||
>
|
||||
{{ item.dictLabel }}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { createNamespacedHelpers } from "vuex";
|
||||
const { mapState } = createNamespacedHelpers("recipes");
|
||||
import { getDishes } from "@/api/custom/dishes";
|
||||
export default {
|
||||
name: "DishesSettingDialog",
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
loading: false,
|
||||
data: undefined,
|
||||
type: "",
|
||||
menuTypeOptions: [],
|
||||
title: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleClick(e) {
|
||||
e.stopPropagation();
|
||||
},
|
||||
showDialog({ numDay, data }) {
|
||||
if (!data) {
|
||||
return;
|
||||
}
|
||||
this.data = data;
|
||||
this.visible = true;
|
||||
this.loading = true;
|
||||
this.type = data.type;
|
||||
this.title = `修改第${numDay}天「${data.name}」菜品`;
|
||||
getDishes(data.dishesId).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.loading = false;
|
||||
this.menuTypeOptions = res.data.type
|
||||
.split(",")
|
||||
.sort((a, b) => a - b)
|
||||
.reduce((arr, cur) => {
|
||||
const tarOpt = this.typeOptions.find(
|
||||
(obj) => obj.dictValue === cur
|
||||
);
|
||||
if (tarOpt) {
|
||||
arr.push(tarOpt);
|
||||
}
|
||||
return arr;
|
||||
}, []);
|
||||
}
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
this.visible = false;
|
||||
this.data = undefined;
|
||||
},
|
||||
submit() {
|
||||
this.visible = false;
|
||||
this.$emit("onConfirm", { type: this.type, id: this.data.id });
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState(["typeOptions"]),
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.reuse_dialog_wrapper {
|
||||
.item {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.menu_type {
|
||||
padding: 8px 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -1,20 +0,0 @@
|
||||
<template>
|
||||
<el-dialog>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'ReuseDialog',
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
data: undefined
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showDialog() {
|
||||
this.visible = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
@ -11,8 +11,22 @@
|
||||
>
|
||||
<el-table-column prop="type" :width="100" align="center">
|
||||
<template slot="header">
|
||||
<div class="num_day" @click="handleOnResetCurrentDay">
|
||||
<div>{{ `第${numDay}天` }}</div>
|
||||
<el-popover placement="top" trigger="hover" v-if="!!copyData">
|
||||
<div>
|
||||
<el-button size="mini" type="primary" @click="handleOnPaste"
|
||||
>粘贴</el-button
|
||||
>
|
||||
</div>
|
||||
<div
|
||||
slot="reference"
|
||||
class="num_day"
|
||||
@click="handleOnResetCurrentDay"
|
||||
>
|
||||
{{ `第${numDay}天` }}
|
||||
</div>
|
||||
</el-popover>
|
||||
<div v-else>
|
||||
{{ `第${numDay}天` }}
|
||||
</div>
|
||||
</template>
|
||||
<template slot-scope="scope">
|
||||
@ -44,23 +58,42 @@
|
||||
<template slot-scope="scope">
|
||||
<el-popover placement="right" trigger="hover" :title="scope.row.name">
|
||||
<div>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
icon="el-icon-refresh"
|
||||
class="fun_button"
|
||||
@click="handleOnReplace(scope.row)"
|
||||
>
|
||||
替换
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
size="mini"
|
||||
icon="el-icon-delete"
|
||||
class="fun_button"
|
||||
@click="handleOnDelete(scope.row)"
|
||||
>删除</el-button
|
||||
>
|
||||
<div style="margin-bottom: 8px">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
icon="el-icon-refresh"
|
||||
class="fun_button"
|
||||
@click="handleOnReplace(scope.row)"
|
||||
>
|
||||
替换
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
size="mini"
|
||||
icon="el-icon-delete"
|
||||
class="fun_button"
|
||||
@click="handleOnDelete(scope.row)"
|
||||
>删除</el-button
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
icon="el-icon-document-copy"
|
||||
class="fun_button"
|
||||
@click="handleOnCopy(scope.row)"
|
||||
>复制</el-button
|
||||
>
|
||||
<el-button
|
||||
size="mini"
|
||||
icon="el-icon-document-copy"
|
||||
class="fun_button"
|
||||
@click="handleOnSetting(scope.row)"
|
||||
>修改餐类</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<span class="num_day" slot="reference">{{ scope.row.name }}</span>
|
||||
</el-popover>
|
||||
@ -172,7 +205,13 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="做法" prop="methods" />
|
||||
</el-table>
|
||||
<!-- 添加菜品抽屉 -->
|
||||
<AddDishesDrawer ref="drawerRef" @onConfirm="handleOnDishesConfirm" />
|
||||
<!-- 菜品复用菜单 -->
|
||||
<DishesSettingDialog
|
||||
ref="settingDialogRef"
|
||||
@onConfirm="handleOnSettingConfirm"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -187,6 +226,8 @@ const {
|
||||
import EditableText from "./EditableText";
|
||||
import EditableUnit from "./EditableUnit";
|
||||
import AddDishesDrawer from "./AddDishesDrawer";
|
||||
import DishesSettingDialog from "./DishesSettingDialog";
|
||||
import VueScrollTo from "vue-scrollto";
|
||||
|
||||
export default {
|
||||
name: "RecipesCom",
|
||||
@ -213,6 +254,7 @@ export default {
|
||||
EditableText,
|
||||
EditableUnit,
|
||||
AddDishesDrawer,
|
||||
DishesSettingDialog,
|
||||
},
|
||||
mounted() {
|
||||
// console.log(this.data);
|
||||
@ -313,12 +355,15 @@ export default {
|
||||
return mData;
|
||||
},
|
||||
...mapGetters(["typeDict"]),
|
||||
...mapState(["currentDay"]),
|
||||
...mapState(["currentDay", "copyData"]),
|
||||
},
|
||||
methods: {
|
||||
handleParentClick(e) {
|
||||
// 校验某天
|
||||
this.setCurrentDay({ currentDay: this.num });
|
||||
VueScrollTo.scrollTo(`#recipes${this.num}`, 500, {
|
||||
container: "#recipes_content",
|
||||
});
|
||||
},
|
||||
spanMethod({ row, column, rowIndex, columnIndex }) {
|
||||
if (columnIndex === 0) {
|
||||
@ -351,6 +396,27 @@ export default {
|
||||
// console.log(data);
|
||||
this.deleteDishes({ num: this.num, id: data.id });
|
||||
},
|
||||
handleOnCopy(data) {
|
||||
// console.log(data);
|
||||
this.setCopyData({ num: this.num, id: data.id })
|
||||
.then((msg) => {
|
||||
this.$message.success(msg);
|
||||
})
|
||||
.catch((err) => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
handleOnPaste() {
|
||||
// console.log(this.copyData);
|
||||
if (this.copyData) {
|
||||
this.addDishes({
|
||||
num: this.num,
|
||||
data: this.copyData,
|
||||
}).catch((err) => {
|
||||
this.$message.error(err);
|
||||
});
|
||||
}
|
||||
},
|
||||
handleOnWeightChange(data, weight) {
|
||||
// console.log({ data, weight });
|
||||
this.updateDishes({
|
||||
@ -390,6 +456,16 @@ export default {
|
||||
});
|
||||
}
|
||||
},
|
||||
handleOnSetting(data) {
|
||||
this.$refs.settingDialogRef.showDialog({ numDay: this.numDay, data });
|
||||
},
|
||||
handleOnSettingConfirm({ type, id }) {
|
||||
this.updateDishes({
|
||||
num: this.num,
|
||||
id,
|
||||
type,
|
||||
});
|
||||
},
|
||||
handleOnMenuTypeClick(data) {
|
||||
this.$refs.drawerRef.showDrawer({ type: data.type, numDay: this.numDay });
|
||||
},
|
||||
@ -398,6 +474,7 @@ export default {
|
||||
"addDishes",
|
||||
"deleteDishes",
|
||||
"replaceDishes",
|
||||
"setCopyData",
|
||||
]),
|
||||
...mapMutations(["setCurrentDay", "resetCurrentDay"]),
|
||||
},
|
||||
|
Loading…
x
Reference in New Issue
Block a user