...
代码块 | ||
---|---|---|
| ||
<template>
<Timeline>
<TimelineItem color="green" v-for="t in worklist" :key="t.oid">
<p>{{`${getdate(t.woDeadline || '未知')}`}}</p>
<p>{{`${t.woTitle}`}}<a @click="openWorkOrder(t)">详情</a> </p>
</TimelineItem>
</Timeline>
</template>
<script>
export default {
name: "workOrderListOpr",
data() {
return {
worklist: [],
};
},
created() {
console.log(this.dwf_ctx);
let queryConditon = {};
let that = this; // 临时保存上下文以便异步调用
this.dwf_ctx.dwf_axios
.post("/omf/entities/WorkOrder/objects", queryConditon)
.then((res) => {
if (res.data.success) {
console.log(res.data.data);
that.worklist = res.data.data;
}
});
},
methods: {
openWorkOrder(wo) {
// 打开工单对象
alert(`${wo.woTitle}`);
},
// 日期转换辅助函数
getdate(ts) {
if (ts == "") return "--";
var now = new Date(ts),
y = now.getFullYear(),
m = now.getMonth() + 1,
d = now.getDate();
return (
y + "-" + (m < 10 ? "0" + m : m) + "-" +(d < 10 ? "0" + d : d) + " " +
now.toTimeString().substr(0, 8)
);
},
}
};
</script>
<style>
.ivu-timeline {
margin-left: 20px;
margin-top: 20px;
}
</style> |
...
代码块 |
---|
<template>
<Timeline>
<TimelineItem color="green" v-for="t in worklist" :key="t.oid">
<p>{{ `${getdate(t.woDeadline || "未知")}` }}</p>
<p>
{{
`设备代号为 ${t.assetId} 的 ${t.woTitle} 工作由 ${t.engineerName} 负责完成`
}}
<a @click="openWorkOrder(t)">详情</a>
</p>
</TimelineItem>
</Timeline>
</template>
<script>
export default {
name: "workOrderListOpr",
data() {
return {
worklist: [],
userlist: [], //新增了用户列表备用
assetlist: [], //新增了设备列表备用
};
},
created() {
console.log(this.dwf_ctx);
let queryConditon = {
condition: "order by obj.woDeadline",
refs: [
{
sourceAttr: "assetOid",
targetAttr: "oid",
targetClass: "Asset",
sourceAttrSplit: ",",
},
{
sourceAttr: "engineerOid",
targetAttr: "oid",
targetClass: "User",
sourceAttrSplit: ",",
},
],
};
let that = this; // 临时保存上下文以便异步调用
this.dwf_ctx.dwf_axios
.post("/omf/entities/WorkOrder/objects", queryConditon)
.then((res) => {
console.log(res);
if (res.data.success) {
let resArr = res.data.data;
that.assetlist = resArr.refResult.assetOid;
that.userlist = resArr.refResult.engineerOid;
// 重新归置工单信息补充新的属性
that.worklist = resArr.queryResult.map((wo) => {
let asset = that.assetlist.find((a) => {
return a.oid === wo.assetOid;
}); //找到工单提到的设备对象
let engineer = that.userlist.find((u) => {
return u.oid === wo.engineerOid;
}); //找到工单提到的用户对象
// 如果设备对象不为空则补充设备的代号到工单中
wo.assetId = typeof asset !== "undefined" ? asset.id : "未知";
// 如果用户对象不为空则补充用户的名称到工单中
wo.engineerName =
typeof engineer !== "undefined" ? engineer.displayName : "未知";
return wo;
});
}
});
},
methods: {
openWorkOrder(wo) {
// 打开工单对象
alert(`${wo.woTitle}`);
},
getdate(ts) {
if (ts == "") return "--";
var now = new Date(ts),
y = now.getFullYear(),
m = now.getMonth() + 1,
d = now.getDate();
return (
y +
"-" +
(m < 10 ? "0" + m : m) +
"-" +
(d < 10 ? "0" + d : d) +
" " +
now.toTimeString().substr(0, 8)
);
},
},
};
</script>
<style>
.ivu-timeline {
margin-left: 20px;
margin-top: 20px;
}
</style> |
...
在下面章节里,我们还将介绍其他更加简便的方法操作DWF中的概念。
代码块 | ||||||
---|---|---|---|---|---|---|
| ||||||
<template> <Timeline> <TimelineItem color="green" v-for="t in worklist" :key="t.oid"> <p>{{ `${getdate(t.woDeadline || "未知")}` }}</p> <p> {{ `设备代号为 ${t.assetId} 的 ${t.woTitle} 工作由 ${t.engineerName} 负责完成` }} <a @click="openWorkOrder(t)">详情</a> </p> </TimelineItem> </Timeline> </template> <script> export default { name: "workOrderListOpr", props: ["itemValue", "root", "store", "Message"], data() { return { worklist: [], userlist: [], //新增了用户列表备用 assetlist: [], //新增了设备列表备用 }; }, created() { console.log(this.dwf_ctx); let queryConditon = { condition: "order by obj.woDeadline", refs: [ { sourceAttr: "assetOid", targetAttr: "oid", targetClass: "Asset", sourceAttrSplit: ",", }, { sourceAttr: "engineerOid", targetAttr: "oid", targetClass: "User", sourceAttrSplit: ",", }, ], }; let that = this; // 临时保存上下文以便异步调用 this.dwf_ctx.dwf_axios .post("/omf/entities/WorkOrder/objects", queryConditon) .then((res) => { console.log(res); if (res.data.success) { let resArr = res.data.data; that.assetlist = resArr.refResult.assetOid; that.userlist = resArr.refResult.engineerOid; // 重新归置工单信息补充新的属性 that.worklist = resArr.queryResult.map((wo) => { let asset = that.assetlist.find((a) => { return a.oid === wo.assetOid; }); //找到工单提到的设备对象 let engineer = that.userlist.find((u) => { return u.oid === wo.engineerOid; }); //找到工单提到的用户对象 // 如果设备对象不为空则补充设备的代号到工单中 wo.assetId = typeof asset !== "undefined" ? asset.id : "未知"; // 如果用户对象不为空则补充用户的名称到工单中 wo.engineerName = typeof engineer !== "undefined" ? engineer.displayName : "未知"; return wo; }); } }); }, methods: { openWorkOrder(wo) { // 打开工单对象 let opr = { targetClass: "WorkOrder", // 设定目标类的名字 authority: "editWO", // 设定需要执行的操作英文名 conditionExpre: `and obj.oid = '${wo.oid}'`, // 打开当前被传入的工单 displayName: "工单详情", // 设置弹出页签的标题 viewName: "SingleWO", // 打开对象的表单名 action: "edit", // 打开页签对应的动作:edit, visit, create params: "", // 表单打开的处理设置 }; // 打开工单对象 this.root.openTab(opr); }, getdate(ts) { if (ts == "") return "--"; var now = new Date(ts), y = now.getFullYear(), m = now.getMonth() + 1, d = now.getDate(); return ( y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d) + " " + now.toTimeString().substr(0, 8) ); }, }, }; </script> <style> .ivu-timeline { margin-left: 20px; margin-top: 20px; } </style> |
...
代码块 | ||
---|---|---|
| ||
config: ignore: info: part-web: name: common cname: common forms: #operations: 下面是关于操作的配置,在operations文件夹下增加一个新的操作vue文件的时候,需要在下面增加配置以便正确装配 operations:commonOpr.vue: name: #...commonOpr.vue: commonOprcommonOpr cname: "入门插件" buttonOpr.vue: name: buttonOpr cname: "进阶插件" dependencies: {} |
4 小结
本章深入介绍了操作插件和按钮插件的开发,要点如下:
...