Browse Source

页面编写

zhangdan 4 năm trước cách đây
mục cha
commit
48cffeb3ca

+ 16 - 10
src/views/CouponStatistics/CouponStatistics.vue

@@ -63,63 +63,63 @@
           {
             title: '序号',
             dataIndex: 'no',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           
           {
             title: '发券网点',
             dataIndex: 'no',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           {
             title: '优惠券名称',
             dataIndex: 'no',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           {
             title: '优惠券类型',
             dataIndex: 'no',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           {
             title: '已发数量',
             dataIndex: 'no',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           {
             title: '使用数量',
             dataIndex: 'no',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           {
             title: '关联消费金额',
             dataIndex: 'no',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           {
             title: '转化率',
             dataIndex: 'no',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           {
             title: '状态',
             dataIndex: 'status',
-            width: '40',
+            minWidth: '40',
             align: 'center',
             scopedSlots: { customRender: 'status' }
           },
           {
             title: '操作',
             dataIndex: 'action',
-            width: '40',
+            minWidth: '40',
             align: 'center',
             scopedSlots: { customRender: 'action' }
           }
@@ -139,6 +139,12 @@
           // })
         }
       }
+    },
+    methods:{
+      // 重置
+      resetForm(){
+        
+      }
     }
   }
 </script>

+ 61 - 22
src/views/Order/OrderCenter.vue

@@ -2,7 +2,7 @@
   <a-card :bordered="false">
     <!-- 搜索条件 -->
     <div class="orderCenter-searchForm">
-      <a-form layout="inline">
+      <a-form layout="inline" ref="searchForm">
         <a-row :gutter="48">
           <a-col :span="8">
             <a-form-item label="创建时间">
@@ -18,16 +18,12 @@
             <a-form-item label="单号">
               <a-input v-model.trim="searchForm.num" placeholder="请输入" allowClear style="width: 200px;"/>
             </a-form-item>
-          </a-col>
-          <a-col :span="4">
-            <a-button style="margin-right: 10px;" type="primary" @click="$refs.table.refresh(true)">查询</a-button>
-            <a-button type="" @click="resetForm">重置</a-button>
-          </a-col>  
+          </a-col> 
         </a-row>
         <a-row :gutter="48">
           <a-col :span="8">
             <a-form-item label="服务项目">
-              <v-select v-model="searchForm.name" placeholder="请选择" allowClear style="width: 200px;"></v-select>
+              <v-select v-model="searchForm.name" placeholder="请选择" allowClear style="width: 200px;" @change="onChange"></v-select>
             </a-form-item>
           </a-col>
           <a-col :span="6">
@@ -40,6 +36,10 @@
               <v-select v-model="searchForm.name" placeholder="请选择" allowClear style="width: 200px;"></v-select>
             </a-form-item>
           </a-col>
+          <a-col :span="4">
+            <a-button style="margin-right: 10px;" type="primary" @click="$refs.table.refresh(true)">查询</a-button>
+            <a-button type="" @click="resetForm">重置</a-button>
+          </a-col> 
         </a-row>  
       </a-form>
     </div>
@@ -49,7 +49,7 @@
     </div>
     <!-- 列表 -->
     <s-table 
-      ref="tableData"
+      ref="table"
       size="default"
       :rowKey="(record) => record.id"
       :columns="columns"
@@ -61,8 +61,8 @@
       </span>
       <!-- 操作 -->
       <span slot="action" slot-scope="text, record">
-        <a-button type="primary">查看</a-button>
-        <a-button type="danger">退款</a-button>
+        <a-button type="primary" @click="seeDetail(record)">查看</a-button>
+        <a-button type="danger" @click="refund(record)">退款</a-button>
       </span>
     </s-table>
   </a-card>
@@ -76,6 +76,8 @@
       return{
         // 查询参数
         searchForm: {
+          beginDate:null,
+          endDate:null,
           name: '',
           num: ''
         },
@@ -84,70 +86,68 @@
           {
             title: '创建时间',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
-            
           },
           {
             title: '单号',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
             
           },
           {
             title: '网点名称',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
             
           },
           {
             title: '服务项目',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
             
           },
           {
             title: '手机号码',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
             
           },
           {
             title: '应收(¥)',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
             
           },
           {
             title: '实收(¥)',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
             
           },
           {
             title: '优惠(¥)',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
           },
           {
             title: '状态',
             dataIndex: 'status',
-            width: '40',
+            minWidth: '40',
             align: 'center',
             scopedSlots: { customRender: 'status' }
-            
           },
           {
             title: '操作',
             dataIndex: 'action',
-            width: '40',
+            minWidth: '40',
             align: 'center',
             scopedSlots: { customRender: 'action' }
             
@@ -168,7 +168,46 @@
           // })
         }
       }
+    },
+    methods:{
+      // 创建时间change
+      onChange (dates, dateStrings) {
+        if ((dates, dateStrings)) {
+          this.searchForm.beginDate = dateStrings[0]
+          this.searchForm.endDate = dateStrings[1] 
+      }
+        console.log(this.searchForm.beginDate, this.searchForm.endDate)
+      },
+      // 查看详情--跳转到对应的详情页
+      seeDetail(row){
+        this.$router.push({ name: 'OrderDetail', query: { id: row.id } })
+      },
+      // 退款
+      refund(row) {
+      	const _this = this
+      	this.$confirm({
+      		title: '警告',
+      		content: '确认退款后 款项将通过原渠道退回 且不可撤回,确认退款?',
+      		okText: '确定',
+      		cancelText: '取消',
+      		// onOk() {
+      		// 	deleteItem({
+      		// 		id: row.id
+      		// 	}).then(res => {
+      		// 		if (res.status == 200) {
+      		// 			_this.$message.success('退款成功')
+      		// 			_this.$refs.table.refresh()
+      		// 		}
+      		// 	})
+      		// }
+      	})
+      },
+      // 重置
+      resetForm(){
+        this.$refs.searchForm.resetFields()
+      }
     }
+    
   }
 </script>
 

+ 20 - 5
src/views/Order/OrderDetail.vue

@@ -66,13 +66,13 @@
                   <div style="border: 1px solid #eee;overflow: hidden;padding: 8px">
                     <img :src="advertisementImg" style="width: 100px; height: 100px;" alt=""/>
                   </div>
-                  <div>洗车前</div> 
+                  <div style="text-align: center;">洗车前</div> 
                 </div>
                 <div>
-                  <div style="border: 1px solid #eee;overflow: hidden;padding: 8px">
-                    <img :src="advertisementImg" style="width: 100px; height: 100px;" alt=""/>
+                  <div id="img" style="border: 1px solid #eee;overflow: hidden;padding: 8px">
+                    <img class="img1" src="../../assets/avatar2.jpg" alt=""/>
                   </div>
-                  <div>洗车后</div> 
+                  <div style="text-align: center;">洗车后</div> 
                 </div>
              </div>
               
@@ -82,7 +82,7 @@
          <a-row style="text-align: center;margin-top: 100px;">
            <a-col>
              <a-form-item>
-               <a-button type="default">返回列表</a-button>
+               <a-button type="default" @click="goBack()">返回列表</a-button>
              </a-form-item>
            </a-col>
          </a-row>
@@ -97,6 +97,11 @@
       return{
        
       }
+    },
+    methods:{
+      goBack(){
+        this.$router.push({ name: 'OrderCenter' })
+      },
     }
   }
 </script>
@@ -104,4 +109,14 @@
   .orderDetail-content .ant-form-inline .ant-form-item{
     margin-bottom: 20px;
   }
+  #img .img1{
+    width: 150px;
+    height: auto;
+    transition:all 2s;/*图片放大过程的时间*/
+    position: relative;
+  }
+  .img1:hover{
+    cursor: crosshair;
+    transform: scale(1.9);  /*以y轴为中心旋转*/
+  }
 </style>

+ 27 - 10
src/views/RefundRecord/RefundRecord.vue

@@ -66,6 +66,8 @@
       return{
         // 查询参数
         searchForm: {
+          beginDate:null,
+          endDate:null,
           name: '',
           num: ''
         },
@@ -74,63 +76,63 @@
           {
             title: '创建时间',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '100',
             align: 'center'
             
           },
           {
             title: '交易流水号',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '100',
             align: 'center'
             
           },
           {
             title: '关联订单号',
             dataIndex: 'createTime',
-            width: '40',
+            width: '100',
             align: 'center'
             
           },
           {
             title: '网点名称',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '100',
             align: 'center'
             
           },
           {
             title: '退款项目',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '100',
             align: 'center'
             
           },
           {
             title: '退款金额(¥)',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '40',
             align: 'center'
             
           },
           {
             title: '退款人',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '100',
             align: 'center'
             
           },
           {
             title: '退款状态',
             dataIndex: 'createTime',
-            width: '40',
+            minWidth: '100',
             align: 'center',
             scopedSlots: { customRender: 'status' }
           },
           {
             title: '备注',
             dataIndex: 'status',
-            width: '40',
+            minWidth: '100',
             align: 'center', 
           },
         ],
@@ -149,7 +151,22 @@
           // })
         }
       }
-    }
+    },
+    methods:{
+      // 创建时间change
+      onChange (dates, dateStrings) {
+        if ((dates, dateStrings)) {
+      				this.searchForm.beginDate = dateStrings[0]
+      				this.searchForm.endDate = dateStrings[1]
+        }
+        console.log(this.searchForm.beginDate, this.searchForm.endDate)
+      },
+      // 重置
+      resetForm(){
+        this.$refs.searchForm.resetFields()
+        this.$refs.table.refresh(true)
+      },
+    },
   }
 </script>