Song/xkrs_ms
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' of https://gitee.com/darlk/ShengTangManage into xzj

Browse Source
This commit is contained in:
xiezhijun
2021-03-22 15:52:21 +08:00
parent 1d66f7334a bee860e4b9
commit 4294ab57c7
13 changed files with 1434 additions and 967 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
stdiet-admin/src/main/java/com/stdiet/web/controller/custom/SysCustomerHealthyController.java
View File

@ -3,7 +3,10 @@ package com.stdiet.custom.controller;
import java.util.List;
import com.stdiet.common.utils.StringUtils;
import com.stdiet.custom.domain.SysCustomerPhysicalSigns;
import com.stdiet.custom.domain.SysPhysicalSigns;
import com.stdiet.custom.dto.request.HealthyDetailRequest;
import com.stdiet.custom.service.ISysCustomerPhysicalSignsService;
import org.springframework.security.access.prepost.PreAuthorize;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;
@ -29,6 +32,9 @@ public class SysCustomerHealthyController extends BaseController
@Autowired
private ISysCustomerHealthyService sysCustomerHealthyService;
@Autowired
private ISysCustomerPhysicalSignsService sysCustomerPhysicalSignsService;
/**
* 查询客户健康列表
*/
@ -120,4 +126,14 @@ public class SysCustomerHealthyController extends BaseController
{
return sysCustomerHealthyService.generateHealthyReport(healthyDetailRequest);
}
/**
* 修改老的体征数据
* @param sysPhysicalSigns
* @return
*/
@PutMapping("/edit/physical")
public AjaxResult editPhysical(@RequestBody SysCustomerPhysicalSigns sysPhysicalSigns) {
return toAjax(sysCustomerPhysicalSignsService.updateSysCustomerPhysicalSigns(sysPhysicalSigns));
}
}

43
stdiet-ui/public/index.html
View File

@ -1,12 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="stylesheet" href="//at.alicdn.com/t/font_2343184_8rlvxcc41j5.css">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="renderer" content="webkit" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
/>
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<link
rel="stylesheet"
href="//at.alicdn.com/t/font_2343184_w0runuauamq.css"
/>
<title><%= webpackConfig.name %></title>
<style>
html,
@ -42,7 +48,7 @@
margin: -75px 0 0 -75px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #FFF;
border-top-color: #fff;
-webkit-animation: spin 2s linear infinite;
-ms-animation: spin 2s linear infinite;
-moz-animation: spin 2s linear infinite;
@ -60,7 +66,7 @@
bottom: 5px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #FFF;
border-top-color: #fff;
-webkit-animation: spin 3s linear infinite;
-moz-animation: spin 3s linear infinite;
-o-animation: spin 3s linear infinite;
@ -77,7 +83,7 @@
bottom: 15px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #FFF;
border-top-color: #fff;
-moz-animation: spin 1.5s linear infinite;
-o-animation: spin 1.5s linear infinite;
-ms-animation: spin 1.5s linear infinite;
@ -85,7 +91,6 @@
animation: spin 1.5s linear infinite;
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
@ -112,13 +117,12 @@
}
}
#loader-wrapper .loader-section {
position: fixed;
top: 0;
width: 51%;
height: 100%;
background: #7171C6;
background: #7171c6;
z-index: 1000;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
@ -133,21 +137,20 @@
right: 0;
}
.loaded #loader-wrapper .loader-section.section-left {
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.loaded #loader-wrapper .loader-section.section-right {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.loaded #loader {
@ -174,8 +177,8 @@
}
#loader-wrapper .load_title {
font-family: 'Open Sans';
color: #FFF;
font-family: "Open Sans";
color: #fff;
font-size: 19px;
width: 100%;
text-align: center;
@ -190,7 +193,7 @@
font-weight: normal;
font-style: italic;
font-size: 13px;
color: #FFF;
color: #fff;
opacity: 0.5;
}
</style>

62
stdiet-ui/src/api/custom/healthy.js
View File

@ -1,74 +1,80 @@
import request from '@/utils/request'
import request from "@/utils/request";
// 查询客户健康列表
export function listHealthy(query) {
return request({
url: '/custom/healthy/list',
method: 'get',
url: "/custom/healthy/list",
method: "get",
params: query
})
});
}
// 查询客户健康详细
export function getHealthy(id) {
return request({
url: '/custom/healthy/' + id,
method: 'get'
})
url: "/custom/healthy/" + id,
method: "get"
});
}
// 新增客户健康
export function addHealthy(data) {
return request({
url: '/custom/healthy',
method: 'post',
url: "/custom/healthy",
method: "post",
data: data
})
});
}
// 修改客户健康
export function updateHealthy(data) {
return request({
url: '/custom/healthy',
method: 'put',
url: "/custom/healthy",
method: "put",
data: data
})
});
}
// 删除客户健康
export function delHealthy(id) {
return request({
url: '/custom/healthy/' + id,
method: 'delete'
})
url: "/custom/healthy/" + id,
method: "delete"
});
}
// 导出客户健康
export function exportHealthy(query) {
return request({
url: '/custom/healthy/export',
method: 'get',
url: "/custom/healthy/export",
method: "get",
params: query
})
});
}
// 下载文件
export function download(fileName) {
return request({
url: '/common/download',
method: 'get',
params: {"fileName": fileName}
})
url: "/common/download",
method: "get",
params: { fileName: fileName }
});
}
// 生成健康体征报告
export function generateHealthyReport(healthyDetail) {
return request({
url: '/custom/healthy/generateHealthyReport',
method: 'post',
url: "/custom/healthy/generateHealthyReport",
method: "post",
data: healthyDetail
})
});
}
// 修改老的体征
export function editPhysicalSigns(data) {
return request({
url: "/custom/healthy/edit/physical",
method: "put",
data
});
}

14
stdiet-ui/src/components/BodySignView/index.vue
View File

@ -2,14 +2,14 @@
<div class="body_sign_view_wrapper">
<div>
<h2>{{ this.data.name }}</h2>
<!-- <el-button
<el-button
v-if="dev"
size="mini"
type="primary"
class="remark_btn"
@click="handleOnRemark"
>修改备注</el-button
> -->
>
<div class="msg-info" v-for="(info, idx) in basicInfo" :key="idx">
<text-info
v-for="con in info"
@ -25,7 +25,7 @@
<el-dialog title="修改备注" :visible.sync="open" width="480px">
<el-input
type="textarea"
v-model="data.remark"
v-model="data.remarks"
rows="6"
placeholder="请输入备注信息"
maxlength="300"
@ -40,7 +40,7 @@
</template>
<script>
import TextInfo from "@/components/TextInfo";
import { updateHealthy } from "@/api/custom/healthy";
import { editPhysicalSigns } from "@/api/custom/healthy";
export default {
name: "BodySignView",
@ -111,7 +111,7 @@ export default {
{ title: "不运动总热量", value: "notSportHeat" },
]);
basicInfo.splice(basicInfo.length, 0, [
{ title: "备注", value: "remark" },
{ title: "备注", value: "remarks" },
]);
}
return {
@ -127,8 +127,8 @@ export default {
this.open = false;
},
submit() {
const { id, remark } = this.data;
updateHealthy({ id, remark }).then((res) => {
const { id, remarks } = this.data;
editPhysicalSigns({ id, remarks }).then((res) => {
if (res.code === 200) {
this.$message.success("修改成功");
this.open = false;

84
stdiet-ui/src/store/modules/recipes.js
View File

@ -522,6 +522,8 @@ const getters = {
(igd.weight / 100) * igd.proteinRatio * 4 +
(igd.weight / 100) * igd.fatRatio * 9 +
(igd.weight / 100) * igd.carbonRatio * 4;
obj[`weight${cur.type}`] += igd.weight;
obj.totalWeight += igd.weight;
});
return obj;
},
@ -533,66 +535,96 @@ const getters = {
pHeat: 0,
fHeat: 0,
cHeat: 0,
//
totalHeat: 0,
heat1: 0,
heat2: 0,
heat3: 0,
heat4: 0,
heat5: 0,
heat6: 0
heat6: 0,
//
totalWeight: 0,
weight1: 0,
weight2: 0,
weight3: 0,
weight4: 0,
weight5: 0,
weight6: 0
}
)
);
console.log(nutriData);
return nutriData;
},
verifyNotRecData: state =>
state.recipesData.reduce((arr, cur, dayIdx) => {
verifyNotRecData: state => {
const data = state.recipesData.reduce((arr, cur, dayIdx) => {
cur.dishes.forEach(dObj => {
dObj.igdList.forEach(iObj => {
(iObj.notRec || "").split(",").forEach(nRec => {
if (nRec) {
let tarObj = arr.find(obj => obj.name === nRec);
const tarObj = arr.find(obj => obj.name === nRec);
if (tarObj) {
tarObj.data.push({
igdId: iObj.id,
num: dayIdx,
dishesId: dObj.dishesId,
id: dObj.id
});
if (!tarObj.igdIds.includes(iObj.id)) {
tarObj.igdIds.push(iObj.id);
}
const tarIgdObj = tarObj.data.find(obj => obj.id === iObj.id);
if (tarIgdObj) {
if (!tarIgdObj.data.some(obj => obj.day === cur.numDay)) {
tarIgdObj.data.push({ num: dayIdx, day: cur.numDay });
}
} else {
tarObj = {
tarObj.data.push({
name: iObj.name,
id: iObj.id,
data: [{ num: dayIdx, day: cur.numDay }]
});
}
} else {
arr.push({
name: nRec,
igdIds: [iObj.id],
data: [
{
igdId: iObj.id,
num: dayIdx,
dishesId: dObj.dishesId,
id: dObj.id
name: iObj.name,
id: iObj.id,
data: [{ num: dayIdx, day: cur.numDay }]
}
]
};
arr.push(tarObj);
});
}
}
});
});
});
return arr;
}, []),
igdTypeDetial: state =>
state.recipesData.reduce((obj, cur) => {
}, []);
// console.log(data);
return data;
},
igdTypeData: state => {
const data = state.recipesData.reduce((arr, cur, idx) => {
cur.dishes.forEach(dObj => {
dObj.igdList.forEach(iObj => {
if (!obj[iObj.type]) {
obj[iObj.type] = [{ name: iObj.name, id: iObj.id }];
} else if (!obj[iObj.type].some(tObj => tObj.id === iObj.id)) {
obj[iObj.type].push({ name: iObj.name, id: iObj.id });
let tarObj = arr.find(obj => obj.id === iObj.id);
if (!tarObj) {
tarObj = {
name: iObj.name,
id: iObj.id,
data: [{ num: idx, day: cur.numDay }]
};
arr.push(tarObj);
} else if (!tarObj.data.some(obj => obj.day === cur.numDay)) {
tarObj.data.push({ num: idx, day: cur.numDay });
}
});
});
return obj;
}, {}),
return arr;
}, []);
// console.log(data);
return data;
},
cusUnitDict: state =>
state.cusUnitOptions.reduce((obj, cur) => {
obj[cur.dictValue] = cur.dictLabel;

137
stdiet-ui/src/views/custom/dishes/EditDishesDrawer/IngredientListView/index.vue Normal file
View File

@ -0,0 +1,137 @@
<template>
<div>
<el-form
:model="queryParams"
ref="queryForm"
:inline="true"
label-width="68px"
>
<el-form-item label="名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入食材名称"
clearable
size="mini"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="类别" prop="type">
<el-select
v-model="queryParams.type"
placeholder="请选择食材类别"
clearable
size="mini"
>
<el-option
v-for="dict in typeOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
type="cyan"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索
</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置
</el-button>
</el-form-item>
</el-form>
<el-table
v-loading="loading"
border
:data="ingredientList"
:cell-style="{ padding: 0 }"
:header-cell-style="{ padding: 0, height: 'unset' }"
>
<el-table-column label="食材名称" align="center" prop="name" />
<el-table-column
label="食材类别"
align="center"
prop="type"
:formatter="typeFormat"
/>
<el-table-column prop="proteinRatio" label="蛋白质/100g" align="center" />
<el-table-column prop="fatRatio" label="脂肪/100g" align="center" />
<el-table-column prop="carbonRatio" label="碳水/100g" align="center" />
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="handleOnSelect(scope.row)"
>选用</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:background="false"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
layout="total, prev, pager, next"
/>
</div>
</template>
<script>
import { listIngredient } from "@/api/custom/ingredient";
export default {
name: "IngredientListView",
data() {
return {
loading: false,
total: 0,
ingredientList: [],
queryParams: {
pageNum: 1,
pageSize: 10,
name: null,
type: null,
area: null,
reviewStatus: "yes",
},
};
},
props: ["typeOptions", "visible"],
watch: {},
methods: {
getList() {
this.loading = true;
listIngredient(this.queryParams).then((response) => {
this.ingredientList = response.rows;
this.total = response.total;
this.loading = false;
});
},
reset() {
this.resetForm("queryForm");
},
// 食材类别字典翻译
typeFormat(row, column) {
return this.selectDictLabel(this.typeOptions, row.type);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
handleOnSelect(data) {
this.$emit("onSelect", data);
},
},
};
</script>

507
stdiet-ui/src/views/custom/dishes/EditDishesDrawer/index.vue Normal file
View File

@ -0,0 +1,507 @@
<template>
<el-drawer
:title="title"
:visible.sync="open"
:wrapperClosable="false"
:before-close="handleClose"
size="50%"
:close-on-press-escape="false"
>
<div class="edit_dishes_drawer_wrapper">
<el-row class="content_detail" v-loading="entireLoading">
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-col :span="12">
<el-form-item label="菜品名称" prop="name">
<el-input v-model="form.name" placeholder="请输入菜品名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="审核状态" prop="reviewStatus">
<el-select
v-model="form.reviewStatus"
placeholder="请选择审核状态"
clearable
>
<el-option
v-for="dict in reviewStatusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="菜品种类" prop="dishClass">
<el-cascader
filterable
v-model="form.dishClass"
:options="dishClassOptions"
:props="{ expandTrigger: 'hover' }"
placeholder="请选择菜品种类"
></el-cascader>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="菜品类型" prop="type">
<el-select
v-model="form.type"
placeholder="请选择菜品类型"
multiple
>
<el-option
v-for="dict in typeOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="是否主食" prop="isMain">
<el-radio-group v-model="form.isMain">
<el-radio :label="0">是</el-radio>
<el-radio :label="1">否</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="待选食材">
<IngredientListView
ref="igdRef"
:typeOptions="ingTypeOptions"
@onSelect="handleOnIgdSelect"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="已选食材" prop="igdList">
<el-table
:data="form.igdList"
border
show-summary
:cell-style="{ padding: '2px 0' }"
:header-cell-style="{ padding: 0, height: 'unset' }"
:summary-method="getSummaries"
>
<el-table-column prop="name" label="食材" align="center" />
<el-table-column label="通俗计量" align="center">
<template slot-scope="scope">
<span class="cus-unit">
<el-select size="mini" v-model="scope.row.cusWeight">
<el-option
v-for="dict in cusWeightOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="parseInt(dict.dictValue)"
/>
</el-select>
<el-select size="mini" v-model="scope.row.cusUnit">
<el-option
v-for="dict in cusUnitOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="parseInt(dict.dictValue)"
/>
</el-select>
</span>
</template>
</el-table-column>
<el-table-column prop="weight" label="重量(g)" align="center">
<template slot-scope="scope">
<el-input-number
class="weight"
v-model="scope.row.weight"
size="mini"
controls-position="right"
:min="0"
:step="5"
/>
</template>
</el-table-column>
<el-table-column
prop="proteinRatio"
label="蛋白质/100g"
align="center"
/>
<el-table-column
prop="fatRatio"
label="脂肪/100g"
align="center"
/>
<el-table-column
prop="carbonRatio"
label="碳水/100g"
align="center"
/>
<el-table-column label="热量(kcal)" align="center">
<template slot-scope="scope">
{{
`${(
((scope.row.proteinRatio * scope.row.weight) / 100) *
4 +
((scope.row.fatRatio * scope.row.weight) / 100) * 9 +
((scope.row.carbonRatio * scope.row.weight) / 100) * 4
).toFixed(1)}`
}}
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="handleOnDelete(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="推荐人群" v-if="!!selRec.length">
<el-tag
style="margin-right: 4px"
v-for="rec in selRec"
:key="rec"
type="success"
>
{{ rec }}
</el-tag>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="忌口人群" v-if="!!selNotRec.length">
<el-tag
style="margin-right: 4px"
v-for="notRec in selNotRec"
:key="notRec"
type="danger"
>
{{ notRec }}
</el-tag>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="做法" prop="methods">
<el-input
v-model="form.methods"
type="textarea"
placeholder="请输入内容"
rows="4"
/>
</el-form-item>
</el-col>
</el-form>
</el-row>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</div>
</el-drawer>
</template>
<script>
import { addDishes, updateDishes, getDishes } from "@/api/custom/dishes";
import IngredientListView from "./IngredientListView";
export default {
name: "EditDishesDrawer",
components: {
IngredientListView,
},
created() {
this.getDicts("cus_ing_type").then((response) => {
this.ingTypeOptions = response.data;
});
this.getDicts("cus_cus_unit").then((response) => {
this.cusUnitOptions = response.data;
});
this.getDicts("cus_cus_weight").then((response) => {
this.cusWeightOptions = response.data;
});
},
data() {
return {
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 通俗单位
cusUnitOptions: [],
//
cusWeightOptions: [],
// 食材类别字典
ingTypeOptions: [],
// 表单参数
form: {},
// 表单校验
rules: {
name: [
{ required: true, message: "菜品名称不能为空", trigger: "blur" },
],
type: [
{ required: true, message: "菜品类型不能为空", trigger: "blur" },
],
igdList: [{ required: true, message: "食材不能为空", trigger: "blur" }],
},
//
entireLoading: false,
// 选中的食材分量列表
//
selRec: [],
selNotRec: [],
};
},
props: [
"typeOptions",
"reviewStatusOptions",
"dishClassBigOptions",
"dishClassOptions",
"dishClassSmallOptions",
],
watch: {
"form.igdList": function (val) {
const selRec = [];
const selNotRec = [];
val.forEach((obj) => {
if (obj.rec) {
obj.rec.split(",").forEach((rec) => {
if (!selRec.includes(rec)) {
selRec.push(rec);
}
});
}
if (obj.notRec) {
obj.notRec.split(",").forEach((notRec) => {
if (!selNotRec.includes(notRec)) {
selNotRec.push(notRec);
}
});
}
});
this.selRec = selRec;
this.selNotRec = selNotRec;
},
showNotRec() {
return !!this.selNotRec.length;
},
},
methods: {
showDrawer(id) {
this.open = true;
this.title = id ? "修改菜品" : "新建菜品";
this.reset();
if (id) {
this.fetchDishesDetail(id);
}
this.$nextTick(() => {
this.$refs.igdRef.getList();
});
},
fetchDishesDetail(id) {
getDishes(id).then((response) => {
this.form = response.data;
this.form.dishClass = [this.form.bigClass, this.form.smallClass];
this.form.type = this.form.type ? this.form.type.split(",") : [];
});
},
handleOnIgdSelect(data) {
if (this.form.igdList.some((obj) => obj.id === data.id)) {
this.$message.error(`已存在食材${data.name}`);
return;
}
this.form.igdList.push({
...data,
weight: 100,
cusUnit: 1,
cusWeight: 1,
});
},
handleOnDelete(data) {
this.form.igdList = this.form.igdList.filter((obj) => obj.id !== data.id);
},
cusUnitFormat(row, column) {
return this.selectDictLabel(this.cusUnitOptions, row.type);
},
cusWeightFormat(row, column) {
return this.selectDictLabel(this.cusWeightOptions, row.cusWeight);
},
// 取消按钮
cancel() {
this.open = false;
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
type: [],
dishClass: [],
methods: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
igdList: [],
isMain: 1,
};
this.selRec = [];
this.selNotRec = [];
this.resetForm("form");
this.$nextTick(() => {
this.$refs.igdRef.reset();
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
const data = JSON.parse(JSON.stringify(this.form));
// console.log({ data });
data.type = data.type.join(",");
if (data.id != null) {
updateDishes(data).then((response) => {
if (response.code === 200) {
this.msgSuccess("修改成功");
this.open = false;
this.$emit("onSuccess");
}
});
} else {
addDishes(data).then((response) => {
if (response.code === 200) {
this.msgSuccess("新增成功");
this.open = false;
this.$emit("onSuccess");
}
});
}
}
});
},
getSummaries(param) {
const { columns, data } = param;
// console.log(data);
return columns.reduce(
(arr, cur, idx) => {
if (idx > 1 && idx !== 7) {
if (idx === 6) {
arr[6] = (arr[3] * 4 + arr[4] * 9 + arr[5] * 4).toFixed(1);
} else {
arr[idx] = data.reduce((acc, dAcc) => {
if (idx === 2) {
return acc + parseFloat(dAcc.weight);
}
return parseFloat(
(
acc +
(dAcc[cur.property] * parseFloat(dAcc.weight)) / 100
).toFixed(1)
);
}, 0);
}
}
return arr;
},
["合计"]
);
},
handleClose(done) {
this.reset();
done();
},
},
};
</script>
<style lang="scss" scoped>
.edit_dishes_drawer_wrapper {
height: 100%;
display: flex;
flex-direction: column;
.content_detail {
flex: 1 1 0;
padding: 12px;
overflow: auto;
}
.dialog-footer {
flex: 0 0 45px;
display: inline-flex;
align-items: center;
justify-content: flex-end;
padding: 0 12px;
}
}
</style>
<style lang="scss">
#el-drawer__title {
& > span:focus {
outline: 0;
}
}
.el-transfer-panel__filter {
margin: 2px;
}
.el-transfer-panel__list.is-filterable {
padding-bottom: 28px;
}
.cus-unit {
display: inline-flex;
.el-input-number--mini {
width: 38px;
}
.el-input-number {
.el-input-number__decrease {
display: none;
}
.el-input-number__increase {
display: none;
}
.el-input {
width: 38px;
}
.el-input .el-input__inner {
padding: 0;
border-radius: 0;
border: unset;
border-bottom: 1px solid #dcdfe6;
}
}
.el-select {
.el-input__suffix {
display: none;
}
.el-input__inner {
padding: 0 4px;
/* border: unset; */
text-align: center;
}
}
}
.weight {
width: 70px;
.el-input .el-input__inner {
padding: 0 32px 0 4px;
}
}
.pagination-container {
margin-top: 0;
}
</style>

579
stdiet-ui/src/views/custom/dishes/index.vue
View File

@ -97,11 +97,7 @@
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table
v-loading="loading"
:data="dishesList"
@selection-change="handleSelectionChange"
>
<el-table v-loading="loading" :data="dishesList">
<el-table-column label="审核状态" align="center" width="80">
<template slot-scope="scope">
<el-tag
@ -177,247 +173,28 @@
/>
<!-- 添加或修改菜品对话框 -->
<el-drawer
:title="title"
:visible.sync="open"
:wrapperClosable="false"
size="50%"
:close-on-press-escape="false"
>
<div class="drawer_content">
<el-row class="content_detail">
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-col :span="24">
<el-form-item label="菜品名称" prop="name">
<el-input v-model="form.name" placeholder="请输入菜品名称" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="菜品种类" prop="dishClass">
<el-cascader
filterable
v-model="form.dishClass"
:options="dishClassOptions"
:props="{ expandTrigger: 'hover' }"
placeholder="请选择菜品种类"
></el-cascader>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="菜品类型" prop="type">
<el-select
v-model="form.type"
placeholder="请选择菜品类型"
multiple
>
<el-option
v-for="dict in typeOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="是否主食" prop="isMain">
<el-radio-group v-model="form.isMain">
<el-radio :label="0">是</el-radio>
<el-radio :label="1">否</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="食材" prop="ingIds">
<el-transfer
style="text-align: left; display: inline-block"
v-model="selIngIds"
size="mini"
filterable
:titles="['备选', '已选']"
:button-texts="['', '']"
:format="{
noChecked: '${total}',
hasChecked: '${checked}/${total}',
}"
@change="handleChange"
:data="ingDataList"
>
<el-select
class="transfer-footer"
slot="left-footer"
size="small"
filterable
v-model="ingType"
@change="handleOnTypeChange"
>
<el-option
v-for="dict in ingTypeOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
<EditDishesDrawer
ref="dishesDrawerRef"
:typeOptions="typeOptions"
:reviewStatusOptions="reviewStatusOptions"
:dishClassBigOptions="dishClassBigOptions"
:dishClassSmallOptions="dishClassSmallOptions"
:dishClassOptions="dishClassOptions"
@onSuccess="getList"
/>
</el-select>
<div
class="transfer-footer"
slot="right-footer"
size="small"
/>
</el-transfer>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="分量" prop="weight">
<el-table
:data="selTableData"
border
show-summary
size="mini"
:summary-method="getSummaries"
style="width: 100%"
>
<el-table-column prop="name" label="食材" align="center" />
<el-table-column label="通俗计量" align="center">
<template slot-scope="scope">
<span class="cus-unit">
<el-select size="mini" v-model="scope.row.cusWeight">
<el-option
v-for="dict in cusWeightOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="parseInt(dict.dictValue)"
/>
</el-select>
<el-select size="mini" v-model="scope.row.cusUnit">
<el-option
v-for="dict in cusUnitOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="parseInt(dict.dictValue)"
/>
</el-select>
</span>
</template>
</el-table-column>
<el-table-column prop="weight" label="重量(g)" align="center">
<template slot-scope="scope">
<el-input-number
class="weight"
v-model="scope.row.weight"
size="mini"
controls-position="right"
:min="0"
:step="5"
/>
</template>
</el-table-column>
<el-table-column
prop="proteinRatio"
label="蛋白质/100g"
align="center"
/>
<el-table-column
prop="fatRatio"
label="脂肪/100g"
align="center"
/>
<el-table-column
prop="carbonRatio"
label="碳水/100g"
align="center"
/>
<el-table-column label="热量" align="center">
<template slot-scope="scope">
{{
`${(
((scope.row.proteinRatio * scope.row.weight) / 100) *
4 +
((scope.row.fatRatio * scope.row.weight) / 100) * 9 +
((scope.row.carbonRatio * scope.row.weight) / 100) * 4
).toFixed(1)} kcal`
}}
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="推荐人群">
<el-tag
style="margin-right: 4px"
v-for="rec in selRec"
:key="rec"
type="success"
>
{{ rec }}
</el-tag>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="忌口人群">
<el-tag
style="margin-right: 4px"
v-for="notRec in selNotRec"
:key="notRec"
type="danger"
>
{{ notRec }}
</el-tag>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="审核状态" prop="reviewStatus">
<el-select
v-model="form.reviewStatus"
placeholder="请选择审核状态"
clearable
>
<el-option
v-for="dict in reviewStatusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="做法" prop="methods">
<el-input
v-model="form.methods"
type="textarea"
placeholder="请输入内容"
rows="4"
/>
</el-form-item>
</el-col>
</el-form>
</el-row>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</div>
</el-drawer>
</div>
</template>
<script>
import {
addDishes,
delDishes,
exportDishes,
getDishes,
listDishes,
updateDishes,
} from "@/api/custom/dishes";
import { listAllIngredient } from "@/api/custom/ingredient";
import { delDishes, exportDishes, listDishes } from "@/api/custom/dishes";
import AutoHideInfo from "@/components/AutoHideInfo";
import EditDishesDrawer from "./EditDishesDrawer";
export default {
name: "Dishes",
components: {
autohideinfo: AutoHideInfo,
EditDishesDrawer,
},
data() {
return {
@ -425,10 +202,6 @@ export default {
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
@ -437,13 +210,7 @@ export default {
dishesList: [],
// 审核状态
reviewStatusOptions: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
ingType: "1",
// 食材类别字典
ingTypeOptions: [],
// 远程数据缓存，预防新增的食材找不到
oriDataList: [],
// 备选食材列表
@ -456,14 +223,10 @@ export default {
selNotRec: [],
// 选中的食材id
selIngIds: [],
// 选中的食材分量列表
selTableData: [],
// 菜品类别字典
typeOptions: [],
// 通俗单位
cusUnitOptions: [],
//
cusWeightOptions: [],
dishClassOptions: [],
dishClassBigOptions: [],
dishClassSmallOptions: [],
@ -476,10 +239,6 @@ export default {
bigClass: null,
smallClass: null,
},
// 表单参数
form: {},
// 表单校验
rules: {},
//菜品种类查询种类
dishClassQueryParam: [],
};
@ -489,15 +248,7 @@ export default {
this.getDicts("cus_dishes_type").then((response) => {
this.typeOptions = response.data;
});
this.getDicts("cus_ing_type").then((response) => {
this.ingTypeOptions = response.data;
});
this.getDicts("cus_cus_unit").then((response) => {
this.cusUnitOptions = response.data;
});
this.getDicts("cus_cus_weight").then((response) => {
this.cusWeightOptions = response.data;
});
this.getDicts("cus_review_status").then((response) => {
this.reviewStatusOptions = response.data;
});
@ -582,12 +333,7 @@ export default {
.split(",")
.map((type) => this.selectDictLabel(this.typeOptions, type));
},
cusUnitFormat(row, column) {
return this.selectDictLabel(this.cusUnitOptions, row.type);
},
cusWeightFormat(row, column) {
return this.selectDictLabel(this.cusWeightOptions, row.cusWeight);
},
// 地域字典翻译
reviewStatusFormat(row, column) {
return this.selectDictLabel(this.reviewStatusOptions, row.area);
@ -607,35 +353,6 @@ export default {
}
return "";
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
type: [],
dishClass: [],
methods: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
igdList: [],
isMain: 1,
};
this.selIngIds = [];
this.selIngList = [];
this.selTableData = [];
this.oriDataList = [];
this.selRec = [];
this.selNotRec = [];
this.ingType = "1";
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
@ -647,101 +364,13 @@ export default {
this.dishClassQueryParam = [];
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
listAllIngredient({ type: this.ingType }).then((response) => {
this.open = true;
this.title = "添加菜品";
this.oriDataList = response.rows;
this.ingDataList = this.oriDataList.map((obj) => ({
key: obj.id,
label: obj.name,
}));
});
this.$refs.dishesDrawerRef.showDrawer();
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getDishes(id).then((response) => {
this.form = response.data;
this.form.dishClass = [this.form.bigClass, this.form.smallClass];
this.form.type = this.form.type ? this.form.type.split(",") : null;
this.form.igdList.forEach((obj) => {
this.selIngIds.push(obj.id);
this.selIngList.push({
key: obj.id,
label: obj.name,
});
this.selTableData.push(obj);
if (obj.rec) {
obj.rec.split(",").forEach((rec) => {
if (!this.selRec.includes(rec)) {
this.selRec.push(rec);
}
});
}
if (obj.notRec) {
obj.notRec.split(",").forEach((notRec) => {
if (!this.selNotRec.includes(notRec)) {
this.selNotRec.push(notRec);
}
});
}
});
listAllIngredient({ type: this.ingType }).then((res) => {
this.open = true;
this.title = "修改菜品";
this.oriDataList = res.rows.concat(this.form.igdList);
this.ingDataList = this.oriDataList.reduce((arr, cur) => {
if (!arr.some(({ key }) => key === cur.id)) {
arr.push({
key: cur.id,
label: cur.name,
});
}
return arr;
}, []);
});
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (!this.selTableData.length) {
this.$message.error("食材不能为空");
return;
}
const data = JSON.parse(JSON.stringify(this.form));
data.igdList = this.selTableData;
data.type = data.type.join(",");
if (data.id != null) {
updateDishes(data).then((response) => {
if (response.code === 200) {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
}
});
} else {
addDishes(data).then((response) => {
if (response.code === 200) {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
}
});
}
}
});
this.$refs.dishesDrawerRef.showDrawer(row.id);
},
/** 删除按钮操作 */
handleDelete(row) {
@ -776,178 +405,8 @@ export default {
})
.catch(function () {});
},
handleChange(value, direction, movedKeys) {
// console.log({
// oriIgdList: this.oriDataList,
// selIgdList: this.form.igdList,
// ingDataList: this.ingDataList,
// value,
// ingType: this.ingType,
// });
const newTableData = [];
this.selRec = [];
this.selNotRec = [];
this.selIngList = value.map((id) => {
// 搜索table中的数据
let tmpTableObj = this.selTableData.find((obj) => obj.id === id);
if (tmpTableObj) {
newTableData.push(tmpTableObj);
} else {
// 搜索请求的缓存数据
tmpTableObj = this.oriDataList.find((obj) => obj.id === id);
if (tmpTableObj) {
newTableData.push({
...tmpTableObj,
weight: 100,
cusWeight: 1,
cusUnit: 1,
});
}
}
if (tmpTableObj) {
if (tmpTableObj.rec) {
tmpTableObj.rec.split(",").forEach((rec) => {
if (!this.selRec.includes(rec)) {
this.selRec.push(rec);
}
});
}
if (tmpTableObj.notRec) {
tmpTableObj.notRec.split(",").forEach((notRec) => {
if (!this.selNotRec.includes(notRec)) {
this.selNotRec.push(notRec);
}
});
}
}
const tarObj = this.ingDataList.find(({ key }) => key === id);
return tarObj;
});
this.selTableData = newTableData;
},
handleOnTypeChange(value) {
listAllIngredient({ type: value }).then((res) => {
this.oriDataList = res.rows.concat(this.form.igdList);
this.ingDataList = this.oriDataList.reduce((arr, cur) => {
if (!arr.some(({ key }) => key === cur.id)) {
arr.push({
key: cur.id,
label: cur.name,
});
}
return arr;
}, []);
});
},
getSummaries(param) {
const { columns, data } = param;
// console.log(data);
return columns.reduce(
(arr, cur, idx) => {
if (idx > 1) {
if (idx === 6) {
arr[6] = arr[3] * 4 + arr[4] * 9 + arr[5] * 4 + " kcal";
} else {
arr[idx] = data.reduce((acc, dAcc) => {
if (idx === 2) {
return acc + parseFloat(dAcc.weight);
}
return parseFloat(
(
acc +
(dAcc[cur.property] * parseFloat(dAcc.weight)) / 100
).toFixed(1)
);
}, 0);
}
}
return arr;
},
["合计"]
);
},
},
};
</script>
<style rel="stylesheet/scss" lang="scss">
#el-drawer__title {
& > span:focus {
outline: 0;
}
}
.el-transfer-panel__filter {
margin: 2px;
}
.el-transfer-panel__list.is-filterable {
padding-bottom: 28px;
}
.cus-unit {
display: inline-flex;
.el-input-number--mini {
width: 38px;
}
.el-input-number {
.el-input-number__decrease {
display: none;
}
.el-input-number__increase {
display: none;
}
.el-input {
width: 38px;
}
.el-input .el-input__inner {
padding: 0;
border-radius: 0;
border: unset;
border-bottom: 1px solid #dcdfe6;
}
}
.el-select {
.el-input__suffix {
display: none;
}
.el-input__inner {
padding: 0 4px;
/* border: unset; */
text-align: center;
}
}
}
.weight {
width: 70px;
.el-input .el-input__inner {
padding: 0 32px 0 4px;
}
}
.drawer_content {
height: 100%;
display: flex;
flex-direction: column;
.content_detail {
flex: 1 1 0;
padding: 12px;
overflow: auto;
}
.dialog-footer {
flex: 0 0 45px;
display: inline-flex;
align-items: center;
justify-content: flex-end;
padding: 0 12px;
}
}
</style>

10
stdiet-ui/src/views/custom/ingredient/index.vue
View File

@ -146,6 +146,16 @@
</el-tag>
</template>
</el-table-column>
<el-table-column label="图片" align="center" width="100">
<template slot-scope="scope">
<img
width="100"
height="auto"
:src="scope.row.imgList[0] ? scope.row.imgList[0].previewUrl : ''"
:alt="scope.row.imgList[0] ? scope.row.imgList[0].name : ''"
/>
</template>
</el-table-column>
<el-table-column
label="食材名称"
align="center"

122
stdiet-ui/src/views/custom/recipesBuild/InfoView/PieChart/index.vue
View File

@ -20,6 +20,16 @@
@click="handleOnViewChange(1)"
/>
</el-tooltip>
<el-tooltip effect="dark" content="质量分析" placement="top">
<em
:class="[
'iconfont',
'icon-canshuiconyouhua-',
{ sel_icon: view === 2 },
]"
@click="handleOnViewChange(2)"
/>
</el-tooltip>
</div>
<div v-if="view === 0" class="table_zone">
<el-table
@ -80,21 +90,23 @@ export default {
},
},
data() {
return {
chart: null,
nameDict: {
const nameDict = {
p: "蛋白质",
f: "脂肪",
c: "碳水",
},
menuDict: {
};
const menuDict = {
1: "早餐",
2: "早加餐",
3: "午餐",
4: "午加餐",
5: "晚餐",
6: "晚加餐",
},
};
return {
chart: null,
nameDict,
menuDict,
typeDict: {
Weight: "摄入量",
Rate: "供能比",
@ -122,6 +134,50 @@ export default {
// console.log(mData);
return mData;
},
curNameDict() {
switch (this.view) {
case 0:
return this.nameDict;
case 1:
return this.menuDict;
case 2:
return this.menuDict;
}
},
curTitle() {
switch (this.view) {
case 0:
return "营养分析";
case 1:
return "热量分析";
case 2:
return "质量分析";
}
},
curTotalText() {
switch (this.view) {
case 1:
return "总热量约";
case 2:
return "总质量";
}
},
curTotalName() {
switch (this.view) {
case 1:
return "totalHeat";
case 2:
return "totalWeight";
}
},
curUnit() {
switch (this.view) {
case 1:
return "千卡";
case 2:
return "克";
}
},
...mapState(["recipesData"]),
},
mounted() {
@ -144,12 +200,22 @@ export default {
backToAll() {
this.resetCurrentDay({ currentDay: -1 });
},
getDataName(dim) {
switch (this.view) {
case 0:
return `${dim}Heat`;
case 1:
return `heat${dim}`;
case 2:
return `weight${dim}`;
}
},
updateChart(data) {
// console.log(data);
console.log(data);
this.chart.clear();
const option = {
title: {
text: !this.view ? "营养分析" : "热量分析",
text: this.curTitle,
subtext: data.name,
},
tooltip: {
@ -170,16 +236,22 @@ export default {
`摄入热量：${value.toFixed(1)}千卡`,
`供能比：${percent}%`,
].join("</br>")
: [
: this.view === 1
? [
`${marker} ${name}`,
`热量：${data[`heat${dim}`].toFixed(1)}千卡`,
`供能比：${percent}%`,
].join("</br>")
: [
`${marker} ${name}`,
`质量：${data[`weight${dim}`].toFixed(1)}克`,
`占比：${percent}%`,
].join("</br>");
},
},
graphic:
this.view === 1
? [
graphic: !this.view
? []
: [
{
type: "group",
top: 60,
@ -189,7 +261,7 @@ export default {
{
type: "text",
style: {
text: "总热量约",
text: this.curTotalText,
fill: "#606266",
},
},
@ -199,8 +271,10 @@ export default {
left: 8,
style: {
text: `${
data.totalHeat ? data.totalHeat.toFixed(1) : 0
}千卡`,
data[`${this.curTotalName}`]
? data[`${this.curTotalName}`].toFixed(1)
: 0
} ${this.curUnit}`,
font: '14px "Microsoft YaHei", sans-serif',
},
},
@ -211,15 +285,15 @@ export default {
top: 36,
right: 10,
silent: true,
children: Object.keys(this.menuDict).reduce((arr, cur) => {
const tarData = data[`heat${cur}`];
children: Object.keys(this.curNameDict).reduce((arr, cur) => {
const tarData = data[this.getDataName(cur)];
if (tarData) {
arr.push({
type: "text",
top: arr.length * 20,
right: 10,
style: {
text: `${this.menuDict[cur]}：${tarData.toFixed(1)}`,
text: `${this.curNameDict[cur]}：${tarData.toFixed(1)}`,
fill: "#606266",
},
});
@ -227,23 +301,19 @@ export default {
return arr;
}, []),
},
]
: [],
],
series: [
{
name: data.name,
type: "pie",
radius: [0, !this.view ? 40 : 60],
center: ["50%", "55%"],
data: (!this.view
? Object.keys(this.nameDict)
: Object.keys(this.menuDict)
).reduce((arr, dim) => {
data: Object.keys(this.curNameDict).reduce((arr, dim) => {
if (!this.view || data[`heat${dim}`]) {
arr.push({
dim,
value: !this.view ? data[`${dim}Heat`] : data[`heat${dim}`],
name: (!this.view ? this.nameDict : this.menuDict)[dim],
value: data[this.getDataName(dim)],
name: this.curNameDict[dim],
oriData: data,
});
}

147
stdiet-ui/src/views/custom/recipesBuild/VerifyView/IngredientSearchCom/index.vue Normal file
View File

@ -0,0 +1,147 @@
<template>
<div class="ingredient_search_com_wrapper">
<section class="header">
<el-input
v-model="keyword"
size="mini"
class="search"
placeholder="请输入食材"
clearable
@keydown.enter.native="handleOnSearch"
/>
<el-button
size="mini"
type="primary"
class="search_btn"
@click="handleOnSearch"
>
搜索
</el-button>
</section>
<section class="content">
<el-popover
v-for="item in searchResults"
:key="item.name"
:title="item.name"
placement="top"
trigger="hover"
>
<el-button
type="text"
v-for="dData in item.data"
:key="dData.day"
@click="handleOnDayClick(item, dData.num)"
>{{ `第${dData.day}天` }}</el-button
>
<span
slot="reference"
:class="`item ${selectedIgd === item.id ? 'selected_item' : ''} `"
@click="handleOnIgdClick(item)"
>{{ item.name }}
</span>
</el-popover>
</section>
</div>
</template>
<script>
import { createNamespacedHelpers } from "vuex";
const { mapGetters } = createNamespacedHelpers("recipes");
export default {
name: "IngredientSearchCom",
data() {
return {
keyword: "",
searchResults: [],
};
},
props: ["selectedIgd"],
computed: {
...mapGetters(["igdTypeData"]),
},
methods: {
handleOnSearch() {
if (!this.keyword) {
return;
}
this.searchResults = this.igdTypeData.reduce((arr, igd) => {
if (igd.name.includes(this.keyword)) {
arr.push(igd);
}
return arr;
}, []);
// console.log(this.searchResults);
},
handleOnDayClick(data, numDay) {
const { name, id } = data;
this.$emit("onDayClick", { name, id, numDay });
},
handleOnIgdClick(data) {
const { name, id } = data;
this.$emit("onClick", { name, id });
},
reset() {
this.keyword = "";
this.searchResults = [];
},
},
};
</script>
<style lang="scss" scoped>
/deep/ :focus {
outline: 0;
}
.ingredient_search_com_wrapper {
.header {
display: flex;
align-items: center;
padding: 4px;
.label {
width: 38px;
}
.search {
flex: 1;
}
.search_btn {
margin-left: 4px;
}
}
.content {
margin: 8px 0;
.title {
font-size: 14px;
color: #8c8c8c;
padding: 4px 0;
}
.item {
font-size: 14px;
margin: 4px;
border-radius: 8px;
cursor: pointer;
display: inline-block;
color: #262626;
border: 1px solid #8c8c8c;
padding: 3px 8px;
word-break: normal;
transition: all 0.3s;
&:hover {
color: white;
background: #d96969;
border-color: #d96969;
}
}
.selected_item {
color: white;
background: #d96969;
border-color: #d96969;
font-weight: bold;
}
}
}
</style>

132
stdiet-ui/src/views/custom/recipesBuild/VerifyView/PhysicalSignCom/index.vue Normal file
View File

@ -0,0 +1,132 @@
<template>
<div class="physical_sign_com_wrapper">
<section class="content">
<span
v-for="item in verifyNotRecData"
:key="item.name"
:class="`item ${
selectedNotRecName === item.name ? 'selected_item' : ''
} `"
@click="handleOnNameClick(item)"
>{{ item.name }}
</span>
<div class="divider" v-if="!!igdDatas.length" />
<el-popover
v-for="item in igdDatas"
:key="item.name"
:title="item.name"
placement="top"
trigger="hover"
>
<el-button
type="text"
v-for="dData in item.data"
:key="dData.day"
@click="handleOnDayClick(item, dData.num)"
>{{ `第${dData.day}天` }}</el-button
>
<span
slot="reference"
:class="`item ${selectedIgd === item.id ? 'selected_item' : ''} `"
@click="handleOnIgdClick(item)"
>{{ item.name }}
</span>
</el-popover>
</section>
</div>
</template>
<script>
import { createNamespacedHelpers } from "vuex";
const { mapGetters } = createNamespacedHelpers("recipes");
export default {
name: "PhysicalSignCom",
data() {
return {
selectedNotRecName: "",
igdDatas: [],
};
},
props: ["selectedIgd"],
computed: {
...mapGetters(["verifyNotRecData"]),
},
methods: {
handleOnNameClick(obj) {
const { name, data } = obj;
if (this.selectedNotRecName === name) {
this.selectedNotRecName = "";
this.igdDatas = [];
} else {
this.selectedNotRecName = name;
this.igdDatas = data;
}
},
handleOnDayClick(data, numDay) {
const { name, id } = data;
this.$emit("onDayClick", { name, id, numDay });
},
handleOnIgdClick(data) {
const { name, id } = data;
this.$emit("onClick", { name, id });
},
reset() {
this.selectedNotRecName = "";
this.igdDatas = [];
},
},
};
</script>
<style lang="scss" scoped>
/deep/ :focus {
outline: 0;
}
.physical_sign_com_wrapper {
.header {
display: flex;
align-items: center;
padding: 4px;
}
.content {
margin: 8px 0;
.title {
font-size: 14px;
color: #8c8c8c;
padding: 4px 0;
}
.divider {
border-bottom: 1px solid #e6ebf5;
margin: 12px 0;
}
.item {
font-size: 14px;
margin: 4px;
border-radius: 8px;
cursor: pointer;
display: inline-block;
color: #262626;
border: 1px solid #8c8c8c;
padding: 3px 8px;
word-break: normal;
transition: all 0.3s;
&:hover {
color: white;
background: #d96969;
border-color: #d96969;
}
}
.selected_item {
color: white;
background: #d96969;
border-color: #d96969;
font-weight: bold;
}
}
}
</style>

134
stdiet-ui/src/views/custom/recipesBuild/VerifyView/index.vue
View File

@ -1,33 +1,29 @@
<template>
<div class="verify_view_wrapper">
<div>病理忌口</div>
<div class="content">
<span
:class="`item ${
selectedNotRec.includes(item.name) ? 'selected_item' : ''
} `"
v-for="item in verifyNotRecData"
:key="item.name"
@click="handleOnClick(item)"
>{{ item.name }}</span
<el-tabs
v-model="activeName"
@tab-click="handleOnTabClick"
:style="{ 'margin-right': '16px' }"
>
</div>
<div style="margin: 24px 0 8px 0">涉及食材</div>
<div v-for="key in Object.keys(igdTypeDetial).reverse()" :key="key">
<div style="font-size: 14px; color: #8c8c8c">{{ igdTypeDict[key] }}</div>
<div class="content">
<span
:class="`item ${selectedIgd === item.id ? 'selected_item' : ''} `"
v-for="item in igdTypeDetial[key]"
:key="item.id"
@click="handleOnIgdClick(item)"
>{{ item.name }}
</span>
</div>
</div>
<el-tab-pane label="病理忌口" name="0">
<PhysicalSignCom
:selectedIgd.sync="selectedIgd"
@onDayClick="handleOnDayClick"
@onClick="handleOnClick"
/>
</el-tab-pane>
<el-tab-pane label="食材忌口" name="1">
<IngredientSearchCom
:selectedIgd.sync="selectedIgd"
@onDayClick="handleOnDayClick"
@onClick="handleOnClick"
/>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import VueScrollTo from "vue-scrollto";
import { createNamespacedHelpers } from "vuex";
const {
mapActions,
@ -35,63 +31,43 @@ const {
mapGetters,
mapMutations,
} = createNamespacedHelpers("recipes");
import IngredientSearchCom from "./IngredientSearchCom";
import PhysicalSignCom from "./PhysicalSignCom";
export default {
name: "VerifyView",
data() {
return {
selectedNotRec: [],
activeName: "0",
selectedIgd: 0,
};
},
components: { IngredientSearchCom, PhysicalSignCom },
computed: {
...mapGetters(["verifyNotRecData", "igdTypeDict", "igdTypeDetial"]),
...mapGetters(["verifyNotRecData"]),
},
methods: {
handleOnClick(data) {
if (this.selectedIgd !== 0) {
this.selectedIgd = 0;
this.setNotRecIgds({ data: [] });
}
if (this.selectedNotRec.some((str) => data.name === str)) {
this.selectedNotRec = this.selectedNotRec.filter(
(str) => str !== data.name
);
} else {
this.selectedNotRec.push(data.name);
this.selectedNotRec = JSON.parse(JSON.stringify(this.selectedNotRec));
}
const notRecIgds = this.selectedNotRec.reduce((arr, cur) => {
const tarData = this.verifyNotRecData.find((obj) => obj.name === cur);
if (tarData) {
tarData.data.forEach((obj) => {
if (!arr.includes(obj.igdId)) {
arr.push(obj.igdId);
}
});
}
return arr;
}, []);
// console.log({
// data,
// notRecIgds,
// verifyNotRecData: this.verifyNotRecData,
// });
this.setNotRecIgds({ data: notRecIgds });
handleOnTabClick(tab) {
this.activeName = tab.name;
},
handleOnIgdClick(data) {
if (this.selectedNotRec.length > 0) {
this.selectedNotRec = [];
this.setNotRecIgds({ data: [] });
handleOnDayClick(data) {
console.log(data);
const { id, numDay } = data;
if (this.selectedIgd !== id) {
this.selectedIgd = id;
this.setNotRecIgds({ data: [this.selectedIgd] });
}
this.setCurrentDay({ currentDay: numDay });
VueScrollTo.scrollTo(`#recipes${numDay}`, 500, {
container: "#recipes_content",
});
},
handleOnClick(data) {
this.selectedIgd = data.id === this.selectedIgd ? 0 : data.id;
this.setNotRecIgds({ data: [this.selectedIgd] });
},
...mapMutations(["setNotRecIgds"]),
...mapMutations(["setNotRecIgds", "setCurrentDay"]),
},
};
</script>
@ -99,33 +75,5 @@ export default {
.verify_view_wrapper {
height: calc(100vh - 32px);
overflow: auto;
.content {
margin: 8px 0;
.item {
font-size: 14px;
margin: 4px;
border-radius: 8px;
cursor: pointer;
display: inline-block;
color: #262626;
border: 1px solid #8c8c8c;
padding: 3px 8px;
word-break: normal;
transition: all 0.3s;
&:hover {
color: white;
background: #d96969;
border-color: #d96969;
}
}
.selected_item {
color: white;
background: #d96969;
border-color: #d96969;
font-weight: bold;
}
}
}
</style>