<template>
  <view style="width: 100%; height: 100vh">
    <zj-page-container>
      <zj-page-fill>
        <view class="accessories_nfo_card_view" v-if="info">
          <view class="accessories_nfo_card">
            <view class="accessories_nfo_card_title">
              <text>转销售单信息</text>
              <text class="colorts">
                {{ ['待审核', '已经审核', '驳回'][['SUBMIT', 'AGREE', 'REJECT'].indexOf(info.flag)] }}
              </text>
            </view>
            <view class="accessories_nfo_card_title"> 配件费用信息 </view>
            <view class="accessories_list_card">
              <view
                class="accessories_list_a accessories_list_a_ts"
                v-for="(item, index) in info.partsChangeSalesItemList || []"
                :key="index"
              >
                <view class="accessories_list_a_info">
                  <view>
                    {{ item.partsName }}
                  </view>
                  <view> </view>
                  <view> ￥{{ info.totalAmount }} </view>
                </view>
              </view>
            </view>
          </view>
          <!-- 申请信息 -->
          <view class="accessories_nfo_card">
            <view class="accessories_nfo_card_title"> 申请信息 </view>
            <view class="accessories_nfo_ac">
              <view class="accessories_nfo_title"> 申请人: </view>
              <view class="accessories_nfo_info">
                <view> {{ info.workerName }}({{ info.workerId }}) </view>
              </view>
            </view>
            <view class="accessories_nfo_ac">
              <view class="accessories_nfo_title"> 网点: </view>
              <view class="accessories_nfo_info">
                <view> {{ info.shopName }}({{ info.shopId }}) </view>
              </view>
            </view>
            <template v-if="~['AGREE', 'REJECT'].indexOf(info.flag)">
              <view class="accessories_nfo_ac">
                <view class="accessories_nfo_title"> 审批人: </view>
                <view class="accessories_nfo_info">
                  <view>
                    {{ info.examineBy }}
                  </view>
                </view>
              </view>
              <view class="accessories_nfo_ac">
                <view class="accessories_nfo_title"> 审批结果: </view>
                <view class="accessories_nfo_info">
                  <view>
                    {{ info.flagName }}
                  </view>
                </view>
              </view>
              <view class="accessories_nfo_ac">
                <view class="accessories_nfo_title"> 审批备注: </view>
                <view class="accessories_nfo_info">
                  <view>
                    {{ info.examineRemark }}
                  </view>
                </view>
              </view>
            </template>
          </view>
        </view>
      </zj-page-fill>
    </zj-page-container>
  </view>
</template>

<script>
import zjPageContainer from '@/components/zj-page-container/zj-page-container.vue'
import zjPageFill from '@/components/zj-page-container/zj-page-fill.vue'
export default {
  components: {
    zjPageContainer,
    zjPageFill
  },
  data() {
    return {
      info: null
    }
  },
  onLoad: function (option) {
    this.getDetails(option.changeSalesNo)
  },
  methods: {
    getDetails(changeSalesNo) {
      this.$api
        .get('/app/worker/change-sales/detail', {
          changeSalesNo
        })
        .then(res => {
          this.info = res.data
        })
        .catch(() => {})
    }
  }
}
</script>

<style scoped lang="scss">
@import '@/static/style/accessories_nfo_card.scss';
</style>
