From fc0d443bb7d89c7ac66d83e4f1df4d88433fda43 Mon Sep 17 00:00:00 2001
From: BigBoss <2280520255@qq.com>
Date: Thu, 25 Jun 2020 22:54:18 +0800
Subject: [PATCH] app

---
 src/views/application/Menu/analys.vue    |  61 ++++++++++
 src/views/application/Menu/appList.vue   |  61 ++++++++++
 src/views/application/Menu/orderList.vue |  61 ++++++++++
 src/views/application/Menu/userList.vue  |  61 ++++++++++
 src/views/application/appList.vue        | 192 +++++++++++++++++++++----------
 src/views/application/appManage.vue      |   2 +-
 6 files changed, 377 insertions(+), 61 deletions(-)
 create mode 100644 src/views/application/Menu/analys.vue
 create mode 100644 src/views/application/Menu/appList.vue
 create mode 100644 src/views/application/Menu/orderList.vue
 create mode 100644 src/views/application/Menu/userList.vue

diff --git a/src/views/application/Menu/analys.vue b/src/views/application/Menu/analys.vue
new file mode 100644
index 0000000..437ca5a
--- /dev/null
+++ b/src/views/application/Menu/analys.vue
@@ -0,0 +1,61 @@
+<template>
+  <el-table
+    :data="tableData3"
+    height="250"
+    border
+    style="width: 100%"
+  >
+    <el-table-column
+      prop="date"
+      label="日期"
+      width="180"
+    />
+    <el-table-column
+      prop="name"
+      label="姓名"
+      width="180"
+    />
+    <el-table-column
+      prop="address"
+      label="地址"
+    />
+  </el-table>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      tableData3: [{
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-08',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-06',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-07',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }]
+    }
+  }
+}
+</script>
diff --git a/src/views/application/Menu/appList.vue b/src/views/application/Menu/appList.vue
new file mode 100644
index 0000000..437ca5a
--- /dev/null
+++ b/src/views/application/Menu/appList.vue
@@ -0,0 +1,61 @@
+<template>
+  <el-table
+    :data="tableData3"
+    height="250"
+    border
+    style="width: 100%"
+  >
+    <el-table-column
+      prop="date"
+      label="日期"
+      width="180"
+    />
+    <el-table-column
+      prop="name"
+      label="姓名"
+      width="180"
+    />
+    <el-table-column
+      prop="address"
+      label="地址"
+    />
+  </el-table>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      tableData3: [{
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-08',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-06',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-07',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }]
+    }
+  }
+}
+</script>
diff --git a/src/views/application/Menu/orderList.vue b/src/views/application/Menu/orderList.vue
new file mode 100644
index 0000000..437ca5a
--- /dev/null
+++ b/src/views/application/Menu/orderList.vue
@@ -0,0 +1,61 @@
+<template>
+  <el-table
+    :data="tableData3"
+    height="250"
+    border
+    style="width: 100%"
+  >
+    <el-table-column
+      prop="date"
+      label="日期"
+      width="180"
+    />
+    <el-table-column
+      prop="name"
+      label="姓名"
+      width="180"
+    />
+    <el-table-column
+      prop="address"
+      label="地址"
+    />
+  </el-table>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      tableData3: [{
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-08',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-06',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-07',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }]
+    }
+  }
+}
+</script>
diff --git a/src/views/application/Menu/userList.vue b/src/views/application/Menu/userList.vue
new file mode 100644
index 0000000..437ca5a
--- /dev/null
+++ b/src/views/application/Menu/userList.vue
@@ -0,0 +1,61 @@
+<template>
+  <el-table
+    :data="tableData3"
+    height="250"
+    border
+    style="width: 100%"
+  >
+    <el-table-column
+      prop="date"
+      label="日期"
+      width="180"
+    />
+    <el-table-column
+      prop="name"
+      label="姓名"
+      width="180"
+    />
+    <el-table-column
+      prop="address"
+      label="地址"
+    />
+  </el-table>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      tableData3: [{
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-08',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-06',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-07',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }]
+    }
+  }
+}
+</script>
diff --git a/src/views/application/appList.vue b/src/views/application/appList.vue
index d607682..1e72d43 100644
--- a/src/views/application/appList.vue
+++ b/src/views/application/appList.vue
@@ -1,82 +1,154 @@
 <template>
-  <el-container class="app-container">
-    <el-header>
-      应用列表
-    </el-header>
-    <el-main>
-      asd
-    </el-main>
-    <el-aside>
-      <el-input v-model="filterText" placeholder="Filter keyword" style="margin-bottom:30px;" />
-      <el-tree
-        ref="tree2"
-        :data="data2"
-        :props="defaultProps"
-        :filter-node-method="filterNode"
-        class="filter-tree"
-        default-expand-all
-      />
+  <el-container style="height: 853px; border: 1px solid #eee">
+    <el-aside width="250px" style="background-color: rgb(238, 241, 246)">
+      <el-menu :default-openeds="['1','2', '3']">
+        <el-submenu index="1">
+          <template slot="title"><i class="el-icon-message" />非常戴镜</template>
+          <el-menu-item v-for="(item,i) in nav_menu_data" :key="i" :index="item.name">{{ item.title }}</el-menu-item>
+        </el-submenu>
+        <el-submenu index="2">
+          <template slot="title"><i class="el-icon-menu" />亚当光学</template>
+          <el-menu-item index="2-1">产品列表</el-menu-item>
+          <el-menu-item index="2-2">订单列表</el-menu-item>
+          <el-menu-item index="2-3">用户列表</el-menu-item>
+          <el-menu-item index="2-4">运行分析</el-menu-item>
+        </el-submenu>
+        <el-submenu index="3">
+          <template slot="title"><i class="el-icon-setting" />秀野光学</template>
+          <el-menu-item index="3-1">产品列表</el-menu-item>
+          <el-menu-item index="3-2">订单列表</el-menu-item>
+          <el-menu-item index="3-3">用户列表</el-menu-item>
+          <el-menu-item index="3-4">运行分析</el-menu-item>
+        </el-submenu>
+      </el-menu>
     </el-aside>
 
+    <el-container>
+      <el-header style="text-align: center; font-size: 24px">
+        <span>这里的title</span>
+      </el-header>
+
+      <el-main>
+        <el-tabs v-model="activeName" tab-position="top" @tab-click="handleClick">
+          <el-tab-pane label="产品列表" name="first">
+            <el-table :data="prodListTableData" stripe>
+              <el-table-column prop="prodInfo" label="产品信息" width="340" />
+              <el-table-column prop="prodTag" label="产品标签" width="340" />
+              <el-table-column prop="stock" label="库存" width="340" />
+              <el-table-column label="操作">
+                <el-button type="text">从应用中删除</el-button>
+              </el-table-column>
+            </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="订单列表" name="second">
+            <el-table :data="prodListTableData" stripe>
+              <el-table-column prop="prodInfo" label="下单时间" width="220" />
+              <el-table-column prop="prodTag" label="金额" width="220" />
+              <el-table-column prop="stock" label="产品id" width="220" />
+              <el-table-column prop="stock" label="订单号" width="220" />
+              <el-table-column prop="stock" label="状态" width="220" />
+              <el-table-column label="操作">
+                <el-button type="text">从应用中删除</el-button>
+              </el-table-column>
+            </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="用户列表" name="third">
+            <el-table :data="prodListTableData" stripe>
+              <el-table-column prop="prodInfo" label="用户id" width="180" />
+              <el-table-column prop="prodTag" label="加入时间" width="180" />
+              <el-table-column prop="stock" label="引流人" width="180" />
+              <el-table-column prop="stock" label="引流渠道" width="180" />
+              <el-table-column prop="stock" label="消费额度" width="180" />
+              <el-table-column prop="stock" label="访问时长" width="180" />
+              <el-table-column prop="stock" label="带来流量" width="180" />
+              <el-table-column label="操作">
+                <el-button type="text">从应用中删除</el-button>
+              </el-table-column>
+            </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="运营分析" name="fourth">
+            <el-table :data="prodListTableData" stripe>
+              <el-table-column prop="prodInfo" label="产品信息" width="340" />
+              <el-table-column prop="prodTag" label="产品标签" width="340" />
+              <el-table-column prop="stock" label="库存" width="340" />
+              <el-table-column label="操作">
+                <el-button type="text">从应用中删除</el-button>
+              </el-table-column>
+            </el-table>
+          </el-tab-pane>
+        </el-tabs>
+      </el-main>
+    </el-container>
   </el-container>
+
 </template>
 
 <script>
 export default {
-
   data() {
     return {
-      filterText: '',
-      data2: [{
-        id: 1,
-        label: 'Level one 1',
-        children: [{
-          id: 4,
-          label: 'Level two 1-1' },
-        {
-          id: 10,
-          label: 'Level three 1-1-2'
-        }
-        ]
+      activeName: 'second',
+      path: '',
+      nav_menu_data: [{
+        title: '产品列表',
+        path: '/Menu/appList'
       }, {
-        id: 2,
-        label: 'Level one 2',
-        children: [{
-          id: 5,
-          label: 'Level two 2-1'
-        }, {
-          id: 6,
-          label: 'Level two 2-2'
-        }]
+        title: '订单列表',
+        path: '/Menu/orderList'
       }, {
-        id: 3,
-        label: 'Level one 3',
-        children: [{
-          id: 7,
-          label: 'Level two 3-1'
-        }, {
-          id: 8,
-          label: 'Level two 3-2'
-        }]
+        title: '用户列表',
+        path: '/Menu/userList'
+      }, {
+        title: '运营分析',
+        path: '/Menu/analys'
       }],
-      defaultProps: {
-        children: 'children',
-        label: 'label'
-      }
+      prodListTableData: [{
+        prodInfo: 'pic',
+        prodTag: '非常带劲',
+        stock: '102'
+      },
+      {
+        prodInfo: 'pic',
+        prodTag: '非常带劲',
+        stock: '4531'
+      },
+      {
+        prodInfo: 'pic',
+        prodTag: '非常带劲',
+        stock: '531'
+      },
+      {
+        prodInfo: 'pic',
+        prodTag: '非常带劲',
+        stock: '768'
+      }]
     }
   },
   watch: {
-    filterText(val) {
-      this.$refs.tree2.filter(val)
-    }
   },
-
-  methods: {
-    filterNode(value, data) {
-      if (!value) return true
-      return data.label.indexOf(value) !== -1
+  created() {
+  },
+  method: {
+    onRouteChanged() {
+      const that = this
+      that.path = that.$route.path
+    },
+    handleClick(tab, event) {
+      console.log(tab, event)
     }
   }
 }
+
 </script>
 
+<style>
+  .el-header {
+    background-color: #B3C0D1;
+    color: #333;
+    line-height: 60px;
+  }
+
+  .el-aside {
+    color: #333;
+  }
+</style>
diff --git a/src/views/application/appManage.vue b/src/views/application/appManage.vue
index 4e742a5..ba75ff5 100644
--- a/src/views/application/appManage.vue
+++ b/src/views/application/appManage.vue
@@ -73,7 +73,7 @@ export default {
 </script>
 
 <style scoped>
-.line{
+.el-header{
   text-align: center;
 }
 </style>
-- 
2.0.0