我的预约列表接口对接

src/api/hospital.js

@@ -27,3 +27,26 @@ export const checkBacklist = (cupCardNo) => {
         }
     })
 };
+//我的预约列表
+export const myRecord = (createDept, cupCardNo, current,size) => {
+    return request({
+        url: '/api/blade-business/apm-record/page',
+        method: 'get',
+        params: {
+            createDept,
+            cupCardNo,
+            current,
+            size,
+        }
+    })
+};
+//取消预约
+export const recordCancel = (id) => {
+    return request({
+        url: '/api/blade-business/apm-record/cancel',
+        method: 'get',
+        params: {
+            id,
+        }
+    })
+};

src/views/myExam.vue

@@ -20,10 +20,15 @@
               <img v-else src="~@/assets/image/pro_gray.png" alt="" />
             </div>
             <div class="pro_name">{{ item1.name }}</div>
-            <div class="pro_pos" :class="item1.status == 1 ? 'tips' : item1.status == 3 ? 'cancel_tip' : ''">{{item1.tip}}</div>
+            <div class="pro_pos" :class="item1.status == 1 ? 'tips' : item1.status == 3 ? 'cancel_tip' : ''">
+              {{ item1.tip }}</div>
           </div>
           <div class="pro_right">
-            <div class="cancel" @click="cancelRegisiter" :class="item1.status == 2 ? 'finish' : item1.status == 3 ? 'cancel_item' : ''">{{item1.status == 1 ? '取消预约' : item1.status == 2 ? '已完成' : item1.status == 3 ? '已取消' : ''}}</div>
+            <div class="cancel" @click="cancelRegisiter(item1)"
+              :class="item1.status == 2 ? 'finish' : item1.status == 3 ? 'cancel_item' : ''">{{
+                item1.status == 1 ?
+                  '取消预约' : item1.status == 2 ? '已完成' : item1.status == 3 ? '已取消' : ''
+              }}</div>
           </div>
         </div>
       </div>
@@ -32,28 +37,50 @@
 </template>
 
 <script>
+import { myRecord,recordCancel } from "@/api/hospital";
 export default {
   data() {
     return {
+      current: 1,
+      size: 10,
       examArr: [
-                {time:'2023-02-08',examData:[
+        {
+          time: '2023-02-08', examData: [
             {
               name: '单眼视力', monment: '上午 9:00-9:30', time: '2023-01-08', tip: '门诊楼3楼眼科门诊', status: 1
             },
             {
               name: '听力', monment: '上午 9:00-9:30', time: '2023-01-08', tip: '门诊楼3楼耳科门诊', status: 2
             }
-                ]},
-                 {time:'2022-01-15',examData:[
+          ]
+        },
+        {
+          time: '2022-01-15', examData: [
             {
               name: '单眼视力', monment: '上午 9:00-9:30', time: '2022-01-15', tip: '门诊楼3楼眼科门诊', status: 3
             },
-                ]}
           ]
         }
+      ],
+      userInfo: null
+    }
+  },
+  mounted() {
+    let userInfo = sessionStorage.getItem('userInfo') ? JSON.parse(sessionStorage.getItem('userInfo')) : null;
+    if (userInfo) {
+      this.userInfo = userInfo;
+      this.queryMyRecord();
+    }
   },
   methods: {
-      cancelRegisiter(){
+    //我的预约列表
+    queryMyRecord() {
+      myRecord("",this.userInfo.papersnumber, this.current, this.size).then(res => {
+
+      })
+    },
+    //取消预约
+    cancelRegisiter(row) {
       lightAppJssdk.notification.alert({
         message: "是否取消该体检项目",
         title: "提示",//可传空
@@ -62,6 +89,13 @@ export default {
           //onSuccess将在点击button之后回调
           /*回调*/
           console.log('取消===>', data)
+          recordCancel(row.id).then(res => {
+            this.$message({
+              type: "success",
+              message: "操作成功!"
+            });
+            this.queryMyRecord();
+          })
         },
         fail: function (data) { //错误返回
         }
@@ -77,6 +111,7 @@ export default {
   height: 100%;
   background: #f9f9f9;
   position: absolute;
+
   .exam_box {
     background: #fff;
     padding: 0.5rem 0.24rem 0 0.24rem;
@@ -102,15 +137,18 @@ export default {
         display: flex;
         padding-bottom: 0.26rem;
         border-bottom: 1px solid #EEEEEE;
+
         .img_box {
           display: flex;
           align-items: center;
           margin-right: 0.24rem;
+
           img {
             width: 0.5rem;
             height: 0.5rem;
           }
         }
+
         .time_box {
           .time_text {
             width: 1.46rem;
@@ -122,6 +160,7 @@ export default {
             font-size: 0.24rem;
             color: #999999;
           }
+
           .date_txt {
             font-size: 0.3rem;
             font-weight: bold;
@@ -144,12 +183,14 @@ export default {
             height: 100%;
             display: flex;
             align-items: center;
+
             img {
               width: 0.5rem;
               height: 0.5rem;
 
             }
           }
+
           .pro_name {
             height: 100%;
             display: flex;
@@ -159,6 +200,7 @@ export default {
             font-weight: bold;
             margin-left: 0.24rem;
           }
+
           .pro_pos {
             height: 100%;
             display: flex;
@@ -171,10 +213,12 @@ export default {
           .tips {
             color: #00B578;
           }
+
           .cancel_tip {
             color: #F93A4A;
           }
         }
+
         .pro_right {
           height: 100%;
           display: flex;
@@ -191,6 +235,7 @@ export default {
             font-size: 0.24rem;
             color: #1677FF;
           }
+
           .finish {
             background: #E5E5E5;
             color: #999;