登录调试

.env.development

@@ -2,7 +2,8 @@
 ENV = 'development'
 
 # base api
-VUE_APP_BASE_API = '/dev-api'
+# VUE_APP_BASE_API = '/dev-api'
+VUE_APP_BASE_API = 'http://192.168.1.22:8108'
 
 # vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
 # to control whether the babel-plugin-dynamic-import-node plugin is enabled.

mock/user.js

@@ -52,7 +52,7 @@ export default [
     url: '/user/info\.*',
     type: 'get',
     response: config => {
-      //const { token } = config.query
+      // const { token } = config.query
       const info = users['admin-token']
 
       // mock error

src/router/index.js

@@ -77,7 +77,7 @@ export const constantRoutes = [
         path: 'operateList',
         component: () => import('@/views/club/operateList'),
         name: 'OperateList',
-        meta: { title: '查看运营人员', icon: 'list' },
+        meta: { title: '查看运营人员', noCache: true, activeMenu: '/club/list' },
         hidden: true
       }
     ]
@@ -165,6 +165,13 @@ export const constantRoutes = [
         name: 'Refund',
         component: () => import('@/views/order/refund'),
         meta: { title: '用户退款列表', icon: 'skill' }
+      },
+      {
+        path: 'detail/:id(\\d+)',
+        name: 'Detail',
+        component: () => import('@/views/order/detail'),
+        meta: { title: '订单详情', noCache: true, activeMenu: '/order/list' },
+        hidden: true
       }
     ]
   },

src/store/modules/user.js

@@ -30,13 +30,13 @@ const mutations = {
 
 const actions = {
   // user login
-  login({ commit }, userInfo) {
-    const { username, password } = userInfo
+  login: function({ commit }, userInfo) {
+    const { account, password, organizeID } = userInfo
     return new Promise((resolve, reject) => {
-      login({ username: username.trim(), password: password }).then(response => {
+      login({ account: account.trim(), password: password, organizeID: organizeID }).then(response => {
         const { data } = response
-        commit('SET_TOKEN', data.token)
-        setToken(data.token)
+        commit('SET_TOKEN', data)
+        setToken(data)
         resolve()
       }).catch(error => {
         reject(error)
@@ -49,23 +49,24 @@ const actions = {
     return new Promise((resolve, reject) => {
       getInfo(state.token).then(response => {
         const { data } = response
-
         if (!data) {
           reject('Verification failed, please Login again.')
         }
-
-        const { roles, name, avatar, introduction } = data
-
-        // roles must be a non-empty array
+        /* const { roles, account, avatar, introduction } = data
         if (!roles || roles.length <= 0) {
           reject('getInfo: roles must be a non-null array!')
-        }
+        } */
+        const account = data.account
+        const roles = ['admin']
+        const introduction = 'I am a super administrator'
+        const avatar = 'avatar'
 
         commit('SET_ROLES', roles)
-        commit('SET_NAME', name)
+        commit('SET_NAME', account)
         commit('SET_AVATAR', avatar)
         commit('SET_INTRODUCTION', introduction)
         resolve(data)
+        debugger
       }).catch(error => {
         reject(error)
       })
@@ -87,7 +88,7 @@ const actions = {
 
         resolve()
       }).catch(error => {
-        reject(error)
+        alert(error)
       })
     })
   },
@@ -126,6 +127,7 @@ const actions = {
       resolve()
     })
   }
+
 }
 
 export default {

src/utils/request.js

@@ -19,7 +19,7 @@ service.interceptors.request.use(
       // let each request carry token
       // ['X-Token'] is a custom headers key
       // please modify it according to the actual situation
-      config.headers['X-Token'] = getToken()
+      config.headers['token'] = getToken()
     }
     return config
   },
@@ -46,7 +46,7 @@ service.interceptors.response.use(
     const res = response.data
 
     // if the custom code is not 20000, it is judged as an error.
-    if (res.code !== 20000) {
+    if (res.code * 1 !== 1) {
       Message({
         message: res.message || 'Error',
         type: 'error',

src/views/login/index.vue

@@ -7,15 +7,15 @@
         <h3 class="title">星范商城后台管理系统</h3>
       </div>
 
-      <el-form-item prop="username">
+      <el-form-item prop="account">
         <span class="svg-container">
           <svg-icon icon-class="user" />
         </span>
         <el-input
-          ref="username"
-          v-model="loginForm.username"
-          placeholder="Username"
-          name="username"
+          ref="account"
+          v-model="loginForm.account"
+          placeholder="account"
+          name="account"
           type="text"
           tabindex="1"
           auto-complete="on"
@@ -45,7 +45,7 @@
       <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">登录</el-button>
 
       <!-- <div class="tips">
-        <span style="margin-right:20px;">username: admin</span>
+        <span style="margin-right:20px;">account: admin</span>
         <span> password: any</span>
       </div> -->
       <div class="footer"><p>copyrigh © 2019星范商城后台V1.0.0</p></div>
@@ -75,11 +75,12 @@ export default {
     }
     return {
       loginForm: {
-        username: 'admin',
-        password: '111111'
+        account: 'admin',
+        password: '123456',
+        organizeID: 1
       },
       loginRules: {
-        username: [{ required: true, trigger: 'blur', validator: validateUsername }],
+        account: [{ required: true, trigger: 'blur', validator: validateUsername }],
         password: [{ required: true, trigger: 'blur', validator: validatePassword }]
       },
       loading: false,
@@ -87,6 +88,11 @@ export default {
       redirect: undefined
     }
   },
+  computed: {
+    organizeID() {
+      return this.$store.state.settings.organizeID
+    }
+  },
   watch: {
     $route: {
       handler: function(route) {

src/views/order/detail.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="app-container">
+
+    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
+      <el-menu-item index="1"><router-link to="/order/list">订单列表</router-link></el-menu-item>
+      <el-menu-item index="2">订单详情</el-menu-item>
+    </el-menu>
+
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      activeIndex: '2'
+    }
+  },
+  computed: {
+    organizeID() {
+      return this.$store.state.settings.organizeID
+    }
+  },
+  created() {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
+

src/views/order/list.vue

@@ -1,14 +1,191 @@
 <template>
   <div class="app-container">
-    {{ msg }}
+    <div class="filter-container">
+      <el-input v-model="listQuery.form.orderID" placeholder="订单ID" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
+      <el-input v-model="listQuery.form.orderNo" placeholder="订单号" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
+      <el-form-item label="创建时间:">
+        <el-date-picker
+          v-model="searchTimeVal"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        />
+      </el-form-item>
+      <el-input v-model="listQuery.form.buyer" placeholder="买家" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
+      <el-input v-model="listQuery.form.receiver" placeholder="收货人" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
+      <el-select v-model="listQuery.form.status" placeholder="订单状态" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+        <!-- <el-option v-for="item in statusList" :key="item.id" :label="item.status" :value="item.id" /> -->
+      </el-select>
+      <el-select v-model="listQuery.form.receiptStatus" placeholder="收款状态" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+        <!-- <el-option v-for="item in statusList" :key="item.id" :label="item.status" :value="item.id" /> -->
+      </el-select>
+      <el-select v-model="listQuery.form.sendOutStatus" placeholder="发货状态" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+        <!-- <el-option v-for="item in statusList" :key="item.id" :label="item.status" :value="item.id" /> -->
+      </el-select>
+      <el-select v-model="listQuery.form.payStatus" placeholder="付款状态" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+        <!-- <el-option v-for="item in statusList" :key="item.id" :label="item.status" :value="item.id" /> -->
+      </el-select>
+      <el-select v-model="listQuery.form.refundType" placeholder="退款状态" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+        <!-- <el-option v-for="item in statusList" :key="item.id" :label="item.status" :value="item.id" /> -->
+      </el-select>
+      <el-select v-model="listQuery.form.returnedPurchaseStatus" placeholder="待审核退款" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+        <!-- <el-option v-for="item in statusList" :key="item.id" :label="item.status" :value="item.id" /> -->
+      </el-select>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查询</el-button>
+    </div>
+
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      element-loading-text="Loading"
+      border
+      fit
+      highlight-current-row
+      style="width:100%;margin-top:20px;"
+    >
+      <el-table-column align="center" label="序号" width="35px">
+        <template slot-scope="scope">
+          {{ scope.$index }}
+        </template>
+      </el-table-column>
+      <el-table-column label="订单ID" align="center" prop="orderID" />
+      <el-table-column label="订单编号" align="center" prop="orderNo" />
+      <el-table-column label="买家" align="center" prop="buyer" />
+      <el-table-column label="收货人" align="center" prop="receiver" />
+      <el-table-column label="订单状态" align="center" prop="status" />
+      <el-table-column label="收款状态" align="center" prop="receiptStatus" />
+      <el-table-column label="付款状态" align="center" prop="payStatus" />
+      <el-table-column label="发货状态" align="center" prop="sendOutStatus" />
+      <el-table-column label="退款状态" align="center" prop="refundType" />
+      <el-table-column label="待审核退款" align="center" prop="returnedPurchaseStatus" />
+      <el-table-column label="订单金额" align="center" prop="payTotalFee" />
+      <el-table-column align="center" label="下单时间" prop="orderTime">
+        <template slot-scope="{row}">
+          <i class="el-icon-time" />
+          <span>{{ row.orderTime | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="{row}">
+          <router-link :to="'/order/detail/' + row.orderID "><el-button type="primary" size="small">查看详情</el-button></router-link>
+          <el-dropdown>
+            <el-button type="primary" size="small" style="margin-top:5px;">
+              功能<i class="el-icon-arrow-down el-icon--right" />
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>编辑经理折扣</el-dropdown-item>
+              <el-dropdown-item>备注</el-dropdown-item>
+              <el-dropdown-item>发货记录</el-dropdown-item>
+              <el-dropdown-item>收退款记录</el-dropdown-item>
+              <el-dropdown-item>退款（退货）记录</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="fetchData" />
+
   </div>
 </template>
 
 <script>
+import { getList } from '@/api/goods'
+import Pagination from '@/components/Pagination'
 export default {
+  components: { Pagination },
+  filters: {
+    statusFilter(status) {
+      const statusMap = {
+        1: 'success',
+        0: 'gray'
+      }
+      return statusMap[status]
+    }
+  },
   data() {
     return {
-      msg: '订单列表'
+      list: null,
+      listLoading: true,
+      total: 0,
+      searchTimeVal: '',
+      listQuery: {
+        page: 1,
+        limit: 10,
+        form: {
+          orderID: '',
+          orderNo: '',
+          buyer: '',
+          receiver: '',
+          status: '',
+          receiptStatus: '',
+          sendOutStatus: '',
+          payStatus: '',
+          refundType: '',
+          returnedPurchaseStatus: '',
+          organizeID: this.organizeID
+        }
+      }
+    }
+  },
+  computed: {
+    organizeID() {
+      return this.$store.state.settings.organizeID
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      this.listLoading = true
+      getList().then(response => {
+        this.list = response.data.items
+        this.listLoading = false
+      }).catch(() => {
+        // 封装静态数据
+        this.list = [
+          {
+            orderID: '1',
+            orderNo: 'ffgvdf',
+            buyer: '',
+            receiver: '',
+            status: '',
+            receiptStatus: '',
+            sendOutStatus: '',
+            payStatus: '',
+            refundType: '',
+            returnedPurchaseStatus: '',
+            payTotalFee: '',
+            orderTime: new Date(),
+            organizeID: this.organizeID
+          },
+          {
+            orderID: '',
+            orderNo: '',
+            buyer: '',
+            receiver: '',
+            status: '',
+            receiptStatus: '',
+            sendOutStatus: '',
+            payStatus: '',
+            refundType: '',
+            returnedPurchaseStatus: '',
+            payTotalFee: '',
+            orderTime: new Date(),
+            organizeID: this.organizeID
+          }
+        ]
+      })
+      this.listLoading = false
+      this.total = 2
+    },
+    handleFilter() {
+      alert('搜索')
+    },
+    handleCreate() {
+      alert('添加')
     }
   }
 }
@@ -16,4 +193,5 @@ export default {
 
 <style scoped>
 
-</style>
+</style>
+