配置

src/main.js

@@ -2,15 +2,25 @@ import App from "./App";
 import Vue from "vue";
 import VHtmlPlugin from "@megalo/vhtml-plugin";
 import Vuex from "vuex";
+// import http from "./plugins/http";
+// import Dialog from "./vant/dialog/dialog";
+import common from "./mixins/common";
+import "./styles/font.less";
+import "./styles/vanIndex.less";
+
+Vue.prototype.$colors = {
+  prim: "#FF7F1F",
+  red: "#F42202"
+};
 
 Vue.use(VHtmlPlugin);
 Vue.use(Vuex);
 
 const store = require("./store").default;
 Vue.prototype.$store = store;
-
+// Vue.use(http);
 const app = new Vue(App);
-
+Vue.mixin(common);
 app.$mount();
 
 export default {

src/mixins/allPage.js

@@ -0,0 +1,59 @@
+export default {
+  data() {
+    return {
+      caseStatusList: [
+        {
+          value: "CREATED",
+          label: "待支付"
+        },
+        {
+          value: "CANCELED",
+          label: "已取消"
+        },
+        {
+          value: "PAYED",
+          label: "待发货"
+        },
+        {
+          value: "SEND",
+          label: "待收货"
+        },
+        {
+          value: "TAKEN",
+          label: "已收货"
+        },
+        {
+          value: "REFUND",
+          label: "申请退款"
+        },
+        {
+          value: "REFUNDED",
+          label: "已退款"
+        },
+        {
+          value: "COMPETED",
+          label: "已完成"
+        },
+        {
+          value: "ALL",
+          label: "全部"
+        }
+      ]
+    };
+  },
+  methods: {
+    allStatus(label) {
+      if (label) {
+        return (
+          [...this.caseStatusList].find(item => {
+            return item.label === label;
+          }) || {
+            value: ""
+          }
+        ).value;
+      } else {
+        return "";
+      }
+    }
+  }
+};

src/mixins/cardPage.js

@@ -0,0 +1,43 @@
+export default {
+  data() {
+    return {
+      caseStatusList: [
+        {
+          value: "UNDO",
+          label: "未审核"
+        },
+        {
+          value: "WAIT",
+          label: "待开始"
+        },
+        {
+          value: "PROGRESS",
+          label: "进行中"
+        },
+        {
+          value: "SOLDOUT",
+          label: "已完成"
+        },
+        {
+          value: "FINISH",
+          label: "已结束"
+        }
+      ]
+    };
+  },
+  methods: {
+    getStatus(label) {
+      if (label) {
+        return (
+          [...this.caseStatusList].find(item => {
+            return item.label === label;
+          }) || {
+            value: ""
+          }
+        ).value;
+      } else {
+        return "";
+      }
+    }
+  }
+};

src/mixins/common.js

@@ -0,0 +1,125 @@
+export default {
+  onLoad() {
+    const app = getApp();
+    if (this.loginMethods) {
+      if (app.globalData.initialize) {
+        this.loginMethods();
+      } else {
+        app.globalData.initializeCallback = () => {
+          this.loginMethods();
+        };
+      }
+    }
+  },
+  computed: {
+    isLogin() {
+      return !!this.$store.state.userInfo;
+    }
+  },
+  methods: {
+    navigateTo(url, checkLogin = true) {
+      if (checkLogin) {
+        this.checkLogin().then(() => {
+          if (url) {
+            wx.navigateTo({
+              url: url
+            });
+          }
+        });
+      } else {
+        if (url) {
+          wx.navigateTo({
+            url: url
+          });
+        }
+      }
+    },
+    checkLogin() {
+      if (!this.isLogin) {
+        wx.navigateTo({
+          url: "/pages/authorized"
+        });
+        return Promise.reject("未登录");
+      }
+      return Promise.resolve();
+    },
+    navigateBack(num = 1) {
+      wx.navigateBack({
+        delta: num
+      });
+    },
+    preview(img, urls = []) {
+      if (!img) {
+        return;
+      }
+      if (urls.length === 0) {
+        urls = [img];
+      }
+
+      let current = urls.findIndex(item => {
+        return item === img;
+      });
+
+      wx.previewImage({
+        current: current, // 当前显示图片的http链接
+        urls: urls // 需要预览的图片http链接列表
+      });
+    },
+    choosePhoto() {
+      return new Promise((resolve, reject) => {
+        wx.chooseImage({
+          count: 1, // 默认9
+          sizeType: ["original"], // 可以指定是原图还是压缩图，默认二者都有
+          sourceType: ["album", "camera"], // 可以指定来源是相册还是相机，默认二者都有
+          success: res => {
+            const src = res.tempFilePaths[0];
+            this.$http
+              .uploadFile(src)
+              .then(res => {
+                resolve(res);
+              })
+              .catch(e => {
+                reject(e);
+              });
+          }
+        });
+      });
+    },
+    phoneCall(phone = "18366668888") {
+      wx.makePhoneCall({
+        phoneNumber: phone
+      });
+    },
+    goHome() {
+      wx.switchTab({
+        url: "/pages/Home"
+      });
+    },
+    getNumStr(num) {
+      if (num < 10) {
+        return "0" + num;
+      } else {
+        return num;
+      }
+    },
+    toast(title, icon = "none", duration = 1500) {
+      wx.showToast({
+        icon: icon,
+        title: title,
+        mask: true,
+        duration: duration
+      });
+    },
+    showLoading() {
+      wx.showLoading({
+        title: "加载中..."
+      });
+    },
+    hideLoading() {
+      wx.hideLoading();
+    },
+    wait() {
+      this.toast("敬请期待");
+    }
+  }
+};

src/mixins/plugins/http.js

@@ -0,0 +1,165 @@
+const baseUrl = process.env.VUE_APP_BASE_URL;
+function parseUrl(url) {
+    let _baseUrl = baseUrl;
+    if (url.startsWith('http')) {
+        return url;
+    }
+    if (!_baseUrl.endsWith('/')) {
+        _baseUrl += '/';
+    }
+    if (url.startsWith('/')) {
+        url = url.slice(1);
+    }
+    return _baseUrl + url;
+}
+const http = {
+    parseUrl: parseUrl,
+    setToken(token) {
+        wx.setStorageSync('token', token);
+        this.token = token;
+    },
+    clearToken() {
+        this.token = '';
+        wx.removeStorageSync('token');
+        console.log('clear token');
+    },
+    getToken() {
+        if (!this.token) {
+            try {
+                this.token = wx.getStorageSync('token');
+            } catch (e) {}
+        }
+        return this.token;
+    },
+    get(url, params, options) {
+        options = options || {};
+        return new Promise((resolve, reject) => {
+            wx.request({
+                method: 'GET',
+                url: parseUrl(url),
+                data: params,
+                dataType: 'json',
+                header: {
+                    Accept: 'application/json',
+                    Authorization: this.getToken() ? 'Bearer ' + this.getToken() : 'Bearer ',
+                    ...(options.header || {})
+                },
+                success(res) {
+                    if (res && res.statusCode === 200) {
+                        resolve(res.data);
+                    } else {
+                        reject(res.data || res);
+                    }
+                },
+                fail(err) {
+                    reject(err.data || err);
+                }
+            });
+        });
+    },
+    post(url, data, options, backHeader = false) {
+        console.log('post');
+        options = options || {};
+        return new Promise((resolve, reject) => {
+            wx.request({
+                method: 'post',
+                url: parseUrl(url),
+                data: data,
+                dataType: 'json',
+                header: {
+                    Accept: 'application/json',
+                    'content-type': 'application/x-www-form-urlencoded',
+                    Authorization: this.getToken() ? 'Bearer ' + this.getToken() : '',
+                    ...(options.header || {})
+                },
+                success(res) {
+                    if (res && res.statusCode === 200) {
+                        resolve(backHeader ? res : res.data);
+                    } else {
+                        reject(res.data || res);
+                    }
+                },
+                fail(err) {
+                    reject(err.data || err);
+                }
+            });
+        });
+    },
+    postJson(url, data, options, backHeader = false) {
+        options = options || {};
+        return new Promise((resolve, reject) => {
+            wx.request({
+                method: 'post',
+                url: parseUrl(url),
+                data: data,
+                dataType: 'json',
+                header: {
+                    Accept: 'application/json',
+                    'Content-Type': 'application/json',
+                    Authorization: this.getToken() ? 'Bearer ' + this.getToken() : '',
+                    ...(options.header || {})
+                },
+                success(res) {
+                    if (res && res.statusCode === 200) {
+                        resolve(backHeader ? res : res.data);
+                    } else {
+                        reject(res.data || res);
+                    }
+                },
+                fail(err) {
+                    reject(err.data || err);
+                }
+            });
+        });
+    },
+    uploadFile(filePath, options) {
+        options = options || {};
+        return new Promise((resolve, reject) => {
+            wx.uploadFile({
+                url: baseUrl + '/upload/file',
+                filePath: filePath,
+                name: 'file',
+                header: {
+                    Accept: 'application/json',
+                    'content-type': 'application/x-www-form-urlencoded',
+                    Authorization: this.getToken() ? 'Bearer ' + this.getToken() : '',
+                    ...(options.header || {})
+                },
+                formData: options.formData || {},
+                success(res) {
+                    if (res && res.statusCode === 200) {
+                        try {
+                            resolve(res.data);
+                        } catch (e) {
+                            reject(e);
+                        }
+                    } else {
+                        reject(res);
+                    }
+                },
+                fail(err) {
+                    reject(err);
+                }
+            });
+        });
+    }
+};
+export default {
+    http: http,
+    install(_Vue) {
+        _Vue.prototype.$baseUrl = baseUrl;
+        _Vue.prototype.$http = http;
+        _Vue.prototype.$request = options => {
+            options = options || {};
+            options.url = parseUrl(options.url);
+            return new Promise((resolve, reject) => {
+                options.success = res => {
+                    resolve(res);
+                };
+                options.success = err => {
+                    reject(err);
+                };
+            });
+        };
+    }
+};

src/mixins/store.js

@@ -0,0 +1,26 @@
+export default {
+  data() {
+    return {
+      storeInfo: {}
+    };
+  },
+  computed: {
+    city() {
+      if (this.storeInfo) {
+        if (/[\u4e00-\u9fa5]/.test(this.storeInfo.city)) {
+          let province = this.storeInfo.province.replace(/省/, "");
+          province = province.replace(/自治区/, "");
+          let city = this.storeInfo.city.replace(/市/, "");
+          return province + " " + city;
+        }
+      }
+
+      return "";
+    },
+    storeLogo() {
+      return this.storeInfo.logo
+        ? this.storeInfo.logo + "?x-oss-process=image/circle,r_300/format,png"
+        : "/native/imgs/defaultLogo.png";
+    }
+  }
+};

src/plugins/http.js

@@ -0,0 +1,167 @@
+const baseUrl = process.env.VUE_APP_BASE_URL;
+function parseUrl(url) {
+  let _baseUrl = baseUrl;
+  if (url.startsWith("http")) {
+    return url;
+  }
+  if (!_baseUrl.endsWith("/")) {
+    _baseUrl += "/";
+  }
+  if (url.startsWith("/")) {
+    url = url.slice(1);
+  }
+  return _baseUrl + url;
+}
+const http = {
+  parseUrl: parseUrl,
+  setToken(token) {
+    wx.setStorageSync("token", token);
+    this.token = token;
+  },
+  clearToken() {
+    this.token = "";
+    wx.removeStorageSync("token");
+    console.log("clear token");
+  },
+  getToken() {
+    if (!this.token) {
+      try {
+        this.token = wx.getStorageSync("token");
+      } catch (e) {}
+    }
+    return this.token;
+  },
+  get(url, params, options) {
+    options = options || {};
+    return new Promise((resolve, reject) => {
+      wx.request({
+        method: "GET",
+        url: parseUrl(url),
+        data: params,
+        dataType: "json",
+        header: {
+          Accept: "application/json",
+          Authorization: this.getToken()
+            ? "Bearer " + this.getToken()
+            : "Bearer ",
+          ...(options.header || {})
+        },
+        success(res) {
+          if (res && res.statusCode === 200) {
+            resolve(res.data);
+          } else {
+            reject(res.data || res);
+          }
+        },
+        fail(err) {
+          reject(err.data || err);
+        }
+      });
+    });
+  },
+  post(url, data, options, backHeader = false) {
+    console.log("post");
+    options = options || {};
+    return new Promise((resolve, reject) => {
+      wx.request({
+        method: "post",
+        url: parseUrl(url),
+        data: data,
+        dataType: "json",
+        header: {
+          Accept: "application/json",
+          "content-type": "application/x-www-form-urlencoded",
+          Authorization: this.getToken() ? "Bearer " + this.getToken() : "",
+          ...(options.header || {})
+        },
+        success(res) {
+          if (res && res.statusCode === 200) {
+            resolve(backHeader ? res : res.data);
+          } else {
+            reject(res.data || res);
+          }
+        },
+        fail(err) {
+          reject(err.data || err);
+        }
+      });
+    });
+  },
+  postJson(url, data, options, backHeader = false) {
+    options = options || {};
+    return new Promise((resolve, reject) => {
+      wx.request({
+        method: "post",
+        url: parseUrl(url),
+        data: data,
+        dataType: "json",
+        header: {
+          Accept: "application/json",
+          "Content-Type": "application/json",
+          Authorization: this.getToken() ? "Bearer " + this.getToken() : "",
+          ...(options.header || {})
+        },
+        success(res) {
+          if (res && res.statusCode === 200) {
+            resolve(backHeader ? res : res.data);
+          } else {
+            reject(res.data || res);
+          }
+        },
+        fail(err) {
+          reject(err.data || err);
+        }
+      });
+    });
+  },
+  uploadFile(filePath, options) {
+    options = options || {};
+    return new Promise((resolve, reject) => {
+      wx.uploadFile({
+        url: baseUrl + "/upload/file",
+        filePath: filePath,
+        name: "file",
+        header: {
+          Accept: "application/json",
+          "content-type": "application/x-www-form-urlencoded",
+          Authorization: this.getToken() ? "Bearer " + this.getToken() : "",
+          ...(options.header || {})
+        },
+        formData: options.formData || {},
+        success(res) {
+          if (res && res.statusCode === 200) {
+            try {
+              resolve(res.data);
+            } catch (e) {
+              reject(e);
+            }
+          } else {
+            reject(res);
+          }
+        },
+        fail(err) {
+          reject(err);
+        }
+      });
+    });
+  }
+};
+export default {
+  http: http,
+  install(_Vue) {
+    _Vue.prototype.$baseUrl = baseUrl;
+    _Vue.prototype.$http = http;
+    _Vue.prototype.$request = options => {
+      options = options || {};
+      options.url = parseUrl(options.url);
+      return new Promise((resolve, reject) => {
+        options.success = res => {
+          resolve(res);
+        };
+        options.success = err => {
+          reject(err);
+        };
+      });
+    };
+  }
+};

src/store/vuex.js

@@ -0,0 +1,60 @@
+import Vuex from "vuex";
+import http from "../plugins/http";
+export default new Vuex.Store({
+  state: {
+    sessionKey: "",
+    safeArea: {
+      top: 0,
+      botton: 0
+    },
+    systemInfo: {
+      statusBarHeight: 44
+    },
+    userInfo: null,
+    userStoreInfo: null
+  },
+  mutations: {
+    setUserInfo(state, userInfo) {
+      state.userInfo = userInfo;
+    },
+    setSessionKey(state, sessionKey) {
+      state.sessionKey = sessionKey;
+    },
+    setSystemInfo(state, systemInfo) {
+      state.systemInfo = systemInfo;
+    },
+    setUserStoreInfo(state, userStoreInfo) {
+      state.userStoreInfo = userStoreInfo;
+    }
+  },
+  actions: {
+    getUserInfo(context) {
+      return http.http.get("/user/my").then(res => {
+        if (res.sex || res.nickname.indexOf("用户") === -1) {
+          context.commit("setUserInfo", res);
+        } else {
+          context.commit("setUserInfo", null);
+        }
+
+        return Promise.resolve(res);
+      });
+    },
+    getUserStore(context) {
+      return http.http
+        .postJson("/store/all", {
+          query: {
+            userId: context.state.userInfo.id
+          }
+        })
+        .then(res => {
+          if (res.empty) {
+            context.commit("setUserStoreInfo", null);
+            return Promise.reject();
+          } else {
+            context.commit("setUserStoreInfo", res.content[0]);
+            return Promise.resolve(res.content[0]);
+          }
+        });
+    }
+  }
+});

src/styles/common.less

@@ -0,0 +1,68 @@
+@prim: #ff6c00;
+@success: #07c160;
+@danger: #ff6c00;
+@warn: #ff976a;
+@text0: #181818;
+@text1: #323233;
+@text2: #606266;
+@text3: #939599;
+@text4: #c6c8cc;
+@border1: #f5f7fa;
+@border2: #f2f3f5;
+@border3: #dfe1e6;
+@border4: #f2f6fc;
+@bg: #f5f7fa;
+.flex1 {
+    flex-grow: 1;
+}
+.flex() {
+    display: flex;
+    align-items: center;
+}
+.flex-col() {
+    display: flex;
+    flex-direction: column;
+}
+
+.ellipsis() {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.ellipsis-line( @line:2 ) {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: @line;
+    overflow: hidden;
+}
+
+.bottom( @bottom:0.5px ) {
+    padding-bottom: @bottom;
+    padding-bottom: calc(@bottom + constant(safe-area-inset-bottom)); // 兼容 IOS<11.2
+    padding-bottom: calc(@bottom + env(safe-area-inset-bottom)); // 兼容 IOS>=11.2
+}
+
+@keyframes iconAnimate {
+    from {
+        -webkit-transform: scale(1);
+        transform: scale(1);
+    }
+
+    20% {
+        -webkit-transform: scale(0.8);
+        transform: scale(0.8);
+    }
+
+    80% {
+        -webkit-transform: scale(1.5);
+        transform: scale(1.5);
+    }
+    100% {
+        -webkit-transform: scale(1);
+        transform: scale(1);
+    }
+}
+.iconAnimate {
+    animation: iconAnimate ease-in-out 0.3s;
+}

src/styles/font.less

@@ -0,0 +1,32 @@
+@font-face {
+    font-family: 'OSP';
+    src: url(https://imttech.oss-cn-hangzhou.aliyuncs.com/micro/OSP-DIN.ttf);
+}
+@font-face {
+    font-family: 'iconfont'; /* Project id 2504712 */
+    src: url('//at.alicdn.com/t/font_2504712_37jeq6r3j0w.woff2?t=1620984863369') format('woff2'),
+        url('//at.alicdn.com/t/font_2504712_37jeq6r3j0w.woff?t=1620984863369') format('woff'),
+        url('//at.alicdn.com/t/font_2504712_37jeq6r3j0w.ttf?t=1620984863369') format('truetype');
+}
+
+.iconfont {
+    font-family: 'iconfont' !important;
+    font-size: 16px;
+    font-style: normal;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    line-height: 22px;
+}
+
+.iconfont-jiage:before {
+    content: '\e61c';
+}
+
+.iconfont-liebiao:before {
+    content: '\e61d';
+}
+
+
+.iconfont-button:before {
+    content: '\e61e';
+}

src/styles/vanIndex.less

@@ -0,0 +1,53 @@
+@prim: #ff6c00;
+
+.van-button {
+    --button-primary-background-color: @prim;
+    --button-primary-border-color: @prim;
+    --button-border-radius: 8px;
+    --button-default-color: @prim;
+    --button-small-height: 34px;
+    --button-small-min-width: 80px;
+    --button-default-border-color: #fff;
+    --button-info-background-color: #c8c9cc;
+    --button-info-border-color: #c8c9cc;
+    --button-mini-min-width: 60px;
+    --button-mini-height: 32px;
+}
+
+.van-grid {
+    --grid-item-text-color: #000;
+    --grid-item-text-font-size: 14px;
+}
+
+.van-empty {
+    .van-empty__image {
+        width: 260px;
+        height: 190px;
+    }
+    .van-empty__description {
+        font-size: 13px;
+        color: #939599;
+        line-height: 22px;
+        margin-top: 0;
+    }
+
+    .van-empty__bottom {
+        margin-top: 56px;
+    }
+
+    .van-button {
+        width: 290px;
+    }
+}
+
+.van-picker__confirm {
+    --picker-confirm-action-color: @prim;
+}
+
+.van-dropdown-menu {
+    --dropdown-menu-option-active-color: @prim;
+    --dropdown-menu-title-active-text-color: @prim;
+    --dropdown-menu-height: 32px;
+    --dropdown-menu-title-padding: 0 10px;
+    --dropdown-menu-title-font-size: 13px;
+}