|
|
@@ -1,209 +1,219 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <el-tabs v-model="activePosition">
|
|
|
- <el-tab-pane label="选光头" name="光头" :disabled="activePosition!='光头'">
|
|
|
- <div class="dialog-content">
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label">驱动方式:</div>
|
|
|
- <MySelect :isClear="false" @click="guangtouChange();Search('guangtouParam','drivetype')" :options="drivetype" v-model="guangtouParam.content.where.drivetype"></MySelect>
|
|
|
- </div>
|
|
|
+ <div class="drawer__panel">
|
|
|
+ <div class="my-steps">
|
|
|
+ <el-steps size="small" :active="active" finish-status="finish" process-status="wait">
|
|
|
+ <el-step v-for="(item,index) in items" :key="index">
|
|
|
+ <span slot="title">{{item.title}}</span>
|
|
|
+ </el-step>
|
|
|
+ </el-steps>
|
|
|
+ </div>
|
|
|
+ <div class="product-info" v-show="active != 4">
|
|
|
+ <div class="title">配置概要</div>
|
|
|
+ <div class="info-content">
|
|
|
+ <div class="info-item" style="width: 50%;margin-bottom: 16px">
|
|
|
+ <div class="info-title">
|
|
|
+ <div class="title">光头</div>
|
|
|
+ <span v-show="!!resultArr[0]" @click="active=1;resultArr=[];fujianArr=[]">
|
|
|
+ <img src="@/assets/重选.svg" alt="">
|
|
|
+ 重选
|
|
|
+ </span>
|
|
|
</div>
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label">公称通径:</div>
|
|
|
- <el-select filterable v-model="guangtouParam.content.where.caliber" placeholder="请选择公称通径" size="small" style="width:100%" clearable @change="Search('guangtouParam','caliber')">
|
|
|
- <el-option v-for="item in caliber" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
- <div class="item">
|
|
|
- <div class="label">公称压力:</div>
|
|
|
- <el-select filterable @change="Search('guangtouParam','nominalpressure')" :disabled="!guangtouParam.content.where.caliber" v-model="guangtouParam.content.where.nominalpressure" placeholder="请选择公称压力" size="small" style="width:100%" clearable>
|
|
|
- <el-option v-for="item in nominalpressure" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
+ <div class="name" v-if="resultArr[0]">{{ resultArr[0].itemname}}</div>
|
|
|
+ <div class="name" v-else>暂无</div>
|
|
|
+ </div>
|
|
|
+ <div class="info-item" style="width: 50%;">
|
|
|
+ <div class="info-title">
|
|
|
+ <div class="title">执行器</div>
|
|
|
+ <span v-show="!!resultArr[1]" @click="active=2;resultArr.splice(1);fujianArr=[]">
|
|
|
+ <img src="@/assets/重选.svg" alt="">
|
|
|
+ 重选
|
|
|
+ </span>
|
|
|
</div>
|
|
|
-
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label">连接方式:</div>
|
|
|
- <MySelect @click="Search('guangtouParam','connection')" :disabled="!guangtouParam.content.where.nominalpressure" :options="connection" v-model="guangtouParam.content.where.connection"></MySelect>
|
|
|
- </div>
|
|
|
+ <div class="name" v-if="resultArr[1]">{{ resultArr[1].itemname}} {{ guangtouParam.content.where.drivetype == '电动' ? ` + 减速箱：${resultArr[1].gearboxname}` : '' }}</div>
|
|
|
+ <div class="name" v-else>暂无</div>
|
|
|
+ </div>
|
|
|
+ <div class="info-item" style="width: 100%;">
|
|
|
+ <div class="info-title">
|
|
|
+ <div class="title">辅件</div>
|
|
|
</div>
|
|
|
-
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label">阀体材质:</div>
|
|
|
- <el-select filterable @change="Search('guangtouParam','bodymaterial')" :disabled="!guangtouParam.content.where.connection" v-model="guangtouParam.content.where.bodymaterial" placeholder="请选择阀体材质" size="small" style="width:100%" clearable>
|
|
|
- <el-option v-for="item in bodymaterial" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
- <div class="item">
|
|
|
- <div class="label">阀杆材质:</div>
|
|
|
- <el-select filterable @change="Search('guangtouParam','stemmaterial')" :disabled="!guangtouParam.content.where.bodymaterial" v-model="guangtouParam.content.where.stemmaterial" placeholder="请选择阀杆材质" size="small" style="width:100%" clearable>
|
|
|
- <el-option v-for="item in stemmaterial" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
- <div class="item">
|
|
|
- <div class="label">阀座材质:</div>
|
|
|
- <el-select filterable @change="Search('guangtouParam','plinthmaterial')" :disabled="!guangtouParam.content.where.stemmaterial" v-model="guangtouParam.content.where.plinthmaterial" placeholder="请选择阀座材质" size="small" style="width:100%" clearable>
|
|
|
- <el-option v-for="item in plinthmaterial" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
+ <div style="display: flex" v-if="fujianArr.length">
|
|
|
+ <el-tag size="small" closable v-for="item in fujianArr" :key="item.itemid" style="margin-right: 10px" @close="handleClose(item)">{{ item.itemname }}：{{ item.model }}</el-tag>
|
|
|
</div>
|
|
|
-
|
|
|
-
|
|
|
- <!--光头-->
|
|
|
- <MyTable :height="tableHeight" ref="guangtouRef" :layout="tool.tabelCol($route.name)['guangtouTable'].tablecols" :param="guangtouParam" :opwidth="200" :custom="true" style="margin-top: 25px">
|
|
|
- <template v-slot:customcol="scope">
|
|
|
- <p>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
- </template>
|
|
|
- <template v-slot:opreation="scope">
|
|
|
- <el-button type="text" size="mini" @click="selectTarget(scope.data,'主阀')" :disabled="!guangtouParam.content.where.drivetype">选择</el-button>
|
|
|
- </template>
|
|
|
- </MyTable>
|
|
|
+ <div class="name" v-else>暂无</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--选光头-->
|
|
|
+ <div class="dialog-content" v-show="active == 1">
|
|
|
+ <div class="option-line">
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">驱动方式:</div>
|
|
|
+ <MySelect :isClear="false" @click="guangtouChange" :options="drivetype" v-model="guangtouParam.content.where.drivetype"></MySelect>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="option-line">
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">公称通径:</div>
|
|
|
+ <el-select filterable v-model="guangtouParam.content.where.caliber" placeholder="请选择公称通径" size="small" style="width:100%" clearable @change="Search('guangtouParam','caliber')">
|
|
|
+ <el-option v-for="item in caliber" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">公称压力:</div>
|
|
|
+ <el-select filterable @change="Search('guangtouParam','nominalpressure')" :disabled="!guangtouParam.content.where.caliber" v-model="guangtouParam.content.where.nominalpressure" placeholder="请选择公称压力" size="small" style="width:100%" clearable>
|
|
|
+ <el-option v-for="item in nominalpressure" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
+ </el-select>
|
|
|
</div>
|
|
|
- </el-tab-pane>
|
|
|
-
|
|
|
- <el-tab-pane label="选执行器" name="执行器" :disabled="activePosition!='执行器'">
|
|
|
- <div class="dialog-content">
|
|
|
-
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label">光头:</div>
|
|
|
- <MySelect
|
|
|
- v-if="resultArr.length"
|
|
|
- :higit="true"
|
|
|
- :options="[{
|
|
|
- remarks:`${resultArr[0].itemname}`,value:`${resultArr[0].itemid}`
|
|
|
- }]"
|
|
|
- v-model="gangtou"
|
|
|
- :isClear="false"
|
|
|
- >
|
|
|
- <el-button slot="custom" type="text" size="mini" @click="activePosition='光头';isFujianShow=false;resultArr=[]">重选</el-button>
|
|
|
- </MySelect>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
|
|
|
- <div class="option-line" v-if="guangtouParam.content.where.drivetype=='气动'">
|
|
|
- <div class="item">
|
|
|
- <div class="label">驱动方式:</div>
|
|
|
- <MySelect :isClear="false" :options="[{remarks:'气动调节',value:'气动调节'},{remarks:'气动开关',value:'气动开关'}]" v-model="excelParam.content.where.drivetype"></MySelect>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">连接方式:</div>
|
|
|
+ <MySelect @click="Search('guangtouParam','connection')" :disabled="!guangtouParam.content.where.nominalpressure" :options="connection" v-model="guangtouParam.content.where.connection"></MySelect>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label">品牌:</div>
|
|
|
- <MySelect @click="Search('excelParam','actuatorbrand')" :options="actuatorbrand" v-model="excelParam.content.where.actuatorbrand"></MySelect>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div class="option-line">
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">阀体材质:</div>
|
|
|
+ <el-select filterable @change="Search('guangtouParam','bodymaterial')" :disabled="!guangtouParam.content.where.connection" v-model="guangtouParam.content.where.bodymaterial" placeholder="请选择阀体材质" size="small" style="width:100%" clearable>
|
|
|
+ <el-option v-for="item in bodymaterial" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">阀杆材质:</div>
|
|
|
+ <el-select filterable @change="Search('guangtouParam','stemmaterial')" :disabled="!guangtouParam.content.where.bodymaterial" v-model="guangtouParam.content.where.stemmaterial" placeholder="请选择阀杆材质" size="small" style="width:100%" clearable>
|
|
|
+ <el-option v-for="item in stemmaterial" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">阀座材质:</div>
|
|
|
+ <el-select filterable @change="Search('guangtouParam','plinthmaterial')" :disabled="!guangtouParam.content.where.stemmaterial" v-model="guangtouParam.content.where.plinthmaterial" placeholder="请选择阀座材质" size="small" style="width:100%" clearable>
|
|
|
+ <el-option v-for="item in plinthmaterial" :key="item.value" :value="item.value" :label="item.remarks"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--光头-->
|
|
|
+ <MyTable :height="tableHeight" ref="guangtouRef" :layout="tool.tabelCol($route.name)['guangtouTable'].tablecols" :param="guangtouParam" :opwidth="200" :custom="true" style="margin-top: 25px">
|
|
|
+ <template v-slot:customcol="scope">
|
|
|
+ <p>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
+ </template>
|
|
|
+ <template v-slot:opreation="scope">
|
|
|
+ <el-button type="text" size="mini" @click="selectTarget(scope.data,'主阀')" :disabled="!guangtouParam.content.where.drivetype">选择</el-button>
|
|
|
+ </template>
|
|
|
+ </MyTable>
|
|
|
+ </div>
|
|
|
+ <!--选执行器-->
|
|
|
+ <div class="dialog-content" v-show="active == 2">
|
|
|
+ <div class="option-line" v-if="guangtouParam.content.where.drivetype=='气动'">
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">驱动方式:</div>
|
|
|
+ <MySelect :isClear="false" :options="[{remarks:'气动调节',value:'气动调节'},{remarks:'气动开关',value:'气动开关'}]" v-model="excelParam.content.where.drivetype"></MySelect>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
|
|
|
- <div class="option-line" v-show="guangtouParam.content.where.drivetype=='气动'">
|
|
|
- <div class="item">
|
|
|
- <div class="label">功能:</div>
|
|
|
- <MySelect :disabled="!excelParam.content.where.actuatorbrand" @click="Search('excelParam','func')" :options="func" v-model="excelParam.content.where.func"></MySelect>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div class="option-line">
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">品牌:</div>
|
|
|
+ <MySelect @click="Search('excelParam','actuatorbrand')" :options="actuatorbrand" v-model="excelParam.content.where.actuatorbrand"></MySelect>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
|
|
|
- <div class="option-line" v-show="guangtouParam.content.where.drivetype=='气动'">
|
|
|
- <div class="item">
|
|
|
- <div class="label">结构:</div>
|
|
|
- <MySelect :disabled="!excelParam.content.where.func" @click="Search('excelParam','bodystructure')" :options="bodystructure" v-model="excelParam.content.where.bodystructure"></MySelect>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div class="option-line" v-show="guangtouParam.content.where.drivetype=='气动'">
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">功能:</div>
|
|
|
+ <MySelect :disabled="!excelParam.content.where.actuatorbrand" @click="Search('excelParam','func')" :options="func" v-model="excelParam.content.where.func"></MySelect>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
|
|
|
- <!--执行器-->
|
|
|
- <MyTable :height="tableHeight" :noQuery="true" ref="excelRef" :layout="guangtouParam.content.where.drivetype=='电动'?tool.tabelCol($route.name)['excelTable1'].tablecols:tool.tabelCol($route.name)['excelTable2'].tablecols" :param="excelParam" :opwidth="200" :custom="true" style="margin-top: 25px">
|
|
|
- <template v-slot:customcol="scope">
|
|
|
- <p v-if="scope.column.columnname == 'matchratio'" style="color:red">{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
- <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
- </template>
|
|
|
- <template v-slot:opreation="scope">
|
|
|
- <el-button type="text" size="mini" @click="selectTarget(scope.data,'执行器')">选择</el-button>
|
|
|
- </template>
|
|
|
- </MyTable>
|
|
|
+ <div class="option-line" v-show="guangtouParam.content.where.drivetype=='气动'">
|
|
|
+ <div class="item">
|
|
|
+ <div class="label">结构:</div>
|
|
|
+ <MySelect :disabled="!excelParam.content.where.func" @click="Search('excelParam','bodystructure')" :options="bodystructure" v-model="excelParam.content.where.bodystructure"></MySelect>
|
|
|
</div>
|
|
|
- </el-tab-pane>
|
|
|
+ </div>
|
|
|
|
|
|
- <el-tab-pane label="选辅件" name="辅件" :disabled="activePosition!='辅件'" v-if="isFujianShow">
|
|
|
- <div class="dialog-content">
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label">光头:</div>
|
|
|
- <MySelect
|
|
|
- v-if="resultArr.length"
|
|
|
- :higit="true"
|
|
|
- :options="[{remarks:`${resultArr[0].itemname}`,value:`${resultArr[0].itemid}`}]"
|
|
|
- v-model="gangtou"
|
|
|
- :isClear="false"
|
|
|
- >
|
|
|
- <el-button slot="custom" type="text" size="mini" @click="activePosition='光头';isFujianShow=false;resultArr=[];fujianArr=[]">重选</el-button>
|
|
|
- </MySelect>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label">执行器:</div>
|
|
|
- <MySelect
|
|
|
- v-if="resultArr.length>=2"
|
|
|
- :higit="true"
|
|
|
- :options="[{remarks:resultArr[1].actuatormodel,value:resultArr[1].itemid}]"
|
|
|
- v-model="excel"
|
|
|
- :isClear="false"
|
|
|
- >
|
|
|
- <el-button slot="custom" type="text" size="mini" @click="activePosition='执行器';resultArr.splice(1);fujianArr=[]">重选</el-button>
|
|
|
- </MySelect>
|
|
|
+ <!--执行器-->
|
|
|
+ <MyTable :height="tableHeight" :noQuery="true" ref="excelRef" :layout="guangtouParam.content.where.drivetype=='电动'?tool.tabelCol($route.name)['excelTable1'].tablecols:tool.tabelCol($route.name)['excelTable2'].tablecols" :param="excelParam" :opwidth="200" :custom="true" style="margin-top: 25px">
|
|
|
+ <template v-slot:customcol="scope">
|
|
|
+ <p v-if="scope.column.columnname == 'matchratio'" style="color:red">{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
+ <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
+ </template>
|
|
|
+ <template v-slot:opreation="scope">
|
|
|
+ <el-button type="text" size="mini" @click="selectTarget(scope.data,'执行器')" :disabled="(loading) || (guangtouParam.content.where.drivetype=='电动' && resultArr.length == 2)">选择</el-button>
|
|
|
+ </template>
|
|
|
+ </MyTable>
|
|
|
+ </div>
|
|
|
+ <!--选辅件-->
|
|
|
+ <div class="dialog-content" v-show="active == 3">
|
|
|
+ <MyTable :noQuery="true" ref="fujianRef" :height="tableHeight" :layout="tool.tabelCol($route.name)['itemList'].tablecols" :param="fujianParam" :opwidth="200" :custom="true" style="margin-top: 25px">
|
|
|
+ <template v-slot:customcol="scope">
|
|
|
+ <p>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
+ </template>
|
|
|
+ <template v-slot:opreation="scope">
|
|
|
+ <el-button type="text" size="mini" @click="selectTarget(scope.data,'辅件')" :disabled="loading">选择</el-button>
|
|
|
+ </template>
|
|
|
+ </MyTable>
|
|
|
+ </div>
|
|
|
+ <div class="dialog-content" v-if="active == 4">
|
|
|
+ <table bgcolor="#FAFAFA" cellpadding="0" style="width: 100%;" class="result">
|
|
|
+ <tr style="width: 100px;">
|
|
|
+ <td class="title">光头</td>
|
|
|
+ <td>
|
|
|
+ <div class="text1" style="margin-bottom: 8px;">{{ resultArr[0] && resultArr[0].itemname}}</div>
|
|
|
+ <div class="descript">
|
|
|
+ <div class="item">料号：{{ resultArr[0] && resultArr[0].itemno }}</div>
|
|
|
+ <div class="item">扭矩：{{ resultArr[0] && resultArr[0].torque }}</div>
|
|
|
+ <div class="item">法兰号：{{ resultArr[0] && resultArr[0].flh }}</div>
|
|
|
+ <div class="item">阀杆尺寸：{{ resultArr[0] && resultArr[0].stemmaterial }}</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <div class="label" style="width:50px !important">辅件:</div>
|
|
|
- <div style="display: flex">
|
|
|
- <el-tag size="small" closable v-for="item in fujianArr" :key="item.itemid" style="margin-right: 10px" @close="handleClose(item)">{{ item.model }}:{{ item.itemname }}</el-tag>
|
|
|
- </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="title">执行器</td>
|
|
|
+ <td>
|
|
|
+ <div class="text1" style="margin-bottom: 8px;">{{ resultArr[1] && resultArr[1].actuatormodel }} {{guangtouParam.content.where.drivetype == '电动' ? ` + 减速箱：${resultArr[1] && resultArr[1].gearboxname}` : '' }}</div>
|
|
|
+ <div class="descript">
|
|
|
+ <div class="item">输出扭矩：{{ resultArr[1] && resultArr[1].torque }}</div>
|
|
|
+ <div class="item">开关时间：{{ resultArr[1] && resultArr[1].maxruntime }}</div>
|
|
|
+ <div class="item">转速：{{ resultArr[1] && resultArr[1].speed }}</div>
|
|
|
+ <div class="item">圆阀杆直径：{{ resultArr[1] && resultArr[1].maxrounddiameter }}</div>
|
|
|
+ <div class="item">方阀杆直径：{{ resultArr[1] && resultArr[1].maxsquarewidth }}</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="title">辅件</td>
|
|
|
+ <td style="padding: 0;">
|
|
|
+ <tr style="border-bottom: 1px solid #DDDDDD;" class="custom-table">
|
|
|
+ <div>定位器</div>
|
|
|
+ <div class="text1">{{ resultArr.filter(item => item.itemname == '定位器').length ? resultArr.filter(item => item.itemname == '定位器')[0].model : '暂无' }}</div>
|
|
|
+ <div>电磁阀</div>
|
|
|
+ <div class="text1">{{ resultArr.filter(item => item.itemname == '电磁阀').length ? resultArr.filter(item => item.itemname == '电磁阀')[0].model : '暂无' }}</div>
|
|
|
+ </tr>
|
|
|
|
|
|
- <!--辅件-->
|
|
|
- <MyTable :noQuery="true" ref="fujianRef" :height="tableHeight" :layout="tool.tabelCol($route.name)['itemList'].tablecols" :param="fujianParam" :opwidth="200" :custom="true" style="margin-top: 25px">
|
|
|
- <template v-slot:customcol="scope">
|
|
|
- <p>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
- </template>
|
|
|
- <template v-slot:opreation="scope">
|
|
|
- <el-button type="text" size="mini" @click="selectTarget(scope.data,'辅件')" :disabled="loading">选择</el-button>
|
|
|
- </template>
|
|
|
- </MyTable>
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="确认配置" name="配置" :disabled="activePosition!='配置'">
|
|
|
- <div class="dialog-content">
|
|
|
- <div class="option-line">
|
|
|
- <div class="item">
|
|
|
- <span class="label" style="font-weight: bold">成品料号:</span>
|
|
|
- <span style="color: #3874f6;font-size: 14px;font-weight: bold">{{ Object.keys(product).length ? product.itemno||'暂无成品' : '' }}</span>
|
|
|
- </div>
|
|
|
- <div class="item">
|
|
|
- <span class="label" style="font-weight: bold">{{product.itemno?'牌价':'预估价格'}}:</span>
|
|
|
- <span style="color: red;font-size: 14px;font-weight: bold">{{ Object.keys(product).length ? tool.formatAmount(product.price,2) : 'xxxxxx' }}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <MyTable height="400" ref="resultTable" :layout="tool.tabelCol($route.name)['reslutList'].tablecols" :data="resultArr" :opwidth="200" :custom="true" style="margin-top: 25px">
|
|
|
- <template v-slot:customcol="scope">
|
|
|
- <p v-if="scope.column.columnname == 'model'">{{ scope.column.data.actuatormodel }}</p>
|
|
|
- <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
- </template>
|
|
|
- </MyTable>
|
|
|
- </div>
|
|
|
-
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
+ <tr class="custom-table">
|
|
|
+ <div>限位开关</div>
|
|
|
+ <div class="text1">{{ resultArr.filter(item => item.itemname == '限位开关').length ? resultArr.filter(item => item.itemname == '限位开关')[0].model : '暂无' }}</div>
|
|
|
+ <div>过滤减压阀</div>
|
|
|
+ <div class="text1">{{ resultArr.filter(item => item.itemname == '过滤减压阀').length ? resultArr.filter(item => item.itemname == '过滤减压阀')[0].model : '暂无' }}</div>
|
|
|
+ </tr>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="title">成品料号</td>
|
|
|
+ <td class="text1">{{ Object.keys(product).length ? product.itemno||'暂无成品' : '' }}</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="title">{{product.itemno?'牌价':'预估价格'}}</td>
|
|
|
+ <td class="text2">￥{{ Object.keys(product).length ? tool.formatAmount(product.price,2) : 'xxxxxx' }}</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
|
|
|
- <div class="dialog-footer">
|
|
|
+ <div class="fixed__btn__panel">
|
|
|
<el-button size="small" @click="close" class="normal-btn-width">取 消</el-button>
|
|
|
- <el-button size="small" type="primary" @click="activePosition='配置'" class="normal-btn-width" v-if="activePosition == '辅件'" :disabled="$refs.fujianRef.list.length!= 0">下一步</el-button>
|
|
|
- <el-button size="small" type="primary" @click="onSubmit" class="normal-btn-width" v-if="activePosition == '配置'">加入{{ position }}</el-button>
|
|
|
+ <el-button size="small" @click="guangtouParam.content.where.drivetype == '电动' ? active = 2 : active = 3" type="primary" v-if="active == 4" class="normal-btn-width">上一步</el-button>
|
|
|
+ <el-button size="small" type="primary" @click="active=4" class="normal-btn-width" v-if="active == 3" :disabled="$refs.fujianRef.list.length!= 0">下一步</el-button>
|
|
|
+ <el-button size="small" type="primary" @click="onSubmit" class="normal-btn-width" v-if="active == 4">确认添加</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -211,18 +221,24 @@
|
|
|
<script>
|
|
|
import MySelect from '@/optionSystem/FProductManage/modules/select.vue'
|
|
|
import MyTable from '@/optionSystem/FProductManage/modules/table.vue'
|
|
|
+import Steps from '@/optionSystem/FProductManage/modules/Steps.vue'
|
|
|
export default {
|
|
|
props:['position'],
|
|
|
- components:{MySelect,MyTable},
|
|
|
+ components:{MySelect,MyTable,Steps},
|
|
|
inject:['valvetype'],
|
|
|
data () {
|
|
|
return {
|
|
|
- tableHeight:'200px',
|
|
|
+ items: [
|
|
|
+ {title:'选光头',value:'光头'},
|
|
|
+ {title:'选执行器',value:'执行器'},
|
|
|
+ {title:'选辅件',value:'辅件'},
|
|
|
+ {title:'确认配置',value:'配置'}
|
|
|
+ ],
|
|
|
+ active:1,
|
|
|
+ tableHeight:'400px',
|
|
|
excel:'',
|
|
|
gangtou:'',
|
|
|
resultArr:[],
|
|
|
- activePosition:'光头',
|
|
|
-
|
|
|
caliber:[],
|
|
|
nominalpressure:[],
|
|
|
connection:[],
|
|
|
@@ -272,7 +288,7 @@ export default {
|
|
|
"id": 20240718162102,
|
|
|
"content": {
|
|
|
"pageNumber": 1,
|
|
|
- "pageSize": 20,
|
|
|
+ "pageSize": 9999999,
|
|
|
"where": {
|
|
|
"condition": "",
|
|
|
"caliber": "", //公称通径
|
|
|
@@ -291,7 +307,7 @@ export default {
|
|
|
"content": {
|
|
|
"itemid": "",//光头id
|
|
|
"pageNumber": 1,
|
|
|
- "pageSize": 20,
|
|
|
+ "pageSize": 9999999,
|
|
|
"where": {
|
|
|
"condition1": "",
|
|
|
"condition2": "",
|
|
|
@@ -324,8 +340,8 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
- activePosition (val) {
|
|
|
- if (val == '配置') {
|
|
|
+ active (val) {
|
|
|
+ if (val == 4) {
|
|
|
if (this.guangtouParam.content.where.drivetype == '电动') {
|
|
|
if (this.resultArr[1].gearboxid) this.resultArr.push({parttype:'减速箱',itemid:this.resultArr[1].gearboxid,itemname:this.resultArr[1].gearboxname,actuatorbrand:this.resultArr[1].gearboxbrand})
|
|
|
}
|
|
|
@@ -347,7 +363,7 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
close () {
|
|
|
- this.activePosition = '光头'
|
|
|
+ this.active = 1
|
|
|
this.guangtouParam.content.where.drivetype = '电动'
|
|
|
this.resultArr = []
|
|
|
this.fujianArr = []
|
|
|
@@ -458,7 +474,7 @@ export default {
|
|
|
"content": {
|
|
|
"itemid": 0,//光头id
|
|
|
"pageNumber": 1,
|
|
|
- "pageSize": 20,
|
|
|
+ "pageSize": 9999999,
|
|
|
"where": {
|
|
|
"condition1": "",
|
|
|
"condition2": "",
|
|
|
@@ -478,7 +494,7 @@ export default {
|
|
|
"id": 20240718162302,
|
|
|
"content": {
|
|
|
"pageNumber": 1,
|
|
|
- "pageSize": 20,
|
|
|
+ "pageSize": 9999999,
|
|
|
"where": {
|
|
|
"condition1": "",
|
|
|
"torque": "", //阀门扭矩
|
|
|
@@ -546,7 +562,6 @@ export default {
|
|
|
data.parttype = type
|
|
|
this.resultArr.push(data)
|
|
|
if (type == '主阀') {
|
|
|
- if (this.guangtouParam.content.where.drivetype == '气动') this.isFujianShow = true
|
|
|
this.guangtouChange(this.guangtouParam.content.where.drivetype)
|
|
|
this.excelParam.content.itemid = data.itemid
|
|
|
this.excelParam.content.where.torque = data.torque
|
|
|
@@ -561,9 +576,7 @@ export default {
|
|
|
this.func = this.$refs.excelRef.list[0].option.func
|
|
|
})
|
|
|
})
|
|
|
-
|
|
|
-
|
|
|
- this.activePosition = '执行器'
|
|
|
+ this.active = 2
|
|
|
} else if (type == '执行器') {
|
|
|
this.resultArr[1].itenname = this.resultArr[1].actuatorname
|
|
|
this.resultArr[1].itemno = this.resultArr[1].actuatorno
|
|
|
@@ -575,11 +588,11 @@ export default {
|
|
|
}
|
|
|
data.itemid = data.actuatorid
|
|
|
data.itemname = data.actuatorname
|
|
|
- if (this.isFujianShow) {
|
|
|
- this.activePosition = '辅件'
|
|
|
+ if (this.guangtouParam.content.where.drivetype == '气动') {
|
|
|
+ this.active = 3
|
|
|
this.$refs.fujianRef.listData()
|
|
|
} else {
|
|
|
- this.activePosition = '配置'
|
|
|
+ this.active = 4
|
|
|
}
|
|
|
} else {
|
|
|
if (this.fujianArr.filter(item=>item.itemid==data.itemid).length) return
|
|
|
@@ -609,6 +622,14 @@ export default {
|
|
|
|
|
|
this.$refs.fujianRef.listData()
|
|
|
},
|
|
|
+ //重置
|
|
|
+ refresh () {
|
|
|
+ this.resultArr = []
|
|
|
+ this.fujianArr = []
|
|
|
+ this.dialogVisible = false
|
|
|
+ this.active = 1
|
|
|
+ this.items = this.items.splice(0,2)
|
|
|
+ },
|
|
|
//选项
|
|
|
optionsList () {
|
|
|
this.$store.dispatch("optiontypeselect", "caliber").then((res) => {
|
|
|
@@ -662,9 +683,78 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
-
|
|
|
- .product-content {
|
|
|
|
|
|
+ .drawer__panel {
|
|
|
+ padding: 20px 40px !important;
|
|
|
+ font-family: Source Han Sans SC, Source Han Sans SC;
|
|
|
+ }
|
|
|
+ .my-steps {
|
|
|
+ padding: 0px 68px;
|
|
|
+ }
|
|
|
+ .product-info {
|
|
|
+ padding: 16px 20px;
|
|
|
+ border: 1px solid #3874F6;
|
|
|
+ background: rgba(56, 116, 246, 0.08);
|
|
|
+ margin-top: 20px;
|
|
|
+ border-radius: 2px;
|
|
|
+ }
|
|
|
+ .product-info .title {
|
|
|
+ margin-bottom: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ font-size: 16px !important;
|
|
|
+ }
|
|
|
+ .product-info .info-content {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .info-title {
|
|
|
+ margin-bottom: 8px;
|
|
|
+ display: flex;
|
|
|
+ align-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .info-title .title {
|
|
|
+ margin-bottom: 0px !important;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .info-title div {
|
|
|
+ margin-right: 20px;
|
|
|
+ font-size: 14px !important;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .info-title span {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #3874F6 !important;
|
|
|
+ cursor: pointer;
|
|
|
+ display: inline-block;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ align-content: center;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .info-title span img {
|
|
|
+ width: 12px;
|
|
|
+ height: 12px;
|
|
|
+ margin-right: 4px;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .name {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #555555;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .names {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #555555;
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .names div {
|
|
|
+ margin-right: 20px;
|
|
|
+ }
|
|
|
+ .product-info .info-content .info-item .names div span {
|
|
|
+ margin-right: 10px;
|
|
|
}
|
|
|
.product-content .block {
|
|
|
margin-top: 30px;
|
|
|
@@ -710,4 +800,76 @@ export default {
|
|
|
font-size:12px;
|
|
|
color:red;
|
|
|
}
|
|
|
+ table,td,tr {
|
|
|
+ border-collapse: collapse;
|
|
|
+ }
|
|
|
+ td {
|
|
|
+ padding: 20px 20px;
|
|
|
+ }
|
|
|
+ table,td {
|
|
|
+ border: 1px solid #DDDDDD;
|
|
|
+ }
|
|
|
+ .result{
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
+ .result .title {
|
|
|
+ font-family: Source Han Sans SC, Source Han Sans SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #333333;
|
|
|
+ padding: 34px 20px;
|
|
|
+ }
|
|
|
+ .custom-table {
|
|
|
+ border: none;
|
|
|
+ display: flex;
|
|
|
+ height: 64px;
|
|
|
+ align-items: center;
|
|
|
+ align-content: center;
|
|
|
+ }
|
|
|
+ .custom-table div{
|
|
|
+ border-right: 1px solid #DDDDDD;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ align-content: center;
|
|
|
+ padding-left: 20px;
|
|
|
+ }
|
|
|
+ .custom-table div:nth-child(1) {
|
|
|
+ width: 120px;
|
|
|
+ }
|
|
|
+ .custom-table div:nth-child(2) {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ .custom-table div:nth-child(3) {
|
|
|
+ width: 120px;
|
|
|
+ }
|
|
|
+ .custom-table div:nth-child(4) {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ .descript {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ .descript .item {
|
|
|
+ font-family: Source Han Sans SC, Source Han Sans SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333333;
|
|
|
+ margin-right: 40px;
|
|
|
+ }
|
|
|
+ .descript .item:last-child {
|
|
|
+ margin-right: 0 !important;
|
|
|
+ }
|
|
|
+ .text1 {
|
|
|
+ font-family: Source Han Sans SC, Source Han Sans SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #3874F6;
|
|
|
+ }
|
|
|
+ .text2 {
|
|
|
+ font-family: Source Han Sans SC, Source Han Sans SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #E80000;
|
|
|
+ }
|
|
|
+
|
|
|
</style>
|
