09/12 14:48

简单列表完成

src/router/index.js

@@ -197,6 +197,34 @@ export const constantRoutes = [
     ]
   },
   {
+    path: '/categoryManager',
+    component: Layout,
+    meta: { title: '系统内部管理' },
+    children: [{
+      path: 'adminManager',
+      name: 'adminManager',
+      meta: { title: '权限管理' },
+      component: () => import('@/views/categroyManager/adminManager')
+    },
+    {
+      path: 'staffManager',
+      name: 'staffManager',
+      meta: { title: '员工管理' },
+      component: () => import('@/views/categroyManager/staffManager')
+    }, {
+      path: 'branchManager',
+      name: 'branchManager',
+      meta: { title: '合作单位' },
+      component: () => import('@/views/categroyManager/branchManager')
+    }, {
+      path: 'addressManager',
+      name: 'addressManager',
+      meta: { title: '教学点管理' },
+      component: () => import('@/views/categroyManager/addressManager')
+    }
+    ]
+  },
+  {
     path: '/example',
     component: Layout,
     redirect: '/example/table',

src/views/businessManager/shopManager/shopList.vue

@@ -1,11 +1,98 @@
 <template>
-  <div>
-    商品列表
+  <div class="m-container">
+    <h2>商品列表</h2>
+    <div class="m-core">
+      <!-- 搜索类型 -->
+      <el-form :inline="true"
+               class="searchForm"
+               v-model="searchForm">
+        <el-form-item>
+          <el-select v-model="searchForm.status"
+                     placeholder="工作类型">
+            <el-option label="哈哈哈"
+                       value="1"></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <!-- 查询列表 -->
+      <div class="searchWrap">
+        <p>查询条件:</p>
+        <div class="searchItem"
+             @click="closeSearch(item)"
+             v-for="(item,index) in searchLsit">
+          {{ item.key }}
+          <i class="el-icon-close"></i>
+        </div>
+      </div>
+      <!-- 列表 -->
+      <div class="tableWrap">
+        <el-table :data='tableList'>
+          <el-table-column align='center'
+                           label="商品编号">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="品牌">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="商品名称">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="商品类型">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="具体型号">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="商品价格">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="商品团购价">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="商品采购价">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="商品缩略图片">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="商品明细">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="操作">
+          </el-table-column>
+        </el-table>
+        <pagination :total="rules.total"
+                    :page.sync="rules.page"
+                    :limit.sync="rules.limit"
+                    :page-sizes="rules.page_size"
+                    @pagination="getList" />
+      </div>
+    </div>
   </div>
 </template>
 <script>
+import pagination from '@/components/Pagination/index'
 export default {
-
+  components: { pagination },
+  data () {
+    return {
+      searchForm: {
+        status: ''
+      },
+      searchLsit: [],
+      tableList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50] // 选择限制显示条数
+      },
+    }
+  },
+  methods: {
+    getList () { }
+  }
 }
 </script>
 <style lang="scss">

src/views/categroyManager/addressManager.vue

@@ -0,0 +1,94 @@
+<template>
+  <div class='m-container'>
+    <h2>分部教学点</h2>
+    <div class="m-core">
+      <div class='newBand'>新建</div>
+      <!-- 搜索类型 -->
+      <el-form :inline="true"
+               class="searchForm"
+               v-model="searchForm">
+        <el-form-item>
+          <el-select v-model="searchForm.status"
+                     placeholder="工作类型">
+            <el-option label="哈哈哈"
+                       value="1"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-input suffix-icon="el-icon-search"
+                    placeholder="请输入搜索内容"></el-input>
+        </el-form-item>
+      </el-form>
+      <!-- 查询列表 -->
+      <div class="searchWrap">
+        <p>查询条件:</p>
+        <div class="searchItem"
+             @click="closeSearch(item)"
+             v-for="(item,index) in searchLsit">
+          {{ item.key }}
+          <i class="el-icon-close"></i>
+        </div>
+      </div>
+      <!-- 列表 -->
+      <div class="tableWrap">
+        <el-table :data='tableList'>
+          <el-table-column align='center'
+                           label="编号">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="教学点名称">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="教学点来源">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="费用">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="上课地点详情">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="状态">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="操作">
+          </el-table-column>
+        </el-table>
+        <pagination :total="rules.total"
+                    :page.sync="rules.page"
+                    :limit.sync="rules.limit"
+                    :page-sizes="rules.page_size"
+                    @pagination="getList" />
+      </div>
+    </div>
+  </div>
+  </div>
+</template>
+<script>
+import pagination from '@/components/Pagination/index'
+export default {
+  components: { pagination },
+  name: 'adminManager',
+  data () {
+    return {
+      searchForm: {
+        status: ''
+      },
+      searchLsit: [],
+      tableList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50] // 选择限制显示条数
+      },
+    }
+  },
+  methods: {
+    getList () { }
+  }
+}
+</script>
+<style lang="scss">
+</style>

src/views/categroyManager/adminManager.vue

@@ -0,0 +1,85 @@
+<template>
+  <div class='m-container'>
+    <h2>系统角色权限管理</h2>
+    <div class="m-core">
+      <div class='newBand'>添加</div>
+      <!-- 搜索类型 -->
+      <el-form :inline="true"
+               class="searchForm"
+               v-model="searchForm">
+        <el-form-item>
+          <el-select v-model="searchForm.status"
+                     placeholder="工作类型">
+            <el-option label="哈哈哈"
+                       value="1"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-input suffix-icon="el-icon-search"
+                    placeholder="请输入搜索内容"></el-input>
+        </el-form-item>
+      </el-form>
+      <!-- 查询列表 -->
+      <div class="searchWrap">
+        <p>查询条件:</p>
+        <div class="searchItem"
+             @click="closeSearch(item)"
+             v-for="(item,index) in searchLsit">
+          {{ item.key }}
+          <i class="el-icon-close"></i>
+        </div>
+      </div>
+      <!-- 列表 -->
+      <div class="tableWrap">
+        <el-table :data='tableList'>
+          <el-table-column align='center'
+                           label="角色分类">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="状态">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="权限范围">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="操作">
+          </el-table-column>
+        </el-table>
+        <pagination :total="rules.total"
+                    :page.sync="rules.page"
+                    :limit.sync="rules.limit"
+                    :page-sizes="rules.page_size"
+                    @pagination="getList" />
+      </div>
+    </div>
+  </div>
+  </div>
+</template>
+<script>
+import pagination from '@/components/Pagination/index'
+export default {
+  components: { pagination },
+  name: 'adminManager',
+  data () {
+    return {
+      searchForm: {
+        status: ''
+      },
+      searchLsit: [],
+      tableList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50] // 选择限制显示条数
+      },
+    }
+  },
+  methods: {
+    getList () { }
+  }
+}
+</script>
+<style lang="scss">
+</style>

src/views/categroyManager/branchManager.vue

@@ -0,0 +1,94 @@
+<template>
+  <div class='m-container'>
+    <h2>合作单位</h2>
+    <div class="m-core">
+      <div class='newBand'>新建</div>
+      <!-- 搜索类型 -->
+      <el-form :inline="true"
+               class="searchForm"
+               v-model="searchForm">
+        <el-form-item>
+          <el-select v-model="searchForm.status"
+                     placeholder="工作类型">
+            <el-option label="哈哈哈"
+                       value="1"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-input suffix-icon="el-icon-search"
+                    placeholder="请输入搜索内容"></el-input>
+        </el-form-item>
+      </el-form>
+      <!-- 查询列表 -->
+      <div class="searchWrap">
+        <p>查询条件:</p>
+        <div class="searchItem"
+             @click="closeSearch(item)"
+             v-for="(item,index) in searchLsit">
+          {{ item.key }}
+          <i class="el-icon-close"></i>
+        </div>
+      </div>
+      <!-- 列表 -->
+      <div class="tableWrap">
+        <el-table :data='tableList'>
+          <el-table-column align='center'
+                           label="单位编号">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="单位名称">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="联系人">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="职位">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="手机号">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="上课地点">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="操作">
+          </el-table-column>
+        </el-table>
+        <pagination :total="rules.total"
+                    :page.sync="rules.page"
+                    :limit.sync="rules.limit"
+                    :page-sizes="rules.page_size"
+                    @pagination="getList" />
+      </div>
+    </div>
+  </div>
+  </div>
+</template>
+<script>
+import pagination from '@/components/Pagination/index'
+export default {
+  components: { pagination },
+  name: 'adminManager',
+  data () {
+    return {
+      searchForm: {
+        status: ''
+      },
+      searchLsit: [],
+      tableList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50] // 选择限制显示条数
+      },
+    }
+  },
+  methods: {
+    getList () { }
+  }
+}
+</script>
+<style lang="scss">
+</style>

src/views/categroyManager/staffManager.vue

@@ -0,0 +1,100 @@
+<template>
+  <div class='m-container'>
+    <h2>员工管理</h2>
+    <div class="m-core">
+      <div class='newBand'>添加</div>
+      <!-- 搜索类型 -->
+      <el-form :inline="true"
+               class="searchForm"
+               v-model="searchForm">
+        <el-form-item>
+          <el-select v-model="searchForm.status"
+                     placeholder="工作类型">
+            <el-option label="哈哈哈"
+                       value="1"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-input suffix-icon="el-icon-search"
+                    placeholder="请输入搜索内容"></el-input>
+        </el-form-item>
+      </el-form>
+      <!-- 查询列表 -->
+      <div class="searchWrap">
+        <p>查询条件:</p>
+        <div class="searchItem"
+             @click="closeSearch(item)"
+             v-for="(item,index) in searchLsit">
+          {{ item.key }}
+          <i class="el-icon-close"></i>
+        </div>
+      </div>
+      <!-- 列表 -->
+      <div class="tableWrap">
+        <el-table :data='tableList'>
+          <el-table-column align='center'
+                           label="姓名">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="手机号">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="角色分类">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="工作类型">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="所属部门">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="状态">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="入职时间">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="离职时间">
+          </el-table-column>
+          <el-table-column align='center'
+                           label="操作">
+          </el-table-column>
+        </el-table>
+        <pagination :total="rules.total"
+                    :page.sync="rules.page"
+                    :limit.sync="rules.limit"
+                    :page-sizes="rules.page_size"
+                    @pagination="getList" />
+      </div>
+    </div>
+  </div>
+  </div>
+</template>
+<script>
+import pagination from '@/components/Pagination/index'
+export default {
+  components: { pagination },
+  name: 'adminManager',
+  data () {
+    return {
+      searchForm: {
+        status: ''
+      },
+      searchLsit: [],
+      tableList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50] // 选择限制显示条数
+      },
+    }
+  },
+  methods: {
+    getList () { }
+  }
+}
+</script>
+<style lang="scss">
+</style>