Skip to content

M
mes-ui
Commit 862306c7 authored by 仇晓婷's avatar 仇晓婷
Browse files
Options

产品和工单默认图片

parent 5b32ebb1
Hide whitespace changes
Inline Side-by-side
Showing with 445 additions and 381 deletions
pages/produce/orderlist.vue
View file @ 862306c7
<template>
<div class="aps-r">
<DataGrid :columns="columns" ref="grid" :batch="false" :type="typeInfo" :span="6" :lazy="true" :conditions="easySearch" :action="action" :gutter="40">
<template slot="easySearch">
<Form ref="formInline" :model="easySearch" inline>
<FormItem prop="keys">
<Input placeholder="请输入订单编号/产品名称/图号" v-model="easySearch.keys.value" v-width="260" clearable />
</FormItem>
<FormItem>
<Button type="primary" @click="search">查询</Button>
</FormItem>
</Form>
</template>
<template slot="searchForm">
<Search />
</template>
<template slot="buttons">
<Button :icon="iconInfo" shape="circle" :title="titleInfo" @click="changeShwo"></Button>
</template>
<template slot="card" slot-scope="{row}">
<div class="body" @click="toExecute(row.id,row.orderId,row.executeId,row.routingHeaderId,row.routingDetailId,row.quantity,row.status,row.mesCode,row.productName,row.drawnNumber)">
<Row class="title-i">
<Col :span="10" class="order-code">
<Ellipsis :text="row.productName" :lines="1" tooltip transfer />
</Col>
<Col :span="10" class="order-code">
<Ellipsis :text="row.mesCode" :lines="1" tooltip transfer />
</Col>
<Col :span="4">
<div class="statuBg" :style="tdStyle(row.status)"></div>
<div class="boxTitle">
<div class="text">
<state code="taskList.status" ref="state" :value="row.status" type="text" :color="false"></state>
</div>
</div>
</Col>
</Row>
<div class="panel-text">
<Row>
<Col span="8">
<img :src="getUrl(row.productUrl)" width="120" height="120" :title="row.productUrl" style="border:#cacbd0 dashed 1px" onerror="this.src='/imgicon/noPic_product.png';" />
</Col>
<Col span="16" class="row">
<p>{{l("beginTime")}}：{{row.beginTime}}</p>
<p>
<span v-if="getStatus(row.status)">{{l("planEndTime")}}：</span>
<span v-else>{{l("endTime")}}：</span>
{{row.endTime}}
</p>
<p v-if="getStatus(row.status)&&getTimes(row.endTime)>0">
剩余时间：
<OutputTime :value="getTimes(row.endTime)" style="display:inline"></OutputTime>
</p>
<p>{{l("quantity")}}：{{row.quantity}}</p>
</Col>
</Row>
<Row class="rowBottom">
<Col span="14">{{l("drawnNumber")}}：{{row.drawnNumber}}</Col>
<Col span="10" class="tr">
<Icon type="md-alert" size="18" color="#FFA000" v-if="getStatus(row.status)&&getTimes(row.endTime)<86400&&getTimes(row.endTime)>0" />
<span style="color:#FFA000" v-if="getStatus(row.status)&&getTimes(row.endTime)<86400&&getTimes(row.endTime)>0">预警</span>&nbsp;&nbsp;
<Icon type="md-timer" size="18" color="#FE7777" v-if="getStatus(row.status)&&compareTime(row.endTime)" />
<span style="color:#FE7777" v-if="getStatus(row.status)&&compareTime(row.endTime)">超期</span>
</Col>
</Row>
<div class="aps-r">
<DataGrid
:columns="columns"
ref="grid"
:batch="false"
:type="typeInfo"
:span="6"
:lazy="true"
:conditions="easySearch"
:action="action"
:gutter="40"
>
<template slot="easySearch">
<Form ref="formInline" :model="easySearch" inline>
<FormItem prop="keys">
<Input
placeholder="请输入订单编号/产品名称/图号"
v-model="easySearch.keys.value"
v-width="260"
clearable
/>
</FormItem>
<FormItem>
<Button type="primary" @click="search">查询</Button>
</FormItem>
</Form>
</template>
<template slot="searchForm">
<Search />
</template>
<template slot="buttons">
<Button :icon="iconInfo" shape="circle" :title="titleInfo" @click="changeShwo"></Button>
</template>
<template slot="card" slot-scope="{row}">
<div
class="body"
@click="toExecute(row.id,row.orderId,row.executeId,row.routingHeaderId,row.routingDetailId,row.quantity,row.status,row.mesCode,row.productName,row.drawnNumber)"
>
<Row class="title-i">
<Col :span="10" class="order-code">
<Ellipsis :text="row.productName" :lines="1" tooltip transfer />
</Col>
<Col :span="10" class="order-code">
<Ellipsis :text="row.mesCode" :lines="1" tooltip transfer />
</Col>
<Col :span="4">
<div class="statuBg" :style="tdStyle(row.status)"></div>
<div class="boxTitle">
<div class="text">
<state
code="taskList.status"
ref="state"
:value="row.status"
type="text"
:color="false"
></state>
</div>
</div>
</template>
</div>
</Col>
</Row>
<div class="panel-text">
<Row>
<Col span="8">
<div class="img-i">
<img :src="downUrl +row.productUrl" v-if="row.productUrl" />
<img src="@/assets/imgicon/chan_Pin.png" v-else width="100%" height="100%" />
</div>
<!-- <img
:src="getUrl(row.productUrl)"
width="120"
height="120"
:title="row.productUrl"
style="border:#cacbd0 dashed 1px"
onerror="this.src='/imgicon/noPic_product.png';"
/>-->
</Col>
<Col span="16" class="row">
<p>{{l("beginTime")}}：{{row.beginTime}}</p>
<p>
<span v-if="getStatus(row.status)">{{l("planEndTime")}}：</span>
<span v-else>{{l("endTime")}}：</span>
{{row.endTime}}
</p>
<p v-if="getStatus(row.status)&&getTimes(row.endTime)>0">
剩余时间：
<OutputTime :value="getTimes(row.endTime)" style="display:inline"></OutputTime>
</p>
<p>{{l("quantity")}}：{{row.quantity}}</p>
</Col>
</Row>
<Row class="rowBottom">
<Col span="14">{{l("drawnNumber")}}：{{row.drawnNumber}}</Col>
<Col span="10" class="tr">
<Icon
type="md-alert"
size="18"
color="#FFA000"
v-if="getStatus(row.status)&&getTimes(row.endTime)<86400&&getTimes(row.endTime)>0"
/>
<span
style="color:#FFA000"
v-if="getStatus(row.status)&&getTimes(row.endTime)<86400&&getTimes(row.endTime)>0"
>预警</span>&nbsp;&nbsp;
<Icon
type="md-timer"
size="18"
color="#FE7777"
v-if="getStatus(row.status)&&compareTime(row.endTime)"
/>
<span
style="color:#FE7777"
v-if="getStatus(row.status)&&compareTime(row.endTime)"
>超期</span>
</Col>
</Row>
</div>
</div>
</template>
</DataGrid>
</div>
</div>
</template>
<script>
import Api from "./api";
import Search from "./search";
export default {
name: "starOrder",
components: {
Search
},
data() {
return {
action: Api.index,
easySearch: {
keys: {
op: "mesCode,productName,drawnNumber",
value: null
}
},
downUrl: fileUrlDown,
columns: [{
title: this.l("mesCode"),
key: "mesCode",
width: 240,
align: "left"
},
{
key: "status",
title: this.l("status"),
align: "center",
high: true,
code: "taskList.status",
width: 120
},
{
key: "productName",
title: this.l("productName"),
align: "left",
high: true
},
{
key: "drawnNumber",
title: this.l("drawnNumber"),
align: "left",
high: true
},
{
key: "quantity",
title: this.l("quantity"),
align: "right",
width: 120,
high: true
},
{
key: "beginTime",
title: this.l("beginTime"),
align: "center",
width: 180,
high: true
},
{
key: "endTime",
title: this.l("endTime"),
align: "center",
width: 180,
high: true
},
{
title: "操作",
key: "action",
width: 140,
align: "center",
render: (h, params) => {
return h("div", {
class: "action"
}, [
h(
"op", {
attrs: {
oprate: "edit"
},
on: {
click: () =>
this.toExecute(
params.row.id,
params.row.orderId,
params.row.executeId,
params.row.routingHeaderId,
params.row.routingDetailId,
params.row.quantity,
params.row.status,
params.row.mesCode,
params.row.productName,
params.row.drawnNumber
)
}
},
"查看"
)
]);
}
}
],
typeInfo: "card",
iconInfo: "md-apps",
titleInfo: "卡片模式",
nowTime: new Date().getTime() //页面当前打开时间
};
},
created() {
let oldStr = localStorage.getItem("admin");
let userlist = this.$store.getters.getUser(2);
},
async fetch({
store,
params
}) {
await store.dispatch("loadDictionary"); // 加载数据字典
},
mounted() {
this.search();
},
methods: {
search() {
this.$refs.grid.reload(this.easySearch);
name: "starOrder",
components: {
Search,
},
data() {
return {
action: Api.index,
easySearch: {
keys: {
op: "mesCode,productName,drawnNumber",
value: null,
},
toExecute(
id,
orderId,
executeId,
headid,
routingDetailId,
quantity,
status,
mesCode,
productName,
drawnNumber
) {
//跳转到对应操作页面 获取id:this.$route.query.id
this.$router.push({
path: "/produce/execute",
query: {
id: id, //工单ID
orderId: orderId, //订单id
executeId: executeId, //订单执行表id
headid: headid, //工艺规程id
routid: routingDetailId, //工序ID
quantity: quantity, //派工数量
dispatchStatus: status,
mesCode: mesCode,
productName: productName,
drawnNumber: drawnNumber
}
});
},
downUrl: fileUrlDown,
columns: [
{
title: this.l("mesCode"),
key: "mesCode",
width: 240,
align: "left",
},
tdStyle(val) {
//动态根据状态值加载状态值对应的颜色
let temDic = this.$store.getters.dictionaryByKey("taskList.status");
let temColor = "#666";
temDic.forEach(data => {
if (Number(data.code) == val) {
temColor = data.color;
}
});
var style = {};
style["border-top"] = " solid 38px " + temColor;
return style;
{
key: "status",
title: this.l("status"),
align: "center",
high: true,
code: "taskList.status",
width: 120,
},
changeShwo() {
//显示模式切换
if (this.typeInfo == "card") {
this.typeInfo = "table";
this.iconInfo = "md-list";
this.titleInfo = "列表模式";
} else {
this.typeInfo = "card";
this.iconInfo = "md-apps";
this.titleInfo = "卡片模式";
}
{
key: "productName",
title: this.l("productName"),
align: "left",
high: true,
},
compareTime(dateStart) {
//比较当前时间和计划完成时间
let planEndTime = new Date(dateStart).getTime();
let res = true;
if (this.nowTime - planEndTime > 0) {
res = true;
} else {
res = false;
}
return res;
{
key: "drawnNumber",
title: this.l("drawnNumber"),
align: "left",
high: true,
},
getTimes(dateStart) {
//返回计划完成时间和当前时间的差值
let planEndTime = new Date(dateStart).getTime();
let res = 0;
if (this.nowTime - planEndTime > 0) {
res = 0;
} else {
res = (this.nowTime - planEndTime) / 1000;
}
return res;
{
key: "quantity",
title: this.l("quantity"),
align: "right",
width: 120,
high: true,
},
getStatus(status) {
//根据状态返回未开工、执行中、暂停状态的bool值
let res = true;
if (status == 12 || status == 14 || status == 5) {
res = true;
} else {
res = false;
}
return res;
{
key: "beginTime",
title: this.l("beginTime"),
align: "center",
width: 180,
high: true,
},
getUrl(url) {
//返回img需要显示的src值
let tempUrl = "";
if (url && url.length > 0) {
tempUrl = this.downUrl + url;
} else {
tempUrl = iconImg + "noPic_product.png";
}
return tempUrl;
{
key: "endTime",
title: this.l("endTime"),
align: "center",
width: 180,
high: true,
},
l(key) {
let vkey = "order_list" + "." + key;
return this.$t(vkey) || key;
{
title: "操作",
key: "action",
width: 140,
align: "center",
render: (h, params) => {
return h(
"div",
{
class: "action",
},
[
h(
"op",
{
attrs: {
oprate: "edit",
},
on: {
click: () =>
this.toExecute(
params.row.id,
params.row.orderId,
params.row.executeId,
params.row.routingHeaderId,
params.row.routingDetailId,
params.row.quantity,
params.row.status,
params.row.mesCode,
params.row.productName,
params.row.drawnNumber
),
},
},
"查看"
),
]
);
},
},
],
typeInfo: "card",
iconInfo: "md-apps",
titleInfo: "卡片模式",
nowTime: new Date().getTime(), //页面当前打开时间
};
},
created() {
let oldStr = localStorage.getItem("admin");
let userlist = this.$store.getters.getUser(2);
},
async fetch({ store, params }) {
await store.dispatch("loadDictionary"); // 加载数据字典
},
mounted() {
this.search();
},
methods: {
search() {
this.$refs.grid.reload(this.easySearch);
},
toExecute(
id,
orderId,
executeId,
headid,
routingDetailId,
quantity,
status,
mesCode,
productName,
drawnNumber
) {
//跳转到对应操作页面 获取id:this.$route.query.id
this.$router.push({
path: "/produce/execute",
query: {
id: id, //工单ID
orderId: orderId, //订单id
executeId: executeId, //订单执行表id
headid: headid, //工艺规程id
routid: routingDetailId, //工序ID
quantity: quantity, //派工数量
dispatchStatus: status,
mesCode: mesCode,
productName: productName,
drawnNumber: drawnNumber,
},
});
},
tdStyle(val) {
//动态根据状态值加载状态值对应的颜色
let temDic = this.$store.getters.dictionaryByKey("taskList.status");
let temColor = "#666";
temDic.forEach((data) => {
if (Number(data.code) == val) {
temColor = data.color;
}
}
});
var style = {};
style["border-top"] = " solid 38px " + temColor;
return style;
},
changeShwo() {
//显示模式切换
if (this.typeInfo == "card") {
this.typeInfo = "table";
this.iconInfo = "md-list";
this.titleInfo = "列表模式";
} else {
this.typeInfo = "card";
this.iconInfo = "md-apps";
this.titleInfo = "卡片模式";
}
},
compareTime(dateStart) {
//比较当前时间和计划完成时间
let planEndTime = new Date(dateStart).getTime();
let res = true;
if (this.nowTime - planEndTime > 0) {
res = true;
} else {
res = false;
}
return res;
},
getTimes(dateStart) {
//返回计划完成时间和当前时间的差值
let planEndTime = new Date(dateStart).getTime();
let res = 0;
if (this.nowTime - planEndTime > 0) {
res = 0;
} else {
res = (this.nowTime - planEndTime) / 1000;
}
return res;
},
getStatus(status) {
//根据状态返回未开工、执行中、暂停状态的bool值
let res = true;
if (status == 12 || status == 14 || status == 5) {
res = true;
} else {
res = false;
}
return res;
},
getUrl(url) {
//返回img需要显示的src值
let tempUrl = "";
if (url && url.length > 0) {
tempUrl = this.downUrl + url;
} else {
tempUrl = iconImg + "noPic_product.png";
}
return tempUrl;
},
l(key) {
let vkey = "order_list" + "." + key;
return this.$t(vkey) || key;
},
},
};
</script>
<style lang="less">
.aps-r {
// width: 100%;
// height: 100%;
// overflow: auto;
// padding: 15px 0 15px 15px;
height: calc(100vh - 110px);
// width: 100%;
// height: 100%;
// overflow: auto;
// padding: 15px 0 15px 15px;
height: calc(100vh - 110px);
.body {
background: white;
border-radius: 4px 0 4px 4px;
border: #cacbd0 solid 1px;
margin-bottom: 30px;
.body {
background: white;
border-radius: 4px 0 4px 4px;
border: #cacbd0 solid 1px;
margin-bottom: 30px;
.title-i {
padding: 0 0 0 8px;
height: 38px;
line-height: 38px;
color: #2680eb;
font-size: 14px;
font-weight: bold;
border-bottom: #cacbd0 dotted 1px;
.title-i {
padding: 0 0 0 8px;
height: 38px;
line-height: 38px;
color: #2680eb;
font-size: 14px;
font-weight: bold;
border-bottom: #cacbd0 dotted 1px;
.btn-click {
text-align: right;
.btn-click {
text-align: right;
a {
color: #fff;
}
a:hover {
color: #249e91;
}
}
a {
color: #fff;
}
.panel-text {
padding: 5px 8px;
a:hover {
color: #249e91;
}
}
}
.row {
color: #666666;
padding-left: 10px;
.panel-text {
padding: 5px 8px;
.img-i {
width: 120px;
height: 120px;
overflow: hidden;
border: #cacbd0 dashed 1px;
img {
// width: 90px;
// height: 90px;
}
}
.row {
color: #666666;
padding-left: 10px;
p {
line-height: 30px;
}
}
p {
line-height: 30px;
}
}
}
}
.body:hover {
cursor: pointer;
box-shadow: 0 0 10px #888888;
}
.body:hover {
cursor: pointer;
box-shadow: 0 0 10px #888888;
}
}
.statuBg {
height: 0px;
width: 0;
border-left: solid 50px transparent;
float: right;
margin-right: -1px;
height: 0px;
width: 0;
border-left: solid 50px transparent;
float: right;
margin-right: -1px;
}
.boxTitle {
color: white;
float: right;
margin-top: -42px;
/* Rotate div */
transform: rotate(37deg);
-ms-transform: rotate(37deg);
/* Internet Explorer */
-moz-transform: rotate(37deg);
/* Firefox */
-webkit-transform: rotate(37deg);
/* Safari 和 Chrome */
-o-transform: rotate(37deg);
color: white;
float: right;
margin-top: -42px;
/* Rotate div */
transform: rotate(37deg);
-ms-transform: rotate(37deg);
/* Internet Explorer */
-moz-transform: rotate(37deg);
/* Firefox */
-webkit-transform: rotate(37deg);
/* Safari 和 Chrome */
-o-transform: rotate(37deg);
/* Opera */
.text {
font-size: 8px;
font-weight: normal;
}
/* Opera */
.text {
font-size: 8px;
font-weight: normal;
}
}
.rowBottom .ivu-col-span-10 {
height: 24px;
padding-right: 10px;
height: 24px;
padding-right: 10px;
}
</style>
pages/technology/productMix/product/index.vue
View file @ 862306c7
......@@ -32,15 +32,17 @@
<template slot="card" slot-scope="{row}">
<div class="body-card">
<Row class="title-i">
<Col :span="16">
<Ellipsis :text="row.name" :length="12" tooltip />
<Col :span="16">
<Ellipsis :text="row.name" :length="12" tooltip />
</Col>
<Col :span="8" class="btn-click">{{row.mmcode}}</Col>
</Row>
<Row class="row-down" :gutter="10">
<Col span="7">
<div class="img-i">
<img :src="downUrl +row.productUrl" onerror="this.src='/imgicon/noPic_product.png';"/>
<img :src="downUrl +row.productUrl" v-if="row.productUrl" />
<!-- onerror="this.src='/imgicon/chan_Pin.png'" -->
<img src="@/assets/imgicon/chan_Pin.png" v-else width="100%" height="100%" />
</div>
</Col>
<Col span="17" class="c">
......@@ -84,20 +86,20 @@ import Search from "./search";
export default {
name: "list",
components: {
Search
Search,
},
head: {
title: "",
author: "henq",
description: "product_info 5/20/2020 3:13:51 PM"
description: "product_info 5/20/2020 3:13:51 PM",
},
props: {
parent: {
id: Number,
parentName: String,
ids: String,
bomId: Number
}
bomId: Number,
},
},
data() {
return {
......@@ -106,7 +108,7 @@ export default {
easySearch: {
keys: { op: "mmcode,name", value: null },
levelId: { op: "In", value: this.id },
upId: { op: "In", value: 0 }
upId: { op: "In", value: 0 },
},
modal: false,
title: "新增",
......@@ -119,19 +121,19 @@ export default {
title: this.$t("id"),
hide: true,
align: "left",
high: true
high: true,
},
{
title: this.l("name"),
key: "name",
align: "left"
align: "left",
},
{
key: "mmcode",
title: this.l("mmcode"),
align: "center",
high: true
high: true,
},
{
key: "productUrl",
......@@ -144,39 +146,39 @@ export default {
"a",
{
attrs: {
oprate: "detail"
oprate: "detail",
// href: this.fileUrlPath,
// target: "_blank"
},
on: {
click: () => {
this.downFile(params.row.productUrl);
}
}
},
},
},
"查看图片"
)
),
]);
}
},
},
{
key: "levelTitle",
title: this.l("levelTitle"),
align: "left",
high: true
high: true,
},
{
key: "drawingNo",
title: this.l("drawingNo"),
align: "right",
high: true
high: true,
},
{
key: "madeCompanyTitle",
title: this.l("madeCompanyTitle"),
align: "center",
width: 260,
high: true
high: true,
},
{
title: "操作",
......@@ -190,8 +192,8 @@ export default {
{
attrs: { oprate: "edit" },
on: {
click: () => this.bom(params.row)
}
click: () => this.bom(params.row),
},
},
"BOM"
),
......@@ -200,8 +202,8 @@ export default {
{
attrs: { oprate: "edit" },
on: {
click: () => this.edit(params.row)
}
click: () => this.edit(params.row),
},
},
"编辑"
),
......@@ -209,7 +211,7 @@ export default {
"op",
{
attrs: { oprate: "delete" },
on: { click: () => this.remove(params.row) }
on: { click: () => this.remove(params.row) },
},
"删除"
),
......@@ -218,18 +220,18 @@ export default {
{
attrs: { oprate: "view" },
on: {
click: () => this.view(params.row)
}
click: () => this.view(params.row),
},
},
"详情"
)
),
]);
}
}
},
},
],
typeInfo: "card",
iconInfo: "md-apps",
titleInfo: "卡片模式"
titleInfo: "卡片模式",
};
},
mounted() {
......@@ -314,8 +316,7 @@ export default {
this.fullscreen = true;
},
remove(row) {
Api.delete(row.bomId).then(r => {
Api.delete(row.bomId).then((r) => {
if (r.success) {
this.$refs.grid.load();
this.$Message.success("删除成功");
......@@ -329,19 +330,19 @@ export default {
l(key) {
let vkey = "product_info" + "." + key;
return this.$t(vkey) || key;
}
},
},
watch: {
"parent.id"(v) {
if (v) {
let data = {
levelId: { op: "In", value: this.parent.ids },
upId: { op: "In", value: 0 }
upId: { op: "In", value: 0 },
};
this.$refs.grid.reload(data);
}
}
}
},
},
};
</script>
<style lang="less">
......@@ -369,7 +370,7 @@ export default {
height: 90px;
margin-right: 15px;
// overflow: hidden;
img{
img {
width: 90px;
height: 90px;
}
......
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