Commit 8d77c5ed authored by 仇晓婷's avatar 仇晓婷

Merge branch 'product' of http://git.mes123.com/zhouyx/mes-ui into product

parents 10029fd3 0e300617
......@@ -952,6 +952,20 @@ export default {
demand_finish: '计划要求结束',
insert_flag: '插单',
badjustflag: '',
//自定义模板相关
templateName: '模板名称',
templateDesc: '模板描述',
templateList: '排序规则',
//外协工期相关
outSideTime: '外协工期',
taskSeq: '工序号',
taskName: '工序名称',
productName:'产品名称',
drawingNum:'产品图号',
batchNum:'批次号',
projectNo:'项目号',
partTaskPk:'计划编号',
opTaskPk:'工单Id',
}, //多租户-服务器数据源
host: {
id: '',
......@@ -1279,7 +1293,7 @@ export default {
holidayCalId: '加班日历编号',
calName: '工作日历名称',
holidayCalName: '加班日历名称',
isimportant:'关重',
capabilityValue:'能力值',
isimportant: '关重',
capabilityValue: '能力值',
}
}
<template>
<div class="parameter">
<div v-if="load" style="width:100px;margin:0 auto;padding-top:60px;">
<div v-if="load" style="width:100px;margin:0 auto;padding-top:260px;">
<Spin size="large"></Spin>
</div>
<div v-show="!load">
<Form ref="form" label-position="top" :model="entity" :rules="rules">
<Row :gutter="24">
<Col span="24" style="height:80px;">
<FormItem label="模板名称" prop="tempName">
<FormItem :label="l('templateName')" prop="tempName">
<Input v-model="entity.tempName"></Input>
</FormItem>
</Col>
<Col span="24" style="height:60px;">
<FormItem label="模板描述">{{entity.tempInfo}}</FormItem>
<FormItem :label="l('templateDesc')">{{entity.tempInfo}}</FormItem>
</Col>
<Col span="24">
<FormItem label="排序规则"></FormItem>
<FormItem :label="l('templateList')"></FormItem>
</Col>
</Row>
</Form>
......@@ -73,7 +73,9 @@ export default {
load: true
};
},
props: {},
props: {
rowId: { type: Number, default: 0 }
},
created() {},
mounted() {
this.$dragging.$on("dragged", ({ value }) => {
......@@ -110,6 +112,8 @@ export default {
//加载模板描述信息
loadInfo() {
let tempList = [];
if (this.rowId == 0) {
//新增模板时新增接口方法
Api.addsorttemplateplus().then(r => {
if (r.success) {
tempList = r.result.templateList;
......@@ -118,9 +122,23 @@ export default {
this.entity.tempName = "";
//this.entity.tempName = r.result.templateName;
this.outInfo(tempList);
this.$emit("changeStatu", r.result.id);
}
});
} else {
//修改模板接口方法
let parms = {
id: this.rowId
};
Api.getsorttemplate(parms).then(r => {
if (r.success) {
tempList = r.result.templateList;
this.tempDataList = tempList;
this.entity.id = this.rowId;
this.entity.tempName = r.result.templateName;
this.outInfo(tempList);
}
});
}
},
//返回模板描述信息
outInfo(list) {
......@@ -155,18 +173,35 @@ export default {
templateList:
this.listTemp.length < 1 ? this.tempDataList : this.listTemp
};
let tempArray = params.templateList;
params.templateList = [];
tempArray.forEach((dataArray, index,tempArray) => {
dataArray.seq = index + 1;
if (dataArray.sons && dataArray.sons.length > 1) {
let tempSons=[]
tempSons=dataArray.sons
tempSons.forEach((dataArraySons, index1,tempSons) => {
dataArraySons.seq = index1 + 1;
});
}
params.templateList.push(dataArray);
});
Api.savesorttemplate(params)
.then(res => {
if (res.success && res.result) {
if (this.rowId == 0) {
this.$Message.success("新增成功");
} else {
this.$Message.success("编辑成功");
}
let paramsData = {
id: this.entity.id,
name: this.entity.tempName,
info: this.entity.tempInfo
desc: this.entity.tempInfo
};
this.$emit("on-ok", paramsData);
this.$emit("on-close");
this.$emit("changeStatu", 0);
} else {
this.$Message.error("新增失败");
this.$emit("on-close");
......@@ -179,6 +214,7 @@ export default {
});
},
handleClose() {
if (this.rowId == 0) {
let params = {
id: this.entity.id
};
......@@ -188,15 +224,22 @@ export default {
this.$Message.error("删除失败");
}
});
}
this.$emit("on-close");
},
l(key) {
let vkey = "mes_op_task_plan_simulate" + "." + key;
let vkey = "mes_part_task_plan_simulate" + "." + key;
return this.$t(vkey) || key;
}
},
computed: {},
watch: {}
watch: {
rowId(v) {
if (v != 0) {
this.entity.id = v;
}
}
}
};
</script>
<style lang="less">
......
......@@ -90,7 +90,7 @@ export default {
return Api.get(`${apsUrl}/apspoolappservices/getdropsortlist`);
},
//点击新增初始化数据
addsorttemplateplus(){
addsorttemplateplus() {
return Api.post(`${apsUrl}/apspoolappservices/addsorttemplateplus`);
},
//保存模板
......@@ -98,12 +98,35 @@ export default {
return Api.post(`${apsUrl}/apspoolappservices/savesorttemplate`, params);
},
//使用排产规则
usesorttemplate (params) {
usesorttemplate(params) {
return Api.post(`${apsUrl}/apspoolappservices/usesorttemplate `, params);
},
//删除排产模板
removesorttemplate(params){
removesorttemplate(params) {
return Api.post(`${apsUrl}/apspoolappservices/removesorttemplate `, params);
}
},
//获取单个模板信息
getsorttemplate(params) {
return Api.get(`${apsUrl}/apspoolappservices/getsorttemplate`, params);
},
//排序模板相关end-----
//修改外协工期相关start-----
//得到外协任务列表
getoutsidetimelist() {
return Api.get(`${apsUrl}/apspoolappservices/getoutsidetimelist`);
},
//保存外协任务工期
saveoutsidetime(params) {
return Api.post(`${apsUrl}/apspoolappservices/saveoutsidetime `, params)
},
//保存插单任务
saveinsertorder(params) {
return Api.post(`${apsUrl}/apspoolappservices/saveinsertorder `, params)
},
//取消插单任务
cancelinsertorder(params) {
return Api.post(`${apsUrl}/apspoolappservices/cancelinsertorder `, params)
},
//修改外协工期相关end-----
}
......@@ -63,11 +63,10 @@ export default {
gridHeight: 50,
size: "small",
columns: [
{ key: "id", title: this.l("id"), hide: true, align: "left" },
{ title: " ", width: 130 },
{
key: "important_flag", //insert_flag?
title: this.l("important_flag"),
key: "insert_flag",
title: this.l("insert_flag"),
align: "center",
high: true,
width: 60,
......@@ -77,7 +76,7 @@ export default {
{
props: {
content:
params.row.important_flag == 1 ? "取消插单" : "进行插单",
params.row.insert_flag == 1 ? "取消插单" : "进行插单",
placement: "top"
},
class: "ico"
......@@ -86,14 +85,14 @@ export default {
h("Icon", {
attrs: {
type:
params.row.important_flag == 1
params.row.insert_flag == 1
? "ios-flag"
: "ios-flag-outline",
size: 20,
color: params.row.important_flag == 1 ? "#2680EB" : "#aaa"
color: params.row.insert_flag == 1 ? "#2680EB" : "#aaa"
},
on: {
click: () => this.changeFlag(params.row.id, params.index)
click: () => this.changeFlag(params.row.op_task_pk, params.index)
}
})
]
......@@ -399,7 +398,7 @@ export default {
//插单事件start----
changeFlag(id, index) {
this.rowIndex = index;
if (this.data1[this.rowIndex].important_flag == 1) {
if (this.data1[this.rowIndex].insert_flag == 1) {
this.insertTItle = "取消插单";
} else {
this.insertTItle = "插单";
......@@ -408,11 +407,35 @@ export default {
},
insertOk() {
//this.loadData(this.row)
if (this.data1[this.rowIndex].important_flag == 1) {
if (this.data1[this.rowIndex].insert_flag == 1) {
//根据插单数据状态进行插单或取消插单操作
this.data1[this.rowIndex].important_flag = 0;
let params1 = { partTaskPks: [], opTaskPks: [this.data1[this.rowIndex].op_task_pk] };
Api.cancelinsertorder(params1)
.then(res => {
if (res.success) {
this.$Message.success("取消插单成功!");
this.data1[this.rowIndex].insert_flag = 0;
} else {
this.data1[this.rowIndex].important_flag = 1;
this.$Message.error("取消插单失败!");
}
})
.catch(err => {
this.$Message.error("数据异常!");
});
} else {
let params = { partTaskPks: [], opTaskPks: [this.data1[this.rowIndex].op_task_pk] };
Api.saveinsertorder(params)
.then(res => {
if (res.success) {
this.$Message.success("插单成功!");
this.data1[this.rowIndex].insert_flag = 1;
} else {
this.$Message.error("插单失败!");
}
})
.catch(err => {
this.$Message.error("数据异常!");
});
}
this.setParsModal = false;
this.detailModal = false;
......@@ -429,7 +452,7 @@ export default {
taskSeq: row.task_seq,
count: row.put_into_qty
};
this.rowData=row
this.rowData = row;
this.setParsModal = true;
},
//单个工序进行参数设置end----
......@@ -480,7 +503,8 @@ export default {
};
</script>
<style lang="less">
.excute table tr th span,.excute table tr td {
.excute table tr th span,
.excute table tr td {
font-size: 10px;
}
</style>
<template>
<div>
<Row>
<Col span="24">
<DataGrid
:columns="columnsDuration"
ref="gridDuration"
:data="data"
:high="false"
:page="false"
:batch="false"
:easy="false"
:set="false"
:height="400"
:tool="false"
></DataGrid>
</Col>
</Row>
<Modal
v-model="setTimeModal"
title="修改外协时间"
width="680"
footer-hide
@on-cancel="cancel"
>
<EditDuration :rowData="row" ref="editDurationRef" @on-close="cancel" @on-ok="editInfo"></EditDuration>
</Modal>
</div>
</template>
<script>
import Api from "./api";
import EditDuration from "./editDuration";
export default {
components: {
EditDuration
},
data() {
return {
editDuration: null,
tempModal: false,
columnsDuration: [
{
key: "projectNo",
title: this.l("projectNo"),
align: "left"
},
{
key: "batchNum",
title: this.l("batchNum"),
align: "left",
width: 100
},
{
key: "drawingNum",
title: this.l("drawingNum"),
align: "left",
width: 150
},
{
key: "productName",
title: this.l("productName"),
align: "left",
width: 150
},
{
key: "taskSeq",
title: this.l("taskSeq"),
align: "left",
width: 80
},
{
key: "taskName",
title: this.l("taskName"),
align: "left",
width: 120
},
{
key: "outSideTime",
title: this.l("outSideTime"),
align: "right",
width: 100
},
{
title: " ",
key: "action",
width: 80,
align: "center",
render: (h, params) => {
return h("div", { class: "action" }, [
h("op", {
props: {
icon: "md-create",
type: "icon",
title: "修改外协工期",
oprate: "edit"
},
on: { click: () => this.edit(params.row) }
})
]);
}
}
],
data: [],
row: {}
};
},
created() {},
mounted() {
this.loadDuration();
},
methods: {
loadDuration() {
this.data = [];
Api.getoutsidetimelist()
.then(r => {
if (r.success) {
this.data = r.result;
} else {
this.$Message.error("加载数据失败!");
}
})
.catch(err => {
this.$Message.error("数据异常!");
});
},
cancel() {
this.row = {};
this.setTimeModal = false;
},
edit(rowData) {
this.row = rowData;
this.setTimeModal = true;
},
editInfo(entity) {
let tempData = this.data;
this.data = [];
tempData.forEach(data => {
if (data.taskSeq == entity.taskSeq) {
data.outSideTime = entity.outSideTime;
}
this.data.push(data);
});
},
l(key) {
let vkey = "mes_part_task_plan_simulate" + "." + key;
return this.$t(vkey) || key;
}
},
computed: {},
watch: {}
};
</script>
<style lang="less">
</style>
\ No newline at end of file
<template>
<div>
<Form ref="form" :model="entity" :rules="rules" :label-width="100">
<Row>
<Col span="12">
<FormItem :label="l('projectNo')">
<Input v-model="entity.projectNo" disabled></Input>
</FormItem>
</Col>
<Col span="12">
<FormItem :label="l('productName')">
<Input v-model="entity.productName" disabled></Input>
</FormItem>
</Col>
<Col span="12">
<FormItem :label="l('outSideTime')" prop="outSideTime">
<InputNumber v-model="entity.outSideTime" style="width:150px;" :min="0"></InputNumber>
</FormItem>
</Col>
</Row>
</Form>
<Row>
<Col span="24" style="text-align:right;height:60px;line-height:60px">
<Button type="primary" @click="handleSubmit">确定</Button>
<Button @click="handleClose" class="ml20">取消</Button>
</Col>
</Row>
</div>
</template>
<script>
import Api from "./api";
export default {
data() {
return {
entity: {
},
rules: {
outSideTime: [
{ required: true, message: "必填", type: "number", trigger: "change" }
]
}
};
},
props: {
rowData: {
type: Object,
default: () => {
return null;
}
}
},
created() {},
mounted() {},
methods: {
handleSubmit() {
this.$refs.form.validate(valid => {
if (valid) {
let params = {
items: [
{
partTaskPk: this.entity.partTaskPk,
opTaskPk: this.entity.opTaskPk,
outSideTime: this.entity.outSideTime
}
]
};
Api.saveoutsidetime(params)
.then(res => {
if (res.success && res.result) {
this.$Message.success("修改外协时间成功");
this.$emit("on-ok", this.entity);
} else {
this.$Message.error("修改外协时间失败");
}
this.$emit("on-close");
})
.catch(e => {
this.$Message.error("数据异常!");
});
}
});
},
handleClose() {
this.$emit("on-close");
},
l(key) {
let vkey = "mes_part_task_plan_simulate" + "." + key;
return this.$t(vkey) || key;
}
},
computed: {},
watch: {
rowData(v) {
if (v != {}) {
this.entity = this.$u.clone(v);
}
}
}
};
</script>
<style lang="less">
</style>
\ No newline at end of file
......@@ -26,6 +26,9 @@
</Select>
<a style="font-weight: bold;" @click="openaddModalTemp">
<Icon type="md-color-palette" size="14" />&nbsp;自定义排序模板
</a>
<a style="font-weight: bold;" @click="openDuration">
<Icon type="md-create" size="14" />&nbsp;修改外协工期
</a>&nbsp;&nbsp;&nbsp;&nbsp;
<Select placeholder="选择历史方案" style="width: 150px;"></Select>&nbsp;&nbsp;&nbsp;&nbsp;
<DatePicker
......@@ -54,15 +57,11 @@
<Button type="primary" class="mr10 ml10" @click="removeOk">移出排产</Button>
</template>
</DataGrid>
<Modal
v-model="addModalTemp"
title="自定义排序模板"
footer-hide
width="1000"
class="tempModal"
@on-cancel="tempCancel"
>
<Temp :data="listTemp" @changeStatu="changeStatu" ref="tempRef"></Temp>
<Modal v-model="addModalTemp" title="自定义排序模板" footer-hide width="1000" class="tempModal">
<Temp :data="listTemp" ref="tempRef"></Temp>
</Modal>
<Modal v-model="modalDuration" title="外协任务" footer-hide width="1000" >
<Duration ref="durationRef"></Duration>
</Modal>
<Modal v-model="addModal" title="工序参数设置" footer-hide width="1000">
<Add
......@@ -88,19 +87,24 @@
</Col>
</Row>
</Modal>
<Modal v-model="insertlModal1" :title="insertTItle1" @on-ok="insertOk1" @on-cancel="cancel">
<p>确定进行 {{ insertTItle1 }} 操作?</p>
</Modal>
</div>
</template>
<script>
import Api from "./api";
import Add from "./add";
import Temp from "./temp";
import Duration from "./duration";
import Expand from "./components/excute";
export default {
name: "list",
components: {
Add,
Expand,
Temp
Temp,
Duration
},
data() {
return {
......@@ -117,6 +121,10 @@ export default {
deletelModal: false,
apsModal: false,
addModalTemp: false,
modalDuration: false,
insertlModal1: false,
insertTItle1: "插单",
rowIndex1: null,
list: [],
curId: 0,
columns: [
......@@ -167,8 +175,34 @@ export default {
align: "center",
width: 70,
high: true,
code: "aps.aps.insert_flag",
category: "icon"
render: (h, params) => {
return h(
"Tooltip",
{
props: {
content:
params.row.insert_flag == 1 ? "取消插单" : "进行插单",
placement: "top"
},
class: "ico"
},
[
h("Icon", {
attrs: {
type:
params.row.insert_flag == 1
? "ios-water"
: "ios-water-outline",
size: 20,
color: params.row.insert_flag == 1 ? "#2680EB" : "#aaa"
},
on: {
click: () => this.changeFlag1(params.row.part_task_pk, params.index)
}
})
]
);
}
},
{
key: "mesCode",
......@@ -589,43 +623,77 @@ export default {
openaddModalTemp() {
this.addModalTemp = true;
},
tempCancel() {
if (this.tempStatu != 0) {
let params = {
id: this.tempStatu
};
Api.removesorttemplate(params).then(r => {
if (r.success) {
this.$refs.tempRef.cancel()
} else {
this.$Message.error("删除失败");
}
});
}
},
changeStatu(val) {
this.tempStatu = val;
},
//选择排序模板
tempValueChange(val) {
let params = {
id: val
};
Api.usesorttemplate(params).then(r => {
Api.usesorttemplate(params)
.then(r => {
if (r.success) {
this.$Message.success("设置成功");
this.list = [];
this.loadList();
}
else
{
} else {
this.$Message.error("设置失败");
}
}).catch(e=>{
})
.catch(e => {
this.$Message.error("访问失败");
});
},
//自定义排序模板相关end------
//外协工期修改start------
//打开外协工期任务modal
openDuration() {
this.modalDuration = true;
},
//外协工期修改end
//插单start
//插单事件start----
changeFlag1(id, index) {
this.rowIndex1 = index;
if (this.list[this.rowIndex1].insert_flag == 1) {
this.insertTItle1 = "取消插单";
} else {
this.insertTItle1 = "插单";
}
this.insertlModal1 = true;
},
insertOk1() {
if (this.list[this.rowIndex1].insert_flag == 1) {
//根据插单数据状态进行插单或取消插单操作
let params1 = { partTaskPks: [this.list[this.rowIndex1].part_task_pk], opTaskPks: [] };
Api.cancelinsertorder(params1)
.then(res => {
if (res.success) {
this.$Message.success("取消插单成功!");
this.list[this.rowIndex1].insert_flag = 0;
} else {
this.$Message.error("取消插单失败!");
}
})
.catch(err => {
this.$Message.error("数据异常!");
});
} else {
let params = { partTaskPks: [this.list[this.rowIndex1].part_task_pk], opTaskPks: [] };
Api.saveinsertorder(params)
.then(res => {
if (res.success) {
this.$Message.success("插单成功!");
this.list[this.rowIndex1].insert_flag = 1;
} else {
this.$Message.error("插单失败!");
}
})
.catch(err => {
this.$Message.error("数据异常!");
});
}
this.insertlModal1 = false;
},
//插单end
}
};
</script>
......
<template>
<div>
<Row>
<Col span="6" class="pt15">
<Col span="24">
<DataGrid
:columns="columnsTemp"
ref="gridTemp"
......@@ -11,20 +11,32 @@
:batch="false"
:easy="false"
:set="false"
:height="575"
:tool="false"
></DataGrid>
</Col>
<Col span="18">
<Component :is="add" @on-close="cancel" @on-ok="addData" @changeStatu="changeStatu"></Component>
</Col>
</Row>
<Row>
<Col span="6" class="h50 tr">
:height="400"
>
<template slot="buttons">
<Button type="primary" @click="addTempModal">新增模板</Button>
</template>
</DataGrid>
</Col>
<Col span="18"></Col>
</Row>
<Modal
v-model="tempModal"
:title="tempTitle"
width="680"
footer-hide
class="tempModal"
@on-cancel="cancelModal"
>
<Component
:is="add"
:rowId="id"
ref="tempRef"
@on-close="cancel"
@on-ok="addData"
style="height:600px"
></Component>
</Modal>
</div>
</template>
<script>
......@@ -37,17 +49,15 @@ export default {
columnsTemp: [
{
key: "name",
title: "模板名称",
title: this.l("templateName"),
align: "left",
render: (h, params) => {
return h(
"Tooltip",
{
props: {
content:
params.row.name +
":"+params.row.desc,
placement: "left-start",
content: params.row.name,
placement: "top",
transfer: true,
maxWidth: "800"
}
......@@ -56,13 +66,28 @@ export default {
);
}
},
{
key: "desc",
title: this.l("templateDesc"),
align: "left",
width: 650
},
{
title: " ",
key: "action",
width: 60,
width: 100,
align: "center",
render: (h, params) => {
return h("div", { class: "action" }, [
h("op", {
props: {
icon: "md-create",
type: "icon",
title: "修改模板",
oprate: "edit"
},
on: { click: () => this.edit(params.row.id) }
}),
h("op", {
props: {
icon: "ios-trash",
......@@ -76,7 +101,9 @@ export default {
]);
}
}
]
],
tempTitle: "新建模板",
id: 0
};
},
props: {
......@@ -92,6 +119,8 @@ export default {
methods: {
addTempModal() {
if (this.add == null) {
this.tempTitle = "新建模板";
this.tempModal = true;
this.add = () => import("./addTemp");
}
},
......@@ -120,16 +149,39 @@ export default {
},
addData(obj) {
//this.data.splice(0, 0,obj);
if (this.id == 0) {
this.data.push(obj);
} else {
let dataTemp = this.data;
this.data = [];
dataTemp.forEach(rowData => {
if (rowData.id == this.id) {
rowData.name = obj.name;
rowData.desc = obj.desc;
}
this.data.push(rowData);
});
}
},
cancel() {
this.add = null;
this.tempModal = false;
},
changeStatu(val) {
this.$emit("changeStatu", val);
cancelModal() {
this.$refs.tempRef.handleClose();
this.tempModal = false;
this.add = null;
},
edit(id) {
if (this.add == null) {
this.id = id;
this.tempTitle = "编辑模板";
this.tempModal = true;
this.add = () => import("./addTemp");
}
},
l(key) {
let vkey = "mes_op_task_plan_simulate" + "." + key;
let vkey = "mes_part_task_plan_simulate" + "." + key;
return this.$t(vkey) || key;
}
},
......
<style lang="less">
@import '../../technolog.less';
</style>
<template>
<div>1231323</div>
</template>
<script>
export default {
components: {},
data() {
return {
showMenu:true,
treeHeight: '',
actNum:'1',
}
},
created() {
this.treeHeight = window.innerHeight - 140
},
async fetch({ store, params }) {
await store.dispatch('loadDictionary') // 加载数据字典
},
mounted() {
window.onresize = () => {
///浏览器窗口大小变化
return (() => {
this.treeHeight = window.innerHeight - 140
})()
}
},
computed: { },
methods: {
back(){
},
}
}
</script>
<style lang="less">
@import '../technolog.less';
</style>
<template>
<Layout class="pt10 details_box">
<Header>
<h4 class="details_top tc">
<a class="back_href" @click="back"> <Icon type="ios-undo-outline" />返回工艺规程</a>
<div>工艺信息</div>
</h4>
<div class="details_body">
<Menu mode="horizontal" theme="light" active-name="1">
<MenuItem name="1">工序</MenuItem>
<MenuItem name="2" to="/technology/details/component/gongxu">质控卡</MenuItem>
<MenuItem name="3">工艺BOM</MenuItem>
<MenuItem name="4">生产准备</MenuItem>
<!-- -->
</Menu>
</div>
</Header>
<!-- <Content> -->
<Layout class="bottom_box">
<nuxt-child keep-alive></nuxt-child>
</Layout>
<!-- </Content> -->
</Layout>
</template>
<script>
export default {
components: {},
data() {
return {
showMenu:true,
treeHeight: '',
actNum:'1',
}
},
created() {
this.treeHeight = window.innerHeight - 140
},
async fetch({ store, params }) {
await store.dispatch('loadDictionary') // 加载数据字典
},
mounted() {
window.onresize = () => {
///浏览器窗口大小变化
return (() => {
this.treeHeight = window.innerHeight - 140
})()
}
},
computed: { },
methods: {
back(){
this.$router.push({
name: "technology",
// params: { transmitData: lemData }
});
},
}
}
</script>
<style lang="less">
@import './technolog.less';
</style>
<template>
<div class="layout">
<Layout>
<Sider hide-trigger v-if="showMenu" class="menu_side">
<div class="side_tree" :style="{ height: treeHeight + 'px' }">
<h4 class="tree_tit pl5">产品结构
<a class="menu_play fr" @click="hideMenu" title="收起">
<Icon type="ios-arrow-back" size="24" />
<!-- <Icon type="md-arrow-round-back"/> -->
</a>
</h4>
</div>
</Sider>
<div v-if="!showMenu" class="show_menu">
<a class="menu_play fr" @click="showMenuFn" title="展开">
<Icon type="ios-arrow-forward" size="24" />
<!-- <Icon type="md-arrow-round-forward"/> -->
</a>
</div>
<Layout>
<Content :class="showMenu?'tech_body':'tech_body02'" :style="{ height: treeHeight + 'px' }">Content</Content>
</Layout>
</Layout>
</div>
</template>
<script>
export default {
components: {},
data() {
return {
showMenu:true,
treeHeight: '',
}
},
created() {
this.treeHeight = window.innerHeight - 120
},
async fetch({ store, params }) {
await store.dispatch('loadDictionary') // 加载数据字典
},
mounted() {
window.onresize = () => {
///浏览器窗口大小变化
return (() => {
this.treeHeight = window.innerHeight - 120
})()
}
},
computed: {
},
methods: {
hideMenu(){
this.showMenu = false
this.$Message.info("收起左侧树")
},
showMenuFn(){
this.showMenu = true
this.$Message.info("展开左侧树")
},
}
}
</script>
.menu_side{
width: 300px!important;
min-width: 300px!important;
max-width: 300px!important;
flex: 0 0 300px!important;
background: #fff;
margin: 5px 0 0 0;
}
.side_tree{
background: #ffffff;
width: 300px;
border: 1px solid #ddd;
.tree_tit{
background: #F5F6FA;
height: 50px;
line-height: 50px;
font-size: 14px;
color: #515A6E;
.menu_play{
width: 30px;
height: 50px;
line-height: 50px;
text-align: center;
color: #646464;
}
}
}
.show_menu{
width: 30px;
height: 30px;
position: fixed;
top: 100px;
left: 0;
.menu_play{
width: 30px;
height: 30px;
line-height: 34px;
font-size: 14px;
text-align: center;
color: #515A6E;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
// position: absolute;
// top: 100px;
// left: 0px;
background: #ffffff;
box-shadow: #ccc 2px 2px 4px 1px;
}
}
.tech_body{
margin: 5px 5px 5px 20px;
padding: 2px 18px;
box-shadow: #98929294 2px 1px 5px 1px;
}
.tech_body02{
margin: 5px;
padding: 2px 18px;
box-shadow: #98929294 2px 1px 5px 1px;
}
.details_box{
.details_top{
height: 32px;
line-height: 32px;
position: relative;
background: #fff;
border-bottom: 1px solid #ccc;
.back_href{
position: absolute;
left: 110px;
top: 0;
.ivu-icon{
font-size: 20px;
}
}
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment