新增忌口编写功能
This commit is contained in:
huangdeliang
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div class="simple_igd_view_wrapper">
|
||||
<el-row :gutter="12">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="名称" prop="name" size="mini">
|
||||
<el-input
|
||||
v-model="queryParams.name"
|
||||
placeholder="请输入食材名称"
|
||||
clearable
|
||||
size="mini"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="类别" prop="type" size="mini" width="130px">
|
||||
<el-select
|
||||
v-model="queryParams.type"
|
||||
placeholder="请选择食材类别"
|
||||
clearable
|
||||
size="mini"
|
||||
>
|
||||
<el-option
|
||||
v-for="dict in ingTypeOptions"
|
||||
:key="dict.dictValue"
|
||||
:label="dict.dictLabel"
|
||||
:value="dict.dictValue"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item size="mini">
|
||||
<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-col>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<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 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: "SimpleIngredientListView2",
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
total: 0,
|
||||
ingredientList: [],
|
||||
ingTypeOptions: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: null,
|
||||
type: null,
|
||||
area: null,
|
||||
reviewStatus: "yes",
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getDicts("cus_ing_type").then((response) => {
|
||||
this.ingTypeOptions = response.data;
|
||||
});
|
||||
},
|
||||
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.ingTypeOptions, row.type);
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
handleOnSelect(data) {
|
||||
this.$emit("onSelect", data);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.simple_igd_view_wrapper {
|
||||
/deep/ .el-input {
|
||||
width: 130px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
103
stdiet-ui/src/components/BodySignView/ACFCom2/index.vue
Normal file
103
stdiet-ui/src/components/BodySignView/ACFCom2/index.vue
Normal file
@ -0,0 +1,103 @@
|
||||
<template>
|
||||
<div class="avoid_certain_food_com_wrapper">
|
||||
<el-popover
|
||||
placement="right"
|
||||
trigger="click"
|
||||
width="600"
|
||||
title="忌口"
|
||||
@hide="handleOnHide"
|
||||
>
|
||||
<SimpleIngredientListView @onSelect="handleOnSelect" />
|
||||
<span slot="reference" class="trigger">忌口： </span>
|
||||
</el-popover>
|
||||
<div class="content">
|
||||
<el-tag
|
||||
v-for="item in data"
|
||||
:key="item.id"
|
||||
closable
|
||||
size="mini"
|
||||
type="danger"
|
||||
@close="handleOnClose(item)"
|
||||
>
|
||||
{{ item.name }}
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { createNamespacedHelpers } from "vuex";
|
||||
const { mapMutations } = createNamespacedHelpers("recipes");
|
||||
import SimpleIngredientListView from "./SimpleIngredientListView";
|
||||
import { editPhysicalSigns } from "@/api/custom/healthy";
|
||||
|
||||
export default {
|
||||
name: "ACFCom2",
|
||||
props: ["value", "id"],
|
||||
components: {
|
||||
SimpleIngredientListView,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
value(val) {
|
||||
this.data = val;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
handleOnSelect(data) {
|
||||
// console.log(data);
|
||||
if (!this.data.some((obj) => obj.id === data.id)) {
|
||||
this.data.push({
|
||||
id: data.id,
|
||||
name: data.name,
|
||||
});
|
||||
// console.log(this.data);
|
||||
this.$emit("update:value", this.data);
|
||||
this.updateAvoidFoodIds({
|
||||
avoidFoodIds: this.data.map((obj) => obj.id),
|
||||
});
|
||||
}
|
||||
},
|
||||
handleOnClose(data) {
|
||||
// console.log(data);
|
||||
this.data = this.data.filter((obj) => data.id !== obj.id);
|
||||
this.$emit("update:value", this.data);
|
||||
this.updateAvoidFoodIds({ avoidFoodIds: this.data.map((obj) => obj.id) });
|
||||
// 删除后更新
|
||||
this.handleOnHide();
|
||||
},
|
||||
handleOnHide() {
|
||||
editPhysicalSigns({ id: this.id, avoidFood: this.data }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success("忌口修改成功");
|
||||
}
|
||||
});
|
||||
},
|
||||
...mapMutations(["updateAvoidFoodIds"]),
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.avoid_certain_food_com_wrapper {
|
||||
display: flex;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.trigger {
|
||||
font-size: 14px;
|
||||
width: 42px;
|
||||
color: #8c8c8c;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.content {
|
||||
flex: 1;
|
||||
|
||||
& > span {
|
||||
margin: 0 4px 4px 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
99
stdiet-ui/src/components/BodySignView/RemarkCom2/index.vue
Normal file
99
stdiet-ui/src/components/BodySignView/RemarkCom2/index.vue
Normal file
@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<div class="simple_remark_com_wrapper">
|
||||
<el-popover
|
||||
placement="right"
|
||||
trigger="click"
|
||||
width="400"
|
||||
title="备注"
|
||||
@hide="handleOnHide"
|
||||
>
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="nData"
|
||||
rows="6"
|
||||
placeholder="请输入备注信息"
|
||||
maxlength="300"
|
||||
show-word-limit
|
||||
/>
|
||||
<span slot="reference" class="trigger">备注： </span>
|
||||
</el-popover>
|
||||
<div class="content">
|
||||
<span v-if="newLine">
|
||||
<div v-for="v in mValue" :key="v">
|
||||
{{ v }}
|
||||
</div>
|
||||
</span>
|
||||
<span v-else>{{ mValue }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editPhysicalSigns } from "@/api/custom/healthy";
|
||||
|
||||
export default {
|
||||
name: "RemarkCom2",
|
||||
props: ["value", "id"],
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
newLine: false,
|
||||
nData: "",
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
value(val) {
|
||||
this.nData = val;
|
||||
},
|
||||
nData(val) {
|
||||
this.$emit("updata:value", val);
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
mValue: function () {
|
||||
if (
|
||||
this.nData &&
|
||||
typeof this.nData === "string" &&
|
||||
(this.nData.includes("</br>") || this.nData.includes("\n"))
|
||||
) {
|
||||
this.newLine = true;
|
||||
if (this.nData.includes("</br>")) {
|
||||
return this.nData.split("</br>");
|
||||
} else if (this.nData.includes("\n")) {
|
||||
return this.nData.split("\n");
|
||||
}
|
||||
this.newLine = false;
|
||||
return this.nData;
|
||||
}
|
||||
this.newLine = false;
|
||||
return this.nData;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
handleOnHide() {
|
||||
// console.log("handleOnHide");
|
||||
editPhysicalSigns({ id: this.id, remark: this.nData }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success("备注修改成功");
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.simple_remark_com_wrapper {
|
||||
display: flex;
|
||||
margin-bottom: 8px;
|
||||
font-size: 14px;
|
||||
|
||||
.trigger {
|
||||
width: 42px;
|
||||
color: #8c8c8c;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.content {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,46 +1,23 @@
|
||||
<template>
|
||||
<div class="body_sign_view_wrapper">
|
||||
<div>
|
||||
<h2>{{ this.data.name }}</h2>
|
||||
<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"
|
||||
:title="con.title"
|
||||
:key="con.title"
|
||||
:value="data[con.value]"
|
||||
extraclass="text-info-extra"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 备注弹窗 -->
|
||||
<el-dialog title="修改备注" :visible.sync="open" width="480px">
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="data.remarks"
|
||||
rows="6"
|
||||
placeholder="请输入备注信息"
|
||||
maxlength="300"
|
||||
show-word-limit
|
||||
<h2>{{ data.name }}</h2>
|
||||
<div class="msg-info" v-for="(info, idx) in basicInfo" :key="idx">
|
||||
<text-info
|
||||
v-for="con in info"
|
||||
:title="con.title"
|
||||
:key="con.title"
|
||||
:value="data[con.value]"
|
||||
extraclass="text-info-extra"
|
||||
/>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
<el-button @click="onClosed">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<RemarkCom2 v-if="dev" :value.sync="data.remark" :id="data.id" />
|
||||
<ACFCOM2 v-if="dev" :value.sync="data.avoidFood" :id="data.id" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import TextInfo from "@/components/TextInfo";
|
||||
import { editPhysicalSigns } from "@/api/custom/healthy";
|
||||
import ACFCOM2 from "./ACFCom2";
|
||||
import RemarkCom2 from "./RemarkCom2";
|
||||
|
||||
export default {
|
||||
name: "BodySignView",
|
||||
@ -56,6 +33,8 @@ export default {
|
||||
},
|
||||
components: {
|
||||
"text-info": TextInfo,
|
||||
ACFCOM2,
|
||||
RemarkCom2,
|
||||
},
|
||||
data() {
|
||||
const basicInfo = [
|
||||
@ -110,32 +89,11 @@ export default {
|
||||
basicInfo.splice(6, 0, [
|
||||
{ title: "不运动总热量", value: "notSportHeat" },
|
||||
]);
|
||||
basicInfo.splice(basicInfo.length, 0, [
|
||||
{ title: "备注", value: "remarks" },
|
||||
]);
|
||||
}
|
||||
return {
|
||||
basicInfo,
|
||||
open: false,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleOnRemark() {
|
||||
this.open = true;
|
||||
},
|
||||
onClosed() {
|
||||
this.open = false;
|
||||
},
|
||||
submit() {
|
||||
const { id, remarks } = this.data;
|
||||
editPhysicalSigns({ id, remarks }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success("修改成功");
|
||||
this.open = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div class="simple_igd_view_wrapper">
|
||||
<el-row :gutter="12">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="名称" prop="name" size="mini">
|
||||
<el-input
|
||||
v-model="queryParams.name"
|
||||
placeholder="请输入食材名称"
|
||||
clearable
|
||||
size="mini"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="类别" prop="type" size="mini" width="130px">
|
||||
<el-select
|
||||
v-model="queryParams.type"
|
||||
placeholder="请选择食材类别"
|
||||
clearable
|
||||
size="mini"
|
||||
>
|
||||
<el-option
|
||||
v-for="dict in ingTypeOptions"
|
||||
:key="dict.dictValue"
|
||||
:label="dict.dictLabel"
|
||||
:value="dict.dictValue"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item size="mini">
|
||||
<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-col>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<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 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: "SimpleIngredientListView",
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
total: 0,
|
||||
ingredientList: [],
|
||||
ingTypeOptions: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: null,
|
||||
type: null,
|
||||
area: null,
|
||||
reviewStatus: "yes",
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getDicts("cus_ing_type").then((response) => {
|
||||
this.ingTypeOptions = response.data;
|
||||
});
|
||||
},
|
||||
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.ingTypeOptions, row.type);
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
handleOnSelect(data) {
|
||||
this.$emit("onSelect", data);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.simple_igd_view_wrapper {
|
||||
/deep/ .el-input {
|
||||
width: 130px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
107
stdiet-ui/src/components/HealthyView/ACFCom/index.vue
Normal file
107
stdiet-ui/src/components/HealthyView/ACFCom/index.vue
Normal file
@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<div class="avoid_certain_food_com_wrapper">
|
||||
<el-popover
|
||||
placement="right"
|
||||
trigger="click"
|
||||
width="600"
|
||||
title="忌口"
|
||||
@hide="handleOnHide"
|
||||
>
|
||||
<SimpleIngredientListView @onSelect="handleOnSelect" />
|
||||
<span slot="reference" class="trigger">忌口： </span>
|
||||
</el-popover>
|
||||
<div class="content">
|
||||
<el-tag
|
||||
v-for="item in data"
|
||||
:key="item.id"
|
||||
closable
|
||||
size="mini"
|
||||
type="danger"
|
||||
@close="handleOnClose(item)"
|
||||
>
|
||||
{{ item.name }}
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { createNamespacedHelpers } from "vuex";
|
||||
const {
|
||||
mapActions,
|
||||
mapState,
|
||||
mapMutations,
|
||||
mapGetters,
|
||||
} = createNamespacedHelpers("recipes");
|
||||
import SimpleIngredientListView from "./SimpleIngredientListView";
|
||||
import { updateHealthy } from "@/api/custom/healthy";
|
||||
export default {
|
||||
name: "ACFCom",
|
||||
props: ["value", "id"],
|
||||
components: {
|
||||
SimpleIngredientListView,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
value(val) {
|
||||
this.data = val;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
handleOnSelect(data) {
|
||||
// console.log(data);
|
||||
if (!this.data.some((obj) => obj.id === data.id)) {
|
||||
this.data.push({
|
||||
id: data.id,
|
||||
name: data.name,
|
||||
});
|
||||
// console.log(this.data);
|
||||
this.$emit("update:value", this.data);
|
||||
this.updateAvoidFoodIds({
|
||||
avoidFoodIds: this.data.map((obj) => obj.id),
|
||||
});
|
||||
}
|
||||
},
|
||||
handleOnClose(data) {
|
||||
// console.log(data);
|
||||
this.data = this.data.filter((obj) => data.id !== obj.id);
|
||||
this.$emit("update:value", this.data);
|
||||
this.updateAvoidFoodIds({ avoidFoodIds: this.data.map((obj) => obj.id) });
|
||||
// 删除后更新
|
||||
this.handleOnHide();
|
||||
},
|
||||
handleOnHide() {
|
||||
updateHealthy({ id: this.id, avoidFood: this.data }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success("忌口修改成功");
|
||||
}
|
||||
});
|
||||
},
|
||||
...mapMutations(["updateAvoidFoodIds"]),
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.avoid_certain_food_com_wrapper {
|
||||
display: flex;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.trigger {
|
||||
font-size: 14px;
|
||||
width: 42px;
|
||||
color: #8c8c8c;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.content {
|
||||
flex: 1;
|
||||
|
||||
& > span {
|
||||
margin: 0 4px 4px 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
99
stdiet-ui/src/components/HealthyView/RemarkCom/index.vue
Normal file
99
stdiet-ui/src/components/HealthyView/RemarkCom/index.vue
Normal file
@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<div class="simple_remark_com_wrapper">
|
||||
<el-popover
|
||||
placement="right"
|
||||
trigger="click"
|
||||
width="400"
|
||||
title="备注"
|
||||
@hide="handleOnHide"
|
||||
>
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="nData"
|
||||
rows="6"
|
||||
placeholder="请输入备注信息"
|
||||
maxlength="300"
|
||||
show-word-limit
|
||||
/>
|
||||
<span slot="reference" class="trigger">备注： </span>
|
||||
</el-popover>
|
||||
<div class="content">
|
||||
<span v-if="newLine">
|
||||
<div v-for="v in mValue" :key="v">
|
||||
{{ v }}
|
||||
</div>
|
||||
</span>
|
||||
<span v-else>{{ mValue }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { updateHealthy } from "@/api/custom/healthy";
|
||||
|
||||
export default {
|
||||
name: "RemarkCom",
|
||||
props: ["value", "id"],
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
newLine: false,
|
||||
nData: "",
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
value(val) {
|
||||
this.nData = val;
|
||||
},
|
||||
nData(val) {
|
||||
this.$emit("updata:value", val);
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
mValue: function () {
|
||||
if (
|
||||
this.nData &&
|
||||
typeof this.nData === "string" &&
|
||||
(this.nData.includes("</br>") || this.nData.includes("\n"))
|
||||
) {
|
||||
this.newLine = true;
|
||||
if (this.nData.includes("</br>")) {
|
||||
return this.nData.split("</br>");
|
||||
} else if (this.nData.includes("\n")) {
|
||||
return this.nData.split("\n");
|
||||
}
|
||||
this.newLine = false;
|
||||
return this.nData;
|
||||
}
|
||||
this.newLine = false;
|
||||
return this.nData;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
handleOnHide() {
|
||||
// console.log("handleOnHide");
|
||||
updateHealthy({ id: this.id, remark: this.nData }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success("备注修改成功");
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.simple_remark_com_wrapper {
|
||||
display: flex;
|
||||
margin-bottom: 8px;
|
||||
font-size: 14px;
|
||||
|
||||
.trigger {
|
||||
width: 42px;
|
||||
color: #8c8c8c;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.content {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -2,14 +2,6 @@
|
||||
<div class="health_view_wrapper">
|
||||
<div>
|
||||
<h2>{{ this.data.name }}</h2>
|
||||
<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="i in info"
|
||||
@ -19,6 +11,8 @@
|
||||
extraclass="text-info-extra"
|
||||
/>
|
||||
</div>
|
||||
<RemarkCom v-if="dev" :value.sync="data.remark" :id="data.id" />
|
||||
<ACFCom v-if="dev" :value.sync="data.avoidFood" :id="data.id" />
|
||||
</div>
|
||||
<el-collapse>
|
||||
<el-collapse-item
|
||||
@ -47,27 +41,12 @@
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
|
||||
<!-- 备注弹窗 -->
|
||||
<el-dialog title="修改备注" :visible.sync="open" width="480px">
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="data.remark"
|
||||
rows="6"
|
||||
placeholder="请输入备注信息"
|
||||
maxlength="300"
|
||||
show-word-limit
|
||||
/>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
<el-button @click="onClosed">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import TextInfo from "@/components/TextInfo";
|
||||
import { updateHealthy } from "@/api/custom/healthy";
|
||||
import ACFCom from "./ACFCom";
|
||||
import RemarkCom from "./RemarkCom";
|
||||
|
||||
export default {
|
||||
name: "HealthyView",
|
||||
@ -83,6 +62,8 @@ export default {
|
||||
},
|
||||
components: {
|
||||
"text-info": TextInfo,
|
||||
ACFCom,
|
||||
RemarkCom,
|
||||
},
|
||||
data() {
|
||||
const basicInfo = [
|
||||
@ -107,13 +88,9 @@ export default {
|
||||
basicInfo.splice(6, 0, [
|
||||
{ title: "不运动总热量", value: "notSportHeat" },
|
||||
]);
|
||||
basicInfo.splice(basicInfo.length, 0, [
|
||||
{ title: "备注", value: "remark" },
|
||||
]);
|
||||
}
|
||||
|
||||
return {
|
||||
open: false,
|
||||
basicInfo,
|
||||
healthyInvestigate: [
|
||||
{
|
||||
@ -243,21 +220,6 @@ export default {
|
||||
getImgUrl(path) {
|
||||
return `${window.location.origin}${path}`;
|
||||
},
|
||||
handleOnRemark() {
|
||||
this.open = true;
|
||||
},
|
||||
onClosed() {
|
||||
this.open = false;
|
||||
},
|
||||
submit() {
|
||||
const { id, remark } = this.data;
|
||||
updateHealthy({ id, remark }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success("修改成功");
|
||||
this.open = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -29,8 +29,10 @@ export default {
|
||||
} else if (this.value.includes("\n")) {
|
||||
return this.value.split("\n");
|
||||
}
|
||||
this.newLine = false;
|
||||
return this.value;
|
||||
}
|
||||
this.newLine = false;
|
||||
return this.value;
|
||||
},
|
||||
},
|
||||
|
||||
@ -39,6 +39,7 @@ const oriState = {
|
||||
//
|
||||
leftShow: false,
|
||||
notRecIgds: [],
|
||||
avoidFoodIds: [],
|
||||
igdTypeOptions: []
|
||||
};
|
||||
|
||||
@ -75,6 +76,9 @@ const mutations = {
|
||||
}
|
||||
}
|
||||
},
|
||||
updateAvoidFoodIds(state, payload) {
|
||||
state.avoidFoodIds = payload.avoidFoodIds;
|
||||
},
|
||||
updateFontSize(state, payload) {
|
||||
state.fontSize = payload.fontSize;
|
||||
localStorage.setItem("fontSize", payload.fontSize);
|
||||
@ -215,7 +219,8 @@ const actions = {
|
||||
commit("updateStateData", {
|
||||
healthDataLoading: false,
|
||||
healthyDataType,
|
||||
healthyData
|
||||
healthyData,
|
||||
avoidFoodIds: (healthyData.avoidFood || []).map(obj => obj.id)
|
||||
});
|
||||
},
|
||||
async getRecipesInfo({ commit, state }, payload) {
|
||||
|
||||
@ -311,6 +311,9 @@ export default {
|
||||
return {};
|
||||
},
|
||||
computed: {
|
||||
notIds() {
|
||||
return this.avoidFoodIds.concat(this.notRecIgds);
|
||||
},
|
||||
mData() {
|
||||
if (!this.data.dishes) {
|
||||
return [];
|
||||
@ -337,8 +340,8 @@ export default {
|
||||
}
|
||||
lastNameHit =
|
||||
arr[arr.length - 1].name === cur.name &&
|
||||
arr[arr.length - 1].type === cur.type
|
||||
// arr[arr.length - 1].dishesId === cur.dishesId;
|
||||
arr[arr.length - 1].type === cur.type;
|
||||
// arr[arr.length - 1].dishesId === cur.dishesId;
|
||||
if (lastNameHit) {
|
||||
let namePos = arr.length - 1;
|
||||
for (let i = namePos; i >= 0; i--) {
|
||||
@ -407,6 +410,7 @@ export default {
|
||||
"canCopyMenuTypes",
|
||||
"recipesId",
|
||||
"notRecIgds",
|
||||
"avoidFoodIds",
|
||||
]),
|
||||
},
|
||||
methods: {
|
||||
@ -416,7 +420,7 @@ export default {
|
||||
return "recipes_first_col";
|
||||
} else {
|
||||
return `recipes_cell recipes_cell_${this.fontSize} ${
|
||||
columnIndex === 2 && this.notRecIgds.includes(row.igdId)
|
||||
columnIndex === 2 && this.notIds.includes(row.igdId)
|
||||
? "warning_heightlight"
|
||||
: ""
|
||||
}`;
|
||||
|
||||
Reference in New Issue
Block a user