repaireFormatter(row) {
let map = {
0: "未修复",
1: "已修复"
};
return map[Number(row.repairstatus)];
}
},
function statusNameList(val) {
const statusMap = {
"0": "正常",
"1": "异常",
"2": "故障",
"3": "报警",
"6": "屏蔽",
"7": "未知"
};
return statusMap[val] || "未知状态";
}
var a= 数组.filter(function (x, y) { return x.属性 == true }).length;
新建一个utiles里面filier文件
main。js引入
import filter from '@/utils/filter'
Object.keys(filter).forEach(key => Vue.filter(key, filter[key]))
vue页面引入封装的方法
然后直接用
tree的node节点内容太多
/**
* 省略多余字符，用...显示
* @param {String} value
* @param {number} len
*/
export function ellipsis(value, len) {
if (!value) return ''
if (value.length > len) {
return value.slice(0, len) + '...'
}
return value
}
<el-tree
:data="data"
:props="{ label: 'name' }"
@node-click="handleBucketClick"
>
<span slot-scope="{ node }" class="custom-tree-node">
<el-tooltip
class="item"
effect="dark"
:content="node.label"
placement="top-start"
>
<span> {{ node.label | ellipsis(15) }} </span>
</el-tooltip>
<div></div>
</span>
</el-tree>
还有一种根据判断进行过滤return中文值
<div class="spray-search-type-single">
<div class="spray-search-type-single-text">
<!--接口只有一个状态可以使用这个方式
{{ typeDataStyle[item.status].status }} -->
这个是根据两个状态对比的
{{ change(item.status, item.onlineStatus).name }}
</div>
<el-progress
:color="typeDataStyle[item.status].color"
:color="change(item.status, item.onlineStatus).color"
:stroke-width="16"
:percentage="(item.total / total) * 100 || 0"
:show-text="false"
></el-progress>
{{ item.total }}
</div>
typeDataStyle: {
0: {
// status: "正常",
color: "#5cb85c",
},
1: {
// status: "异常",
color: "#909599",
},
2: {
// status: "故障",
color: "#f0ad4e",
},
3: {
// status: "报警",
color: "#d9534f",
},
6: {
// status: "屏蔽",
color: "#00ffff",
},
7: {
// status: "未激活",
color: "#00ffff",
},
},
change(status, onlineStatus) {
if (onlineStatus == "1" && status == "0") {
return "正常";
}
else if (onlineStatus == "1" && status == "1") {
return "异常";
}
else if (onlineStatus == "1" && status == "2") {
return "故障";
}
else if (onlineStatus == "1" && status == "3") {
return "报警";
}
else if (onlineStatus == "2") {
return "离线";
}
else if (onlineStatus == "3") {
return "未激活";
}
},
// 进度条颜色 0 正常 1 异常 2故障 3报警 4离线 5 未激活
progressColor: ["#52cc77", "#f45f5f", "#fdd56a", "#FD866A", "#00ffff", "#746f74a6"],
change(status, onlineStatus) {
if (onlineStatus == "1" && status == "0") {
return {
name: "正常",
color: this.progressColor[status],
};
} else if (onlineStatus == "1" && status == "1") {
return {
name: "异常",
color: this.progressColor[status],
};
} else if (onlineStatus == "1" && status == "2") {
return {
name: "故障",
color: this.progressColor[status],
};
} else if (onlineStatus == "1" && status == "3") {
return {
name: "报警",
color: this.progressColor[status],
};
} else if (onlineStatus == "2") {
return {
name: "离线",
color: this.progressColor[4],
};
} else if (onlineStatus == "3") {
return {
name: "未激活",
color: this.progressColor[5],
};
}
},
