diff --git a/src/views/layout/components/main/site/index.vue b/src/views/layout/components/main/site/index.vue
index 336eac0..2d38791 100644
--- a/src/views/layout/components/main/site/index.vue
+++ b/src/views/layout/components/main/site/index.vue
@@ -1,4 +1,146 @@
 <template>
+  <div class="app-container">
+    <!-- 组合按钮 -->
+    <el-button-group>
+      <el-button type="primary" icon="el-icon-plus" @click="$router.replace('/site/add')">添加</el-button>
+      <el-button type="danger" icon="el-icon-delete" @click="deleteSite(countSelIdArr($refs.myTable.selection))">删除
+      </el-button>
+      <el-button type="warning" icon="el-icon-edit" @click="toEditPage()">编辑</el-button>
+    </el-button-group>
+    <!-- 用户select选项 -->
+    <el-button-group class="m-l-20">
+      <SelectionShopId v-model="form.shop_id" :allSel="true" />
+    </el-button-group>
+    <!-- 站点表格 -->
+    <el-table class="m-t-20 w-100" ref="myTable"
+      :data="siteListArr.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border tooltip-effect="dark">
+      <el-table-column align="center" type="selection" width="40">
+      </el-table-column>
+      <el-table-column align="center" prop="id" label="id" width="50">
+      </el-table-column>
+      <el-table-column prop="sitename" label="站点名称" width="120" min-width="100">
+      </el-table-column>
+      <el-table-column label="菊花码缩率图" width="120" min-width="150">
+        <template slot-scope="scope">
+          <el-image :src="scope.row.qr" :preview-src-list="[scope.row.qr]">
+          </el-image>
+        </template>
+      </el-table-column>
+      <el-table-column prop="describe" label="站点描述" min-width="80" show-overflow-tooltip>
+      </el-table-column>
+      <el-table-column align="center" label="已绑航线" width="200">
+        <template slot-scope="scope">
+          <el-tag class="iconfont"
+            :class="scope.row.bind_route === null || scope.row.bind_route === '' ? 'icon-ic_tingyong' : 'icon-feihangluxian'"
+            :type="scope.row.bind_route === null || scope.row.bind_route === '' ? 'danger' : ''">
+            <font class="m-l-5">{{ scope.row.bind_route === null || scope.row.bind_route === '' ? "未绑定" :
+              scope.row.bind_route }}</font>
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column prop="controler" label="操作" width="140" min-width="140">
+        <template slot-scope="scope">
+          <el-button-group>
+            <el-button type="danger" icon="el-icon-delete" @click="deleteSite([scope.row.id])">删除</el-button>
+          </el-button-group>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <el-pagination class="m-t-20" layout="prev, pager, next" :current-page.sync="currentPage" :page-size="pageSize"
+      :total="siteListArr.length">
+    </el-pagination>
+  </div>
+</template>
+
+<script>
+import { countSelIdArr } from '@/utils'
+import SelectionShopId from '@/components/SelectionShopId'
+
+export default {
+  name: 'Site',
+  data () {
+    return {
+      pageSize: 8, // 每页显示记录条数
+      currentPage: 1, // 当前页
+      form: {
+        shop_id: ''
+      }
+    }
+  },
+  components: {
+    SelectionShopId
+  },
+  computed: {
+    /**
+     * @description: 获取站点列表
+     */
+    siteList () {
+      return this.$store.state.siteList
+    },
+    /**
+     * @description: 过滤掉 不对应客户的 站点列表
+     * @return: 站点列表
+     */
+    siteListArr () {
+      if (this.form.shop_id !== '') {
+        return this.siteList.filter((item) => item.shop_id === this.form.shop_id)
+      } else {
+        return this.siteList
+      }
+    }
+  },
+  methods: {
+    countSelIdArr,
+    /**
+     * @description: 跳转到编辑页面
+     */
+    toEditPage () {
+      const selId = this.countSelIdArr(this.$refs.myTable.selection)
+      switch (selId.length) {
+        case 0:
+          this.$message.error('请选择一条需要编辑的记录')
+          break
+        case 1:
+          this.$router.push('/site/edit/' + selId['0'])
+          break
+        default:
+          this.$message.error('只能选择一条记录')
+      }
+    },
+    /**
+     * @description: 删除站点
+     */
+    deleteSite (idArr) {
+      this.$store.dispatch('fetchDelSite', idArr)
+    }
+  },
+  watch: {
+  },
+  created () {
+  },
+  filters: {
+    countSelIdArr
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/styles/theme.scss";
+
+.el-tag {
+  i {
+    vertical-align: middle
+  }
+}
+
+.image-placeholder {
+  position: relative;
+  display: inline-block;
+}
+</style>
+
+<!-- <template>
   <div>
     <video
       ref="video"
@@ -42,4 +184,4 @@ export default {
     }
   }
 }
-</script>
+</script> -->