smart-admin/rc-busness/pages/personal/quiry.vue

<template>
  <div>
    <Myheader></Myheader>
	<div class="rc-top"></div>
    <div class="rc-layout-container rc-one-column">
      <div class="rc-full-width">
        <div class="rc-receiving rc-max-width--xl">
          <h2 class="rc-beta">{{userisdelivery}}</h2>
          <span>{{orderstatus}}</span>
        </div>
        <div class="online"></div>
        <div v-if="isshow">
			<div class="delivery rc-max-width--xl" v-for="(item, index) in delivery" :key="index" >
				
			  <div class="to-delivery">
				<img src="@/assets/image/ico-case.png" class="rc-icon">
				<span>{{ item.state }}</span>
				<i>{{ item.time }}</i>
			  </div>
			  
			  <div class="rc-layout-container rc-two-column">
				  <div class="bo-delivery rc-column rc-padding-bottom--none">
					<span>{{ item.address }}</span>
				  </div>
				  <div class="viewdetails rc-column rc-padding-bottom--none">
					<span class="ts-right-arr ts-right-arr--two">查看详情</span>
				  </div>
			  </div>
			</div>
		</div>
		<div class="online bold"></div>
        <div
          class="mypersonal rc-max-width--xl"
          v-for="(item, index) in useraddress"
          :key="index"
        >
          <div class="my-delivery">
            <span>{{ item.state }}</span>
            <i>{{ item.tel }}</i>
          </div>
          <div class="per-delivery">
            <span>{{ item.address }}</span>
          </div>
        </div>
		<div class="online bold"></div>
		
        <div class="rc-center rc-max-width--xl" v-for="(item, index) in goldmedal" :key="index">
          <div class="rc-usermain">
            <div class="rc-image">
             <img :src="item.catimage" alt="" /> 
            </div>
            <div class="rc-right">
              <div class="rc-usercenter">
                <em>{{ item.usereat }}</em>
                <div class="rc-userright">
                  <span>规格:{{ item.num }}</span>
                </div>
              </div>
              <div class="rc-userbottom">
                <span>数量:{{ item.orderstype }}件</span>
                <i>￥{{ item.userprice }}</i>
                 <div class="rc-bottom">
				<span class="ts-standard-btn ts-standard-btn--two">联系客服申请售后</span>
				</div>
              </div>
				<div class="rc-bottomm">
					<span class="ts-standard-btn ts-standard-btn--two">联系客服申请售后</span>
				</div>
              <!-- <div class="rc-userbottomm">
                <i>￥{{ item.userprice }}</i>
                <span>{{ item.orderstype }}</span>
                <i>￥{{ item.userprice }}</i>
              </div> -->
            </div>
          </div>
         
        </div>
		<div class="online bold"></div>
        <div class="rc-merchandise rc-max-width--xl">
          <ul>
            <li>
              <span>商品总价:</span>
              <i>{{ shopprice.price }}</i>
            </li>
            <li>
              <span>配送费用:</span>
              <i>{{ shopprice.distribution }}</i>
            </li>
            <li>
              <span>活动促销:</span>
              <i>{{ shopprice.promotion }}</i>
            </li>
            <li>
              <span>实际付款:</span>
              <i>{{ shopprice.payment }}</i>
            </li>
          </ul>
        </div>
		<div class="online bold"></div>
		
        <div class="rc-payment rc-max-width--xl">
          <ul>
            <li>
              <span>订单编号::</span>
              <i>{{ information.reference }}</i>
            </li>
            <li>
              <span>下单时间::</span>
              <i>{{ information.ordertime }}</i>
            </li>
            <li>
              <span>付款方式::</span>
              <i>{{ information.paymentmethod }}</i>
            </li>
            <li>
              <span>配送方式::</span>
              <i>{{ information.distribution }}</i>
            </li>
            <li>
              <span>快递单号:</span>
              <div class="u-trackingnumber">
              <i>{{ information.trackingnumber }}
                  </i>
                   <img :src="information.catimage" alt="">
                  </div>
            </li>
            
          </ul>
        </div>
		<div class="online bold"></div>
		
        <div class="rc-foot rc-max-width--xl">
          <div class="rc-foo">
              <div class="ts-total">
				<i>合计金额:</i>
				<em>￥167.00</em>
               </div>
               <div style="padding-bottom:40px;cursor: pointer;">
               <span class="ts-standard-btn" @click="oncebuy()">再次购买</span>
               </div>
          </div>

        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Myheader from "~/components/header.vue";
export default {
  data() {
    return {
      addressstype: null,
      orderstatus: '您的订单已发货，请耐性等待',
      userisdelivery:'待收货',
      userdelivery: "派送中",
      isshow:true,
      leftico: require("../../assets/image/rc-left.png"),

      delivery: [
        {
          state: "派送中",
          time: "2021-11-21",
          address: "广州天河—刘某某【15124617917】正在派送中",
        },
      ],

      useraddress: [
        {
          state: "李某某",
          tel: "15124117917",
          address: "广东省 广州市 天河区 天河客运站118号",
        },
      ],

      goldmedal: [
        {
          ordernumber: "1111111111111111111",
          orderstype: 1,
          index:0,
          usereat: "英国短毛猫成猫全价湿粮",
          num: "5kg",
          specification: "1",
          userprice: "167.00",
          catimage: require("../../assets/image/rc-win.png"),
        },
      ],
      shopprice: {
        price: "￥197.00",
        distribution: "￥0.00",
        promotion: "-￥30.00",
        payment: "￥167.00",
      },
      information: {
        reference: "1111111111111111",
        ordertime: "2012-12-01    11:20:00",
        paymentmethod: "微信支付",
        distribution: "快递",
        trackingnumber: "11111111111111",
         catimage: require("../../assets/image/rc-left.png"),
      },
    };
  },
  methods: {

    oncebuy(){
                   this.$router.push({
        path: "/myorder/userrecord",
        query: {
          stype: 1,
        },
      });
    }
  },
  mounted() {
    this.addressstype = this.$route.query.stype;
    console.log(this.addressstype);
    if(this.addressstype==1){
        this.orderstatus='您的订单已完成，欢迎您再次购买。';
          this.isshow=false;
          this.userisdelivery='已完成';
          console.log( this.orderstatus);
    }
 
    console.log(this.addressstype);
  },
  components: {
    Myheader,
  },
};
</script>

<style lang="less" scoped>
@import url("../../assets/css/global.less");
@import url("../../assets/css/quiry.less");
</style>