diff --git a/ant-design-vue-jeecg/src/views/shopping/components/Order/placeOrder.vue b/ant-design-vue-jeecg/src/views/shopping/components/Order/placeOrder.vue
index 6fcf475f..76f09151 100644
--- a/ant-design-vue-jeecg/src/views/shopping/components/Order/placeOrder.vue
+++ b/ant-design-vue-jeecg/src/views/shopping/components/Order/placeOrder.vue
@@ -1,4 +1,5 @@
 <template>
+<!--  下单页面-->
   <div class="placeOrder">
     <div class="jz d-flex">
       <div class="leftDiv">
diff --git a/ant-design-vue-jeecg/src/views/shopping/pages/pay.vue b/ant-design-vue-jeecg/src/views/shopping/pages/pay.vue
index f93a147e..9ec4fac7 100644
--- a/ant-design-vue-jeecg/src/views/shopping/pages/pay.vue
+++ b/ant-design-vue-jeecg/src/views/shopping/pages/pay.vue
@@ -1,8 +1,27 @@
 <template>
   <div class="pay">
-    <Header fontColor="#000"></Header>
+<!--    支付页面-->
     <div class="bg">
-
+      <Header></Header>
+      <h1 class="c_fff">感谢您的订购</h1>
+    </div>
+    <div class="jz">
+      <div class="success">
+        <p class="c_1B f_24">您的订单已提交成功</p>
+        <p class="c_999 f_14">请继续支付，15分钟内未付款，订单将自动取消</p>
+        <p class="c_999 f_14">如有疑问，请联系客服</p>
+        <p class="c_1B f_16"><span>1</span><span>4</span><span>:</span><span>5</span><span>2</span></p>
+        <div class="d-flex btnDiv">
+          <div class="dialogButton default c_1B f_12">修改支付方式</div>
+          <div type="primary" class="dialogButton primary   f_12">立即支付</div></div>
+      </div>
+      <p class="orderNum f_16"><span class="f_16">订单编号 # </span>GU202301052604844</p>
+      <p class="date f_16 d-flex">
+        <span class="f_16 c_31">下单日期：  <span>2023/01/05</span></span>
+        <span  class="f_12 c_888">订单状态： 待付款</span>
+        <span class="f_12 c_31">数量: 1</span>
+        <span  class="f_12 c_31">总计： ￥9,900</span>
+      </p>
     </div>
     <Footer></Footer>
   </div>
@@ -23,15 +42,93 @@
   };
 </script>
 <!--<style>-->
-<!--  .news .top .middle .router-link-exact-active.router-link-active {-->
+<!--  .pay .top .middle .router-link-exact-active.router-link-active {-->
 <!--    border-bottom: 2px solid #000;-->
 <!--  }-->
 <!--</style>-->
 <style lang="less" scoped>
   @import '../assets/common.css';
+  .c_888{
+    color: #888;
+  }
+  .c_31{
+    color: #313131;
+  }
+  .btnDiv{
+    justify-content: space-around;
+    .dialogButton {
+      width: 240px;
+      height: 40px;
+      text-align: center;
+      line-height: 40px;
+      transition: all 0.2s;
+    }
+    .default {
+      border: 2px solid #1b1b1b;
+      color: #1b1b1b;
+      margin-right: 20px;
+
+      &:hover {
+        border-color: #fff;
+        color: #fff;
+        background-color: #1b1b1b;
+      }
+    }
+    .primary {
+      background: #1b1b1b;
+      border: 2px solid #1b1b1b;
+      color: #e5dfd9;
+      &:hover {
+        opacity: 0.8;
+      }
+    }
+  }
 .pay{
   .bg{
     background-image: url("../assets/bg06.png");
+    height: 352px;
+    line-height: 400px;
+    text-align: center;
+    h1{
+      font-size: 40px;
+    }
+  }
+  .jz{
+    .success{
+      width: 500px;
+      margin: 60px auto;
+      p{
+        text-align: center;
+      }
+      .f_24{
+        font-weight: 600;
+      }
+      .f_16{
+        span{
+          margin-right: 2px;
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          line-height: 22px;
+          background: #EDEDED;
+          font-weight: 400;
+        }
+      }
+
+    }
+    .orderNum{
+      color: #313131;
+      span{
+        font-weight: 600;
+      }
+    }
+    .date{
+      justify-content: space-between;
+      .f_16{
+        font-weight: 600;
+      }
+
+    }
   }
 }
 </style>