完善系统检索
This commit is contained in:
parent
8bcf74eb0d
commit
481dd4af44
@ -12,7 +12,7 @@ const routes = [
|
||||
meta: {
|
||||
code:"",
|
||||
icon: "sc-icon-Home",
|
||||
title: "搜索",
|
||||
title: "系统搜索",
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
@ -61,3 +61,77 @@
|
||||
.searchInput.focused .el-input-group__prepend{
|
||||
border-color: var(--el-color-primary);
|
||||
}
|
||||
.collapseHeaderBack{
|
||||
width:100%;
|
||||
background: #F5F7FA;
|
||||
}
|
||||
.collapseHeaderNav{
|
||||
width: calc(100% - 21px);
|
||||
display: flex;align-items: center;
|
||||
height: 40px;
|
||||
.item{
|
||||
color: #606266;
|
||||
margin: 0 8px;
|
||||
}
|
||||
.seq{flex-basis: 50px;}
|
||||
}
|
||||
.collapseHeader{
|
||||
width: 100%;
|
||||
display: contents;align-items: center;
|
||||
.item{
|
||||
display: block;
|
||||
margin: 0 8px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
text-align: left;
|
||||
color: #333;
|
||||
font-weight: initial;
|
||||
}
|
||||
.seq{flex-basis: 50px;overflow: hidden;}
|
||||
}
|
||||
.collapseMain .el-collapse-item__content{
|
||||
padding: 0;
|
||||
}
|
||||
.collapseMain .collapseBody{
|
||||
background: #F9FBFD;
|
||||
padding: 8px 8px 18px 8px;
|
||||
.title{
|
||||
font-weight: 600;
|
||||
}
|
||||
.stepView{
|
||||
border-bottom: 1px solid #EAF0F5;
|
||||
padding: 15px 20%;
|
||||
}
|
||||
.orderInfo{
|
||||
padding: 10px 0;
|
||||
font-size: 12px;
|
||||
.el-row{
|
||||
margin-bottom: 6px;
|
||||
.name{
|
||||
width: 65px;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.componentBox{
|
||||
.el-table{
|
||||
background: none;
|
||||
}
|
||||
.el-table__inner-wrapper:before{
|
||||
height: 0;
|
||||
}
|
||||
.el-table .el-table__body-wrapper{
|
||||
background: none;
|
||||
}
|
||||
.el-scrollbar__wrap--hidden-default{
|
||||
background: none;
|
||||
}
|
||||
.el-table__empty-block{
|
||||
width: 100% !important;
|
||||
background: var(--el-color-white);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -25,11 +25,94 @@
|
||||
</el-input>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<sc-table :data="rows" :size="size">
|
||||
<el-table-column type="index" label="序号"></el-table-column>
|
||||
<el-table-column prop="repair_order_no" label="单号"></el-table-column>
|
||||
</sc-table>
|
||||
<el-main v-loading="loading" element-loading-text="加载中...">
|
||||
<el-scrollbar v-model="activeNames" v-if="rows.length>0">
|
||||
<div class="collapseHeaderBack">
|
||||
<div class="collapseHeaderNav">
|
||||
<div class="item seq">序号</div>
|
||||
<div class="item" :style="{'width':item.width+'px'}" v-for="(item,index) in orderColumn" :key="index">{{item.label}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-collapse class="collapseMain" @change="collapseChange" :accordion="true">
|
||||
<template v-for="(item,index) in rows" :key="index">
|
||||
<el-collapse-item :title="item.repair_order_no" :name="item.id">
|
||||
<template #title>
|
||||
<div class="collapseHeader">
|
||||
<div class="item seq">{{index+1}}</div>
|
||||
<div class="item" :style="{'width':em.width+'px'}" v-for="(em,index) in orderColumn" :key="index">
|
||||
<!-- <el-tooltip effect="dark" :content="item[em.prop]"></el-tooltip>-->
|
||||
<span v-if="em.prop == 'business_status'">
|
||||
<span v-for="(li,ind) in statusList" :key="ind">
|
||||
<span :style="{color:li.value==1?`var(--el-order-color-1)`:li.value==2?`var(--el-order-color-2)`:li.value==3?`var(--el-order-color-3)`:li.value==4?`var(--el-order-color-4)`:`var(--el-order-color-5)`}"
|
||||
v-if="li.value == item[em.prop]">{{li.label}}</span>
|
||||
</span>
|
||||
</span>
|
||||
<span v-else>{{item[em.prop]}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="collapseBody">
|
||||
<div class="title">工单详情</div>
|
||||
<div class="stepView">
|
||||
<el-steps class="orderSteps" :active="item.process_num" align-center>
|
||||
<el-step :status="item.status" v-for="(item,index) in item.process_engine" :key="index" :title="item.description" />
|
||||
</el-steps>
|
||||
</div>
|
||||
<div class="orderInfo">
|
||||
<el-row>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">维修单ID:</span><span class="text">{{item.id}}</span>
|
||||
</el-col>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">维修单号:</span><span class="text">{{item.repair_order_no}}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">是否关机:</span><span class="text">{{item.requires_shutdown}}</span>
|
||||
</el-col>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">机房城市:</span><span class="text">{{item.city}}</span>
|
||||
</el-col>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">园区:</span><span class="text">{{item.park_name}}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">机房:</span><span class="text">{{item.data_center_name}}</span>
|
||||
</el-col>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">机架位:</span><span class="text">{{item.rack_position}}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">整机SN:</span><span class="text">{{item.device_sn}}</span>
|
||||
</el-col>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">整机厂商:</span><span class="text">{{item.device_manufacturer}}</span>
|
||||
</el-col>
|
||||
<el-col :span="8" :lg="6">
|
||||
<span class="name">整机型号:</span><span class="text">{{item.device_model}}</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="componentBox">
|
||||
<el-table :data="item.component_info" :size="size" stripe :header-cell-style="{'background': '#1367C1','color':'#fff'}">
|
||||
<el-table-column type="index" label="序号" align="center"></el-table-column>
|
||||
<el-table-column prop="component_serial_no" show-overflow-tooltip label="部件SN/Sp" width="160"></el-table-column>
|
||||
<el-table-column prop="component_manufacturer" show-overflow-tooltip label="部件厂商" width="130"></el-table-column>
|
||||
<el-table-column prop="component_model" show-overflow-tooltip label="部件型号" width="160"></el-table-column>
|
||||
<el-table-column prop="component_pn" show-overflow-tooltip label="部件PN/Sp" width="150"></el-table-column>
|
||||
<el-table-column prop="bd_backup_count" show-overflow-tooltip label="剩余BD数" width="120"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</template>
|
||||
</el-collapse>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
@ -40,40 +123,111 @@ export default {
|
||||
data(){
|
||||
return{
|
||||
size:'small',
|
||||
keyword:"",
|
||||
loading:false,
|
||||
keyword:"Z240919004",
|
||||
params:{
|
||||
repair_order_no:{
|
||||
operator:"like",
|
||||
value:""
|
||||
value:"%Z240919004%"
|
||||
},
|
||||
component_serial_no:{
|
||||
operator:"like",
|
||||
value:""
|
||||
value:"%Z240919004%"
|
||||
},
|
||||
},
|
||||
column:[
|
||||
{width:"",prop:"",label:""}
|
||||
activeNames:[],
|
||||
orderColumn:[
|
||||
{label:"工单号",prop:"repair_order_no",width:160},
|
||||
{label:"客户名称",prop:"customer_name",width:140},
|
||||
{label:"故障描述",prop:"fault_description",width:200},
|
||||
{label:"生产日期",prop:"created_at",width:120},
|
||||
{label:"返厂日期",prop:"warranty_end_date",width:120},
|
||||
{label:"维修等级",prop:"maintenance_grade",width:120},
|
||||
{label:"维修分类",prop:"fault_classification",width:120},
|
||||
{label:"故障类型",prop:"fault_type",width:100},
|
||||
{label:"维保等级",prop:"maintenance_plan",width:100},
|
||||
{label:"是否开机",prop:"requires_shutdown",width:90},
|
||||
{label:"状态",prop:"business_status",width:100},
|
||||
],
|
||||
rows:[]
|
||||
planColumn:[
|
||||
{label:"工单号",prop:"repair_order_no",width:160},
|
||||
{label:"外发日期",prop:"repair_order_no",width:160},
|
||||
{label:"维保商场",prop:"repair_order_no",width:160},
|
||||
{label:"计划时间",prop:"repair_order_no",width:160},
|
||||
{label:"完成时间",prop:"repair_order_no",width:160},
|
||||
{label:"故障类型",prop:"repair_order_no",width:160},
|
||||
{label:"状态",prop:"repair_order_no",width:160},
|
||||
],
|
||||
rows:[],
|
||||
statusList:[],
|
||||
component_info:[]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
this.getStatusList();
|
||||
},
|
||||
methods:{
|
||||
async searchClick() {
|
||||
let params = this.setObj();
|
||||
this.loading = true;
|
||||
const res = await this.$API.orders.order.maintenance.search.post(params);
|
||||
this.loading = false;
|
||||
if(res.code == 200){
|
||||
res.data.forEach(item=>{
|
||||
if(item.process_engine){
|
||||
let obj = this.processList(item.process_engine);
|
||||
item.process_engine = obj.processedList;
|
||||
item.process_num = obj.num;
|
||||
}
|
||||
if(item.component_info && item.component_info.length===0){
|
||||
item.component_info = [
|
||||
{
|
||||
component_serial_no:item.component_serial_no,
|
||||
component_manufacturer:item.component_manufacturer,
|
||||
component_model:item.component_model,
|
||||
component_pn:item.component_pn,
|
||||
bd_backup_count:item.bd_backup_count
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
console.log(res.data,788)
|
||||
this.rows = res.data;
|
||||
}
|
||||
},
|
||||
setObj(){
|
||||
for(let i in this.params){
|
||||
this.params[i].value = this.keyword==""?"":'%'+this.keyword+'%'
|
||||
this.params[i].value = this.keyword===""?"":'%'+this.keyword+'%'
|
||||
}
|
||||
return this.params
|
||||
},
|
||||
collapseChange(){
|
||||
|
||||
},
|
||||
async getStatusList() {
|
||||
const res = await this.$API.orders.order.maintenance.status.post();
|
||||
if (res.code == 200) {
|
||||
this.statusList = res.data;
|
||||
}
|
||||
},
|
||||
processList(list) {
|
||||
let obj = {
|
||||
num:0,
|
||||
processedList:this.$TOOL.objCopy(list)
|
||||
}
|
||||
let foundNodeTrue = false;
|
||||
for (let i = 0; i < obj.processedList.length; i++) {
|
||||
if (obj.processedList[i].node === true) {
|
||||
foundNodeTrue = true;
|
||||
obj.processedList[i].status = 'finish';
|
||||
obj.num = i;
|
||||
} else if (!foundNodeTrue) {
|
||||
obj.processedList[i].status = 'success';
|
||||
}
|
||||
if (foundNodeTrue && obj.processedList[i].node !== true) break;
|
||||
}
|
||||
return obj;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -166,11 +166,11 @@
|
||||
</el-row>
|
||||
<sc-table ref="table" :data="form.component_info" style="width: 100%;" :hidePagination="true" :hideDo="true" :hideEmpty="true" :size="size">
|
||||
<sc-table-column type="index" label="序号" width="65"></sc-table-column>
|
||||
<sc-table-column prop="component_serial_no" label="部件SN/Sp"></sc-table-column>
|
||||
<sc-table-column prop="component_manufacturer" label="部件厂商"></sc-table-column>
|
||||
<sc-table-column prop="component_model" label="部件型号"></sc-table-column>
|
||||
<sc-table-column prop="component_pn" label="部件PN/Sp"></sc-table-column>
|
||||
<sc-table-column prop="bd_backup_count" label="甚于BD数"></sc-table-column>
|
||||
<sc-table-column prop="component_serial_no" label="部件SN/Sp" :show-overflow-tooltip="true" width="160"></sc-table-column>
|
||||
<sc-table-column prop="component_manufacturer" label="部件厂商" :show-overflow-tooltip="true" width="130"></sc-table-column>
|
||||
<sc-table-column prop="component_model" label="部件型号" :show-overflow-tooltip="true" width="160"></sc-table-column>
|
||||
<sc-table-column prop="component_pn" label="部件PN/Sp" :show-overflow-tooltip="true" width="150"></sc-table-column>
|
||||
<sc-table-column prop="bd_backup_count" label="甚于BD数" :show-overflow-tooltip="true" width="120"></sc-table-column>
|
||||
<sc-table-column label="操作" fixed="right" width="120">
|
||||
<template #default="scope">
|
||||
<el-button link type="danger" :size="size" @click="deleteOrder(scope.row,scope.$index)">删除</el-button>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user