TradeDetail.vue

<template>
  <div class="detail">
    <CommonInfo :tradeData="tradeData"/>
    <!-- 买方审核 -->
    <div v-if="tradeData.tradeStatus > 0">
      <div style="margin: 11px 30px;color: #1890ff;">买方审核</div>
      <el-form label-width="100px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="议价" v-if="!tradeData.socre">{{tradeData.dealPrice}}</el-form-item>
            <el-form-item label="评价" v-else>{{tradeData.tradeScore}}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="成交价">{{tradeData.dealPrice}}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="审核人">{{tradeData.tradeTransactorName}}</el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="说明">{{tradeData.dealRemark}}</el-form-item>
      </el-form>
      <el-divider></el-divider>
    </div>
    <!-- 买方部长确认 -->
    <div v-if="tradeData.tradeStatus > 1">
      <div style="margin: 11px 30px;color: #1890ff;">买方部门长审核</div>
      <el-form label-width="100px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="买方经办人">{{tradeData.tradeTransactorName}}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="评分">{{tradeData.tradeScore?tradeData.tradeScore:"-"}}</el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="交易成交价">{{tradeData.dealPrice}}</el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="审核人">{{tradeData.tradeDeptManagerName}}</el-form-item>
          </el-col>
          <el-col :span="8"></el-col>
        </el-row>
      </el-form>
      <el-divider></el-divider>
    </div>

    <!-- 卖方部长审核 -->
    <div v-if="tradeData.tradeStatus > 2">
      <div style="margin: 11px 30px;color: #1890ff;">部门复核</div>
      <el-form label-width="100px">
        <el-row>
          <el-col :span="8">
            <el-form-item>
              <el-radio v-model="this.tradeData.tradeStatus =='3'?radio ='1':radio='2'" label="1" disabled>通过</el-radio>
              <el-radio v-model="radio" label="2" disabled>不通过</el-radio>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="审核人">{{tradeData.applyDeptManagerName}}</el-form-item>
          </el-col>
          <el-col :span="8"></el-col>
        </el-row>
      </el-form>
      <el-divider></el-divider>
    </div>

  </div>
</template>

<script>
  import CommonInfo from "./CommonInfo";
  import Evaluate from "./Evaluate";
  import Confirm from "./Confirm";
  import Approval from "./Approval";
  export default {
    name: "trade-detail",
    props:{
      tradeData: {
        type: Object
      }
    },
    components:{
      CommonInfo,
      Evaluate,
      Confirm,
      Approval
    }
  }
</script>

<style scoped lang="scss">
  .detail{
    height: 460px;
    overflow-y: auto;
    &::-webkit-scrollbar {
      /* 设置滚动条宽度 */
      width: 4px;
      /* 设置滚动条背景色 */
      //background: black;
    }

    //滚动条轨道
    &::-webkit-scrollbar-track {
      background-color:transparent;
      -webkit-border-radius: 2em;
      -moz-border-radius: 2em;
      border-radius:2em;
    }

    //滚动条滑块
    &::-webkit-scrollbar-thumb {
      background-color: rgb(147,147,153,0.5);
      -webkit-border-radius: 2em;
      -moz-border-radius: 2em;
      border-radius:2em;
    }

  }


</style>