update

src/api/mall.js

@@ -40,6 +40,14 @@ export function submitOrder(data) {
   return post(mallApi.orderApi, data)
 }
 
+export function getOrders(pageNumber) {
+  return get(mallApi.orderApi + '?pageNumber=' + pageNumber)
+}
+
+export function getOrder(orderId) {
+  return get(mallApi.orderApi + '/' + orderId)
+}
+
 export function payOrder(orderId) {
   return post(mallApi.payOrderApi + '/' + orderId)
 }

src/views/mall/ConfirmOrder.vue

@@ -130,20 +130,24 @@ export default {
           coverUrl: '//pic4.zhimg.com/v2-40c2552d5f3f63c181c19d66644de7e9_r.jpg',
         },
       ],
-      totalPrice: 22.22
+      totalPrice: 22.22,
+      productId: null
     }
   },
   created() {
+    this.productId = this.$route.query.productId
+
     document.title = '确认订单'
   },
   methods: {
     submitOrder() {
       const jsonData = {}
       jsonData.deliveryId = 110011
-      jsonData.itemId = 1
+      jsonData.itemId = this.productId
       jsonData.num = 1
       submitOrder(jsonData).then(resp => {
         if (resp.code === 0) {
+          const orderId = resp.data
           const loading = this.$loading({
             lock: true,
             text: '订单已提交, 跳转到支付页面',
@@ -155,10 +159,10 @@ export default {
             this.$router.push({
               path: '/mall/pay',
               query: {
-                orderId: 1
+                orderId: orderId
               }
             })
-          }, 5000);
+          }, 1000);
         }
       })
     }

src/views/mall/Order.vue

@@ -1,76 +1,35 @@
 <template>
   <el-row class="movie-list">
-    <el-col :md="20">
+    <el-col>
       <el-row>
-        <el-table
-          ref="multipleTable"
-          :data="dataList"
-          :show-header="true"
-          border
-          style="width: 100%"
-          @selection-change="handleSelectionChange"
-        >
-          <el-table-column
-            type="selection"
-          />
-          <el-table-column
-            fixed="left"
-            label="商品信息"
-          >
-            <template slot-scope="scope">
-              <el-row>
-                <el-col :md="4">
-                  <el-image :src="scope.row.coverUrl" min-width="30" height="20" />
-                </el-col>
-                <el-col :md="20">
-                  <router-link target="_blank" style="text-decoration-line: none" :to="`/mall/item?id=${scope.row.productId}`">
-                    <span>{{scope.row.title}}</span>
-                  </router-link>
-                </el-col>
-              </el-row>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="sku"
-            label="sku"
-          />
-          <el-table-column
-            label="单价"
-          >
-            <template slot-scope="scope">
-              <span style="color: red">￥{{scope.row.price}}</span>
-            </template>
-          </el-table-column>
-          <el-table-column
-            label="数量"
-          >
-            <template slot-scope="scope">
-              <el-input-number v-model="scope.row.num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="status"
-            label="状态"
-          />
-          <el-table-column
-            label="操作"
-          >
-            <template slot-scope="scope">
-              <el-button
-                size="mini"
-                @click="cache(scope.row)"
-              >移入关注</el-button>
-              <el-button
-                size="mini"
-                @click="cache(scope.row)"
-              >详情</el-button>
-              <el-button
-                size="mini"
-                @click="cache(scope.row)"
-              >删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
+        <el-col v-for="(item, index) in dataList" :key="item.orderId" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span>添加摄像头</span>
+            </div>
+            <div class="text item">
+              <el-col :md="18">
+                <el-form label-width="80px">
+                  <el-form-item label="设备 ID">
+                    <el-input v-model="item.orderId" />
+                  </el-form-item>
+                  <el-form-item label="设备名字">
+                    <el-input v-model="item.orderId" />
+                  </el-form-item>
+                </el-form>
+              </el-col>
+              <el-col :md="2">
+                <el-button size="mini" type="danger" @click="cache">立即添加</el-button>
+              </el-col>
+              <el-col :md="2">
+                <el-button size="mini" type="danger" @click="cache">立即添加</el-button>
+              </el-col>
+              <el-col :md="2">
+                <el-button size="mini" type="danger" @click="cache">立即添加</el-button>
+              </el-col>
+            </div>
+          </el-card>
+        </el-col>
       </el-row>
       <el-row>
         <el-pagination
@@ -90,10 +49,7 @@
 </template>
 
 <script>
-import {
-  getFileDetail,
-  getFileList,
-} from "@/api/disk";
+import {getOrders} from "@/api/mall";
 
 export default {
   name: 'Order',
@@ -104,36 +60,7 @@ export default {
       currentPage: 1,
       pageSize: 10,
       totalSize: 0,
-      dataList: [
-        {
-          productId: 1,
-          title: '莽牛MN78长续航电池7.4V2500毫安MN99S兰达科技P06大容量MN82锂电',
-          price: 1.11,
-          num: 1,
-          coverUrl: '//pic4.zhimg.com/v2-40c2552d5f3f63c181c19d66644de7e9_r.jpg',
-        },
-        {
-          productId: 2,
-          title: '莽牛MN78长续航电池7.4V2500毫安MN99S兰达科技P06大容量MN82锂电',
-          price: 2.32,
-          num: 1,
-          coverUrl: '//pic4.zhimg.com/v2-40c2552d5f3f63c181c19d66644de7e9_r.jpg',
-        },
-        {
-          productId: 3,
-          title: '莽牛MN78长续航电池7.4V2500毫安MN99S兰达科技P06大容量MN82锂电',
-          price: 11.12,
-          num: 3,
-          coverUrl: '//pic4.zhimg.com/v2-40c2552d5f3f63c181c19d66644de7e9_r.jpg',
-        },
-        {
-          productId: 4,
-          title: '莽牛MN78长续航电池7.4V2500毫安MN99S兰达科技P06大容量MN82锂电',
-          price: 12.22,
-          num: 4,
-          coverUrl: '//pic4.zhimg.com/v2-40c2552d5f3f63c181c19d66644de7e9_r.jpg',
-        },
-      ],
+      dataList: [],
       checked: false,
       searchForm: {
         page: 1,
@@ -143,17 +70,18 @@ export default {
       },
       multipleSelection: [],
       totalSelected: 0,
-      totalPrice: '0.00'
+      totalPrice: '0.00',
+      productId: null
     }
   },
   created() {
-    const path = this.$route.query.path
+    const path = this.$route.query.productId
     if (path !== undefined && path !== null) {
       this.searchForm.path = path
     }
 
     document.title = '我的订单'
-    // this.getData(this.searchForm)
+    this.getData(this.searchForm)
   },
   methods: {
     handleCurrentChange(pageNumber) {
@@ -162,11 +90,9 @@ export default {
       this.getData(this.searchForm)
     },
     getData() {
-      this.dataList = []
-      getFileList(this.searchForm).then(resp => {
+      getOrders(1).then(resp => {
         if (resp.code === 0) {
-          this.dataList = resp.data.fileList.list
-          this.totalSize = resp.data.fileList.totalSize
+          this.dataList = resp.data
         } else {
           this.$notify({
             title: '提示',
@@ -185,11 +111,6 @@ export default {
       })
     },
     getDetail(fileId) {
-      getFileDetail(fileId).then(resp => {
-        if (resp.code === 0) {
-          console.log(resp.data)
-        }
-      })
     },
     cache(row) {
     },
@@ -236,7 +157,7 @@ export default {
       this.$router.push({
         path: '/mall/order/confirm',
         query: {
-          pageNumber: 1
+          productId: 1
         }
       })
     }

src/views/mall/Pay.vue

@@ -68,7 +68,7 @@
             <el-button
               size="mini"
               type="danger"
-              @click="submitOrder">
+              @click="payOrder">
               支付订单
             </el-button>
           </el-form-item>
@@ -79,7 +79,7 @@
 </template>
 
 <script>
-import {payOrder} from "@/api/mall";
+import {getOrder, payOrder} from "@/api/mall";
 
 export default {
   name: 'Pay',
@@ -130,16 +130,23 @@ export default {
           coverUrl: '//pic4.zhimg.com/v2-40c2552d5f3f63c181c19d66644de7e9_r.jpg',
         },
       ],
-      totalPrice: 22.22
+      totalPrice: 22.22,
+      order: null
     }
   },
   created() {
+    const orderId = this.$route.query.orderId
+    getOrder(orderId).then(resp => {
+      if (resp.code === 0) {
+        this.order = resp.data
+      }
+    })
+
     document.title = '支付订单'
   },
   methods: {
-    submitOrder() {
-      const orderId = 110011
-      payOrder(orderId).then(resp => {
+    payOrder() {
+      payOrder(this.order.orderId).then(resp => {
         if (resp.code === 0) {
           const loading = this.$loading({
             lock: true,

src/views/mall/Product.vue

@@ -29,6 +29,7 @@
         <el-button round type="danger" @click="addCart">加入购物车</el-button>
       </el-form>
     </el-col>
+    <el-divider/>
   </el-row>
 </template>
 
@@ -39,14 +40,7 @@ export default {
   name: 'Product',
   data() {
     return {
-      product: {
-        productId: 1,
-        title: '莽牛MN78长续航电池7.4V2500毫安MN99S兰达科技P06大容量MN82锂电',
-        price: 1.11,
-        sellNum: 200,
-        coverUrl: '//pic4.zhimg.com/v2-40c2552d5f3f63c181c19d66644de7e9_r.jpg',
-        from: '广东深圳'
-      },
+      product: null,
       num: 1,
       radio1: '上海',
       radio2: '上海',
@@ -87,11 +81,12 @@ export default {
       this.$router.push({
         path: '/mall/order/confirm',
         query: {
-          pageNumber: 1
+          productId: this.product.itemId
         }
       })
     },
     addCart() {
+      console.log(this.product)
       const jsonData = {}
       jsonData.itemId = this.product.itemId
       jsonData.num = 1