<template>
  <div class="app-container">
    <div class="tab-header webtop">
      <div>上装详情</div>
      <div>
        <el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
      </div>
    </div>
    <div class="listconadd">
      <el-form ref="dataForm" :model="formobj" class="formaddcopy02">
        <el-row style="border-top: 1px solid #dfe4ed">
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>车辆功能</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.vehicleTypeValue }}</span></el-form-item>
          </el-col>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>上装名称</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.installNameValue }}</span></el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>委改方式</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.refitMethodValue }}</span></el-form-item>
          </el-col>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>供应商</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.refitFactory }}</span></el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="formobj.baseVehinstallmodel.installNameKey == '08'">
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>冷机品牌</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.coolerBrand }}</span></el-form-item>
          </el-col>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>冷机型号</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.coolerModel }}</span></el-form-item>
          </el-col>
        </el-row>
        <div v-if="formobj.baseVehinstallmodel.installNameKey != '08'">
          <el-row>
            <el-col :span="12">
              <div class="span-sty spanOneWidth"><span>货箱内部尺寸</span></div>
              <el-form-item>
                <div class="addinputInfo addinputwOne" style="display: inline-block;margin-left: 120px;">
                  长<span class="inputStyle">{{ formobj.baseVehinstallmodel.wk_long }}</span>mm,
                  宽<span class="inputStyle">{{ formobj.baseVehinstallmodel.wk_wide }}</span>mm,
                  高<span class="inputStyle">{{ formobj.baseVehinstallmodel.wk_high }}</span>mm
                </div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <div class="span-sty spanOneWidth"><span>颜色</span></div>
              <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.colorValue }}</span></el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <div class="span-sty spanOneWidth"><span>板材材质</span></div>
              <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.plateMaterialValue }}</span></el-form-item>
            </el-col>
            <el-col :span="12">
              <div class="span-sty spanOneWidth"><span>板材厚度</span></div>
              <el-form-item>
                <div class="addinputInfo addinputwOne" style="display: inline-block;margin-left: 120px;">
                  底<span class="inputStyle">{{ formobj.baseVehinstallmodel.plateThicknessBottom }}</span>mm,
                  边<span class="inputStyle">{{ formobj.baseVehinstallmodel.plateThicknessEdge }}</span>mm
                </div>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <div class="span-sty spanOneWidth"><span>篷布滑道</span></div>
              <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.tarpaulinSlide }}</span></el-form-item>
            </el-col>
            <el-col :span="12">
              <div class="span-sty spanOneWidth"><span>冷藏冷机</span></div>
              <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.refrigerator }}</span></el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <div class="span-sty spanOneWidth"><span>自卸液压盖板</span></div>
              <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.selfUnHyCoPl }}</span></el-form-item>
            </el-col>
            <el-col :span="12">
              <div class="span-sty spanOneWidth"><span>底板加热</span></div>
              <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.floorHeating }}</span></el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="span-sty spanOneWidth"><span>更多配置</span></div>
              <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.baseVehinstallmodel.moreConfig }}</span></el-form-item>
            </el-col>
          </el-row>
        </div>
        <el-row>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>主车车架号</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.vinNo }}</span></el-form-item>
          </el-col>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>品牌</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.brandName }}</span></el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>车型</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.vehModel }}</span></el-form-item>
          </el-col>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>公告型号</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.noticeModel }}</span></el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>厂家结算价(元)</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.costPrice }}</span></el-form-item>
          </el-col>
          <el-col :span="12">
            <div class="span-sty spanOneWidth"><span>销售指导价(元)</span></div>
            <el-form-item><span class="addinputInfo addinputwOne">{{ formobj.guidePrice }}</span></el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
  </div>
</template>

<script>
import req from '@/api/shangzhuang/shangzhuang'

export default {
  name: 'shangzhuangtaizhangInfo',
  data() {
    return {
      formobj: {
        sid: '',
        mainSid: '',
        brandSid: '',
        brandName: '',
        noticeModel: '',
        vehModel: '',
        vinNo: '',
        costPrice: '',
        guidePrice: '',
        vehicleStateKey: '',
        vehicleStateValue: '',
        priceDate: '',
        salesDate: '',
        useOrgSid: '',
        createOrg: '',
        baseVehinstallmodel: {
          vehicleTypeValue: '',
          installNameValue: '',
          installNameKey: '',
          refitMethodValue: '',
          refitFactory: '',
          colorValue: '',
          wk_long: '',
          wk_wide: '',
          wk_high: '',
          plateMaterialValue: '',
          plateThicknessBottom: '',
          plateThicknessEdge: '',
          tarpaulinSlide: '',
          refrigerator: '',
          selfUnHyCoPl: '',
          floorHeating: '',
          moreConfig: '',
          coolerBrand: '',
          coolerModel: '',
        }
      }
    }
  },
  methods: {
    handleReturn() {
      this.$emit('doback')
    },
    showInfo(row) {
      req.fetchDetailsBySid(row.sid).then((resp) => {
        this.formobj = resp.data
      }).catch((e) => {
        this.formobj = {}
      })
      console.log('这里是详情回显', row)
    }
  }
}
</script>

<style scoped>
.spanOneWidth {
  width: 110px !important;
}
.addinputwOne {
  margin-left: 110px !important;
}
.inputStyle {
  display: inline-block;
  margin: 0 5px;
}
</style>
