商户统计

vue-admin-template-master/package.json

@@ -16,7 +16,7 @@
   "dependencies": {
     "axios": "0.18.1",
     "core-js": "3.6.5",
-    "element-china-area-data": "^5.0.0",
+    "element-china-area-data": "^5.0.2",
     "element-ui": "2.13.2",
     "js-cookie": "2.2.0",
     "normalize.css": "7.0.0",

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

@@ -0,0 +1,5 @@
+import { coffeeStore } from "@/data/store";
+//咖啡门店列表
+export function getCoffeeStore() {
+  return Promise.resolve(coffeeStore);
+}

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

@@ -100,6 +100,19 @@ export const constantRoutes = [
       }
     ]
   },
+  //商户统计
+  {
+    path: "/merchant",
+    component: Layout,
+    children: [
+      {
+        path: "index",
+        name: "Merchant",
+        component: () => import("@/views/merchant/index"),
+        meta: { title: "商户统计", icon: "el-icon-data-board" }
+      }
+    ]
+  },
 
   //下单
   {

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

@@ -0,0 +1,291 @@
+<template>
+  <div class="app-container">
+    <!-- 门店列表 -->
+    <el-card class="box-card">
+      <div class="pd-30">
+        <!-- <el-input
+          clearable
+          prefix-icon="el-icon-search"
+          v-model="listQuery.name"
+          placeholder="请输入门店名称"
+          style="width: 300px;"
+          class="filter-item"
+          @keyup.enter.native="handleFilter"
+        /> -->
+
+        <el-cascader
+          size="large"
+          :options="options3"
+          v-model="listQuery.selectedOptions"
+          @change="handleChange"
+        >
+        </el-cascader>
+
+        <el-select
+          style="margin-left: 10px;"
+          v-model="listQuery.type"
+          placeholder="请选择"
+        >
+          <el-option
+            v-for="item in options1"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+            clearable
+            :disabled="item.disabled"
+          >
+          </el-option>
+        </el-select>
+
+        <el-select
+          style="margin-left: 10px;"
+          v-model="listQuery.name"
+          placeholder="请选择"
+        >
+          <el-option
+            v-for="item in options2"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+            clearable
+            :disabled="item.disabled"
+          >
+          </el-option>
+        </el-select>
+
+        <el-button
+          style="margin-left: 10px;"
+          :loading="searchLoading"
+          type="primary"
+          icon="el-icon-search"
+          @click="handleFilter"
+          disabled
+        >
+          搜索
+        </el-button>
+      </div>
+      <el-table
+        :data="tableData"
+        style="width: 100%;fontSize:12px;"
+        v-loading="listLoading"
+        :cell-style="{ padding: '6px 0' }"
+      >
+        <el-table-column prop="_id" label="ID" width="90px"></el-table-column>
+        <el-table-column
+          prop="storeName"
+          label="storeName"
+          width="210"
+          show-overflow-tooltip
+        ></el-table-column>
+        <el-table-column
+          prop="shipping_time"
+          label="shipping_time"
+        ></el-table-column>
+        <el-table-column
+          prop="shipping_fee"
+          width="100"
+          label="shipping_fee"
+        ></el-table-column>
+        <el-table-column
+          prop="score"
+          width="100"
+          label="score"
+        ></el-table-column>
+        <el-table-column prop="sales" label="sales"></el-table-column>
+        <el-table-column
+          prop="phone_list"
+          show-overflow-tooltip
+          label="phone_list"
+        ></el-table-column>
+        <el-table-column
+          prop="min_price"
+          width="100"
+          label="min_price"
+        ></el-table-column>
+
+        <el-table-column
+          prop="comment_num"
+          width="120"
+          show-overflow-tooltip
+          label="comment_num"
+        ></el-table-column>
+        <el-table-column
+          prop="call_center"
+          show-overflow-tooltip
+          label="call_center"
+        ></el-table-column>
+        <el-table-column
+          prop="address"
+          show-overflow-tooltip
+          label="address"
+        ></el-table-column>
+
+        <!-- <el-table-column
+          label="操作"
+          align="center"
+          width="230"
+          class-name="small-padding fixed-width"
+        >
+          <template slot-scope="{row}">
+            <el-button type="primary" size="mini" @click="handleUpdate(row)">编辑</el-button>
+            <el-button type="primary" size="mini" @click="handleUpdate(row)">商品管理</el-button>
+          </template>
+        </el-table-column>-->
+      </el-table>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { getCoffeeStore } from "@/api/store";
+import {
+  provinceAndCityData,
+  CodeToText,
+  TextToCode
+} from "element-china-area-data";
+const options1 = [
+  {
+    value: "饿了么",
+    label: "饿了么",
+    disabled: true
+  },
+  {
+    value: "美团",
+    label: "美团"
+  },
+  {
+    value: "高德地图",
+    label: "高德地图",
+    disabled: true
+  },
+  {
+    value: "大众点评",
+    label: "大众点评",
+    disabled: true
+  }
+];
+const options2 = [
+  {
+    value: "烘焙",
+    label: "烘焙",
+    disabled: true
+  },
+  {
+    value: "咖啡馆",
+    label: "咖啡馆"
+  },
+  {
+    value: "甜点",
+    label: "甜点",
+    disabled: true
+  },
+  {
+    value: "饮品",
+    label: "饮品",
+    disabled: true
+  },
+  {
+    value: "网咖",
+    label: "网咖",
+    disabled: true
+  },
+  {
+    value: "西餐厅",
+    label: "西餐厅",
+    disabled: true
+  },
+  {
+    value: "便利店",
+    label: "便利店",
+    disabled: true
+  },
+  {
+    value: "美食城",
+    label: "美食城",
+    disabled: true
+  },
+  {
+    value: "酒店",
+    label: "酒店",
+    disabled: true
+  },
+  {
+    value: "猫咖",
+    label: "猫咖",
+    disabled: true
+  },
+  {
+    value: "书吧",
+    label: "书吧",
+    disabled: true
+  }
+];
+export default {
+  data() {
+    return {
+      tableData: [],
+      listQuery: {
+        type: "美团",
+        name: "咖啡馆",
+        selectedOptions: [
+          TextToCode["上海市"].code,
+          TextToCode["上海市"]["市辖区"].code
+        ]
+      },
+      listLoading: true,
+      searchLoading: false,
+      options1,
+      options2,
+      options3: provinceAndCityData
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    getList() {
+      this.listLoading = true;
+      getCoffeeStore().then(res => {
+        console.log(res);
+        this.listLoading = false;
+        this.tableData = res;
+      });
+    },
+    handleFilter() {},
+    selectChange() {},
+    handleChange(value) {
+      console.log(CodeToText[value[0]], CodeToText[value[1]]);
+      console.log(value);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.pd-30 {
+  padding: 10px 0 30px;
+}
+.shop-message {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  .shop-message-l {
+    display: flex;
+    align-items: center;
+  }
+  .shop-message-l > div {
+    margin: 0 30px;
+    text-align: center;
+  }
+  .line {
+    width: 1px;
+    height: 70px;
+    background: #dddddd;
+  }
+}
+.black-20 {
+  height: 20px;
+  overflow: hidden;
+  clear: both;
+}
+</style>