优惠券查询

vue-admin-template-master/src/api/order.js

@@ -67,3 +67,12 @@ export function statistics_shopday(data) {
     data
   });
 }
+
+//查询优惠券
+export function query_by_phone(data) {
+  return request({
+    url: "dashboard/ticket/query_by_phone",
+    method: "post",
+    data
+  });
+}

vue-admin-template-master/src/router/index.js

@@ -132,7 +132,7 @@ export const constantRoutes = [
         path: "query",
         name: "Query",
         component: () => import("@/views/orders/query"),
-        meta: { title: "查询" }
+        meta: { title: "查询", noCache: false }
       }
     ]
   },

vue-admin-template-master/src/views/coupon/index copy.vue

@@ -0,0 +1,401 @@
+<template>
+  <div class="container">
+    <el-card class="box-card" style="height: 90vh;">
+      <div class="filter-container">
+        <el-input
+          prefix-icon="el-icon-search"
+          v-model="listQuery.phone"
+          style="width: 300px;"
+          placeholder="请输入手机号"
+          clearable
+          @keyup.enter.native="getDetail"
+        />
+        <el-button
+          style="margin-left: 10px;"
+          :loading="searchLoading"
+          type="primary"
+          icon="el-icon-search"
+          @click="getDetail"
+        >搜索</el-button>
+        <el-button type="primary" plain style="float:right;" @click="handleUpdate">发放优惠券</el-button>
+      </div>
+      <!-- show-overflow-tooltip -->
+      <el-table
+        :data="tableData"
+        v-loading="listLoading"
+        height="73vh"
+        highlight-current-row
+        style="width: 100%"
+        fit
+        class="table-list"
+        :cell-style="{padding:'6px 0'}"
+      >
+        <el-table-column prop="id" label="ID" width="100"></el-table-column>
+        <el-table-column prop="amount" label="amount" width="100"></el-table-column>
+        <el-table-column prop="coffee" label="coffee" width="100" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="description" label="description" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="discount" label="discount" width="100"></el-table-column>
+        <el-table-column prop="duedate" label="duedate" width="120"></el-table-column>
+        <el-table-column prop="phone" label="phone" width="120" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="title" label="title" width="120" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="used" label="used" width="100"></el-table-column>
+        <el-table-column prop="useropenid" label="useropenid" show-overflow-tooltip></el-table-column>
+      </el-table>
+      <div class="pd-30">
+        <el-pagination
+          v-show="total>0"
+          background
+          layout="prev, pager, next"
+          :total="total"
+          @current-change="handleCurrentChange"
+          :current-page.sync="listQuery.page"
+          :page-size="listQuery.limit"
+        ></el-pagination>
+      </div>
+    </el-card>
+
+    <el-dialog title="发放优惠券" :visible.sync="dialogFormVisible">
+      <el-form
+        :model="ruleForm"
+        :rules="rules"
+        ref="ruleForm"
+        label-width="100px"
+        style="width: 400px; margin-left:50px;"
+      >
+        <el-form-item label="券类型" prop="title">
+          <el-select v-model="ruleForm.title" placeholder="请选择券类型" @change="titleChange">
+            <el-option
+              v-for="(item,index) in couponType"
+              :key="index"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="金额" prop="amount">
+          <el-select v-model="ruleForm.amount" placeholder="请选择金额" @change="amountChange">
+            <el-option
+              v-for="(item,index) in couponAmount"
+              :key="index"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="描述">
+          <!-- <el-select v-model="ruleForm.description" disabled>
+            <el-option
+              v-for="(item,index) in couponDescription"
+              :key="index"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>-->
+          <el-input v-model="ruleForm.description" disabled style="width: 300px;"></el-input>
+        </el-form-item>
+        <el-form-item
+          label="过期时间"
+          prop="duedate"
+          v-if="ruleForm.title == '立减券' || ruleForm.title == 'VIP免单券'"
+        >
+          <el-date-picker
+            value-format="yyyy-MM-dd"
+            v-model="ruleForm.duedate"
+            type="date"
+            placeholder="选择日期"
+            :picker-options="pickerBeginDateBefore"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="电话号" prop="phone">
+          <el-input v-model="ruleForm.phone" style="width: 300px;"></el-input>
+        </el-form-item>
+
+        <!-- <el-form-item>
+          <el-button type="primary" @click="submitForm('ruleForm')">立即发放</el-button>
+          <el-button @click="resetForm('ruleForm')">重置</el-button>
+        </el-form-item>-->
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false">取消</el-button>
+        <el-button type="primary" @click="submitForm" :loading="submitLoading">确定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getTicketList, generate_ticket, query_by_phone } from "@/api/order";
+// 手机号验证
+const validatePhone = (rule, value, callback) => {
+  if (value === "") {
+    callback(new Error("请输入手机号"));
+  } else {
+    if (!/^1[123456789]\d{9}$/.test(value)) {
+      callback(new Error("请输入正确的手机号"));
+    } else {
+      callback();
+    }
+  }
+};
+const couponType = [
+  {
+    label: "立减券",
+    value: "立减券",
+  },
+  {
+    label: "月卡券",
+    value: "月卡券",
+  },
+  {
+    label: "VIP免单券",
+    value: "VIP免单券",
+  },
+];
+const couponAmount = [
+  {
+    label: 15,
+    value: 15,
+  },
+  {
+    label: 12,
+    value: 12,
+  },
+  {
+    label: 30,
+    value: 30,
+  },
+];
+const couponDescription = [
+  {
+    label: "立减15元，回馈老用户",
+    value: "立减15元，回馈老用户",
+  },
+  {
+    label: "立减12元，回馈老用户",
+    value: "立减12元，回馈老用户",
+  },
+  {
+    label: "立减15元，每天限用1次",
+    value: "立减15元，每天限用1次",
+  },
+  {
+    label: "任意咖啡(一杯)免单,VIP用户专享",
+    value: "任意咖啡(一杯)免单,VIP用户专享",
+  },
+];
+export default {
+  name: "ticket",
+  data() {
+    return {
+      total: 0,
+      listLoading: true,
+      searchLoading: false,
+      listQuery: {
+        page: 1,
+        limit: 100,
+      },
+      tableData: [],
+
+      //发放优惠券
+      submitLoading: false,
+      pickerBeginDateBefore: {
+        disabledDate: (time) => {
+          return time.getTime() < Date.now() - 8.64e7;
+        },
+      },
+      selectDisabled: false,
+      dialogFormVisible: false,
+      couponType,
+      couponAmount: [],
+      couponDescription: [],
+      ruleForm: {
+        title: "",
+        amount: "",
+        description: "",
+        duedate: "",
+        phone: "",
+      },
+      rules: {
+        title: [{ required: true, message: "请选择券类型", trigger: "change" }],
+        amount: [{ required: true, message: "请选择金额", trigger: "change" }],
+        duedate: [
+          {
+            required: true,
+            message: "请选择过期时间",
+            trigger: "change",
+          },
+        ],
+        phone: [
+          {
+            validator: validatePhone,
+            required: true,
+            trigger: "blur",
+          },
+        ],
+      },
+    };
+  },
+  watch: {
+    // ruleForm: {
+    //   handler: function (val, oldval) {
+    //     console.log(val);
+    //     if (val.title == "月卡券") {
+    //       this.ruleForm.amount = 15;
+    //       this.selectDisabled = true;
+    //       this.ruleForm.description = "立减15元，每天限用1次";
+    //     } else if (val.title == "立减券") {
+    //       this.selectDisabled = false;
+    //       this.couponAmount = couponAmount;
+    //       this.ruleForm.description = "";
+    //     } else if (val.title == "立减券" && val.amount == 15) {
+    //       this.ruleForm.description = "立减15元，回馈老用户";
+    //     } else if (val.title == "立减券" && val.amount == 12) {
+    //       this.ruleForm.description = "立减12元，回馈老用户";
+    //     }
+    //   },
+    //   deep: true, //对象内部的属性监听，也叫深度监听
+    // },
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    getList() {
+      this.listLoading = true;
+      getTicketList({
+        page: this.listQuery.page,
+      }).then((res) => {
+        this.tableData = res.tickets;
+        this.total = res.total;
+        this.listLoading = false;
+      });
+    },
+    handleCurrentChange(val) {
+      this.listQuery.page = val;
+      //刷新页面
+      console.log(`当前页: ${val}`);
+      this.getList();
+    },
+    //发放优惠券
+    titleChange(title) {
+      this.ruleForm.amount = "";
+      this.ruleForm.description = "";
+      if (title == "立减券") {
+        this.ruleForm.description = "";
+        this.couponAmount = [
+          {
+            label: 15,
+            value: 15,
+          },
+          {
+            label: 12,
+            value: 12,
+          },
+        ];
+      }
+      if (title == "月卡券") {
+        this.couponAmount = [
+          {
+            label: 15,
+            value: 15,
+          },
+        ];
+        this.ruleForm.amount = 15;
+        this.ruleForm.description = "立减15元，每天限用1次";
+      }
+      if (title == "VIP免单券") {
+        this.couponAmount = [
+          {
+            label: 30,
+            value: 30,
+          },
+        ];
+        this.ruleForm.amount = 30;
+        this.ruleForm.description = "任意咖啡(一杯)免单,VIP用户专享";
+      }
+    },
+    amountChange(amount) {
+      if (amount == 15 && this.ruleForm.title == "立减券") {
+        this.ruleForm.description = "立减15元，回馈老用户";
+      }
+      if (amount == 12 && this.ruleForm.title == "立减券") {
+        this.ruleForm.description = "立减12元，回馈老用户";
+      }
+    },
+    submitForm() {
+      this.$refs["ruleForm"].validate((valid) => {
+        if (valid) {
+          this.submitLoading = true;
+
+          let params = {};
+          if (this.ruleForm.title == "月卡券") {
+            params = {
+              title: "月卡券",
+              phone: this.ruleForm.phone,
+            };
+          } else if (this.ruleForm.title == "立减券") {
+            params = {
+              title: "立减券",
+              amount: this.ruleForm.amount,
+              description: this.ruleForm.description,
+              duedate: this.ruleForm.duedate,
+              phone: this.ruleForm.phone,
+            };
+          } else if (this.ruleForm.title == "VIP免单券") {
+            params = {
+              title: "VIP免单券",
+              amount: this.ruleForm.amount,
+              description: this.ruleForm.description,
+              duedate: this.ruleForm.duedate,
+              phone: this.ruleForm.phone,
+            };
+          }
+          generate_ticket(params).then(() => {
+            this.$message({
+              message: "发放成功！",
+              type: "success",
+            });
+            this.dialogFormVisible = false;
+            this.submitLoading = false;
+          });
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    resetTemp() {
+      this.ruleForm = {
+        title: "",
+        amount: "",
+        description: "",
+        duedate: "",
+        phone: "",
+      };
+    },
+    handleUpdate() {
+      this.resetTemp();
+      this.dialogFormVisible = true;
+      this.$nextTick(() => {
+        this.$refs["ruleForm"].clearValidate();
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  padding: 20px;
+}
+.pd-30 {
+  padding: 30px 0;
+}
+.filter-container {
+  overflow: hidden;
+  padding: 10px 0;
+}
+.table-list {
+  font-size: 12px;
+}
+</style>

vue-admin-template-master/src/views/coupon/index.vue

@@ -2,13 +2,28 @@
   <div class="container">
     <el-card class="box-card" style="height: 90vh;">
       <div class="filter-container">
-        <el-button type="primary" style="float:right;" @click="handleUpdate">发放优惠券</el-button>
+        <el-input
+          prefix-icon="el-icon-search"
+          v-model="listQuery.phone"
+          style="width: 300px;"
+          placeholder="请输入手机号"
+          clearable
+          @keyup.enter.native="getList"
+        />
+        <el-button
+          style="margin-left: 10px;"
+          :loading="searchLoading"
+          type="primary"
+          icon="el-icon-search"
+          @click="getList"
+        >搜索</el-button>
+        <el-button type="primary" plain style="float:right;" @click="handleUpdate">发放优惠券</el-button>
       </div>
       <!-- show-overflow-tooltip -->
       <el-table
         :data="tableData"
         v-loading="listLoading"
-        height="73vh"
+        height="79vh"
         highlight-current-row
         style="width: 100%"
         fit
@@ -26,7 +41,7 @@
         <el-table-column prop="used" label="used" width="100"></el-table-column>
         <el-table-column prop="useropenid" label="useropenid" show-overflow-tooltip></el-table-column>
       </el-table>
-      <div class="pd-30">
+      <!-- <div class="pd-30">
         <el-pagination
           v-show="total>0"
           background
@@ -36,7 +51,7 @@
           :current-page.sync="listQuery.page"
           :page-size="listQuery.limit"
         ></el-pagination>
-      </div>
+      </div>-->
     </el-card>
 
     <el-dialog title="发放优惠券" :visible.sync="dialogFormVisible">
@@ -109,7 +124,7 @@
 </template>
 
 <script>
-import { getTicketList, generate_ticket } from "@/api/order";
+import { getTicketList, generate_ticket, query_by_phone } from "@/api/order";
 // 手机号验证
 const validatePhone = (rule, value, callback) => {
   if (value === "") {
@@ -173,11 +188,10 @@ export default {
   data() {
     return {
       total: 0,
-      listLoading: true,
+      listLoading: false,
       searchLoading: false,
       listQuery: {
-        page: 1,
-        limit: 100,
+        phone: "",
       },
       tableData: [],
 
@@ -242,25 +256,31 @@ export default {
     // },
   },
   created() {
-    this.getList();
+    // this.getList();
   },
   methods: {
     getList() {
+      if (!this.listQuery.phone) {
+        return this.$message.error("请输入正确手机号！");
+      }
+      if (!/^1[123456789]\d{9}$/.test(this.listQuery.phone.trim())) {
+        return this.$message.error("请输入正确手机号！");
+      }
       this.listLoading = true;
-      getTicketList({
-        page: this.listQuery.page,
+      query_by_phone({
+        phone: this.listQuery.phone.trim(),
       }).then((res) => {
         this.tableData = res.tickets;
-        this.total = res.total;
+        // this.total = res.total;
         this.listLoading = false;
       });
     },
-    handleCurrentChange(val) {
-      this.listQuery.page = val;
-      //刷新页面
-      console.log(`当前页: ${val}`);
-      this.getList();
-    },
+    // handleCurrentChange(val) {
+    //   this.listQuery.page = val;
+    //   //刷新页面
+    //   console.log(`当前页: ${val}`);
+    //   this.getList();
+    // },
     //发放优惠券
     titleChange(title) {
       this.ruleForm.amount = "";

vue-admin-template-master/src/views/orders/list/index.vue

@@ -80,7 +80,7 @@
 <script>
 import { getOrderList, export_order } from "@/api/order";
 export default {
-  name: "orders",
+  name: "List",
   filters: {
     setType(type) {
       if (type == "takeaway") {

vue-admin-template-master/src/views/orders/query/index.vue

@@ -69,7 +69,7 @@
 import { order_query } from "@/api/order";
 
 export default {
-  name: "query",
+  name: "Query",
   filters: {
     setType(type) {
       if (type == "takeaway") {