社会资源

project/pengliuyang/apps/AppCommunityResource/AppCommunityResource.vue

@@ -1,10 +1,11 @@
 <template>
-  <keep-alive include="resourceMap">
+  <keep-alive include="resourceList">
     <component :is="currentPage" v-bind="$props" @change="onChange"/>
   </keep-alive>
 </template>
 
 <script>
+import resourceList from "./components/resourceList.vue"
 import resourceMap from "./components/resourceMap.vue"
 import resourceManagement from "./components/resourceManagement.vue"
 import resourceClassification from './components/resourceClassification.vue'
@@ -22,11 +23,12 @@ export default {
   computed: {
     currentPage() {
       let { hash } = this.$route
-      return hash == "#resourceMap" ? resourceMap :
-              hash == "#resourceManagement" ? resourceManagement : resourceClassification
+      return hash == "#resourceClassification" ? resourceClassification :
+              hash == "#resourceManagement" ? resourceManagement : hash == "#resourceMap" ? resourceMap:resourceList
     }
   },
   components: {
+    resourceList,
     resourceMap,
     resourceManagement,
     resourceClassification,
@@ -35,7 +37,7 @@ export default {
   methods: {
     onChange(data) {
       let {type, params: query} = data,
-          hash = ["resourceMap", "resourceManagement","resourceClassification"].includes(type) ? "" : "#" + type
+          hash = ["resourceMap", "resourceManagement","resourceClassification","resourceList"].includes(type) ? "" : "#" + type
       this.$router.push({hash, query})
     }
   }

project/pengliuyang/apps/AppCommunityResource/components/resourceList.vue

@@ -0,0 +1,91 @@
+<template>
+  <ai-list class="resourceList">
+    <template slot="title">
+      <ai-title title="社会资源" :isShowBottomBorder="true" :isShowArea="true" v-model="areaId" @change="changeAreaId" :instance="instance">
+        <template slot="sub">
+          <div>方便成员能够快速找到指定区域内的社区资源</div>
+        </template>
+      </ai-title>
+    </template>
+    <template slot="tabs">
+      <el-tabs v-model="currIndex">
+        <el-tab-pane v-for="(tab,i) in tabs" :key="i" :label="tab.label">
+          <component :is="tab.comp" v-if="currIndex === String(i)" :ref="tab.name" v-on="$listeners" :areaId="areaId" v-bind="$props"/>
+        </el-tab-pane>
+      </el-tabs>
+    </template>
+  </ai-list>
+</template>
+
+<script>
+import resourceMap from "./resourceMap.vue"
+import resourceManagement from "./resourceManagement.vue"
+import resourceClassification from './resourceClassification.vue'
+import {mapState} from 'vuex'
+
+export default {
+  name: 'resourceList',
+  components: {
+    resourceMap,
+    resourceManagement,
+    resourceClassification
+  },
+  props: {
+    instance: Function,
+    dict: Object,
+    permissions: Function,
+  },
+
+  data() {
+    return {
+      currIndex: "0",
+      areaId: '',
+    }
+  },
+
+  computed: {
+    ...mapState(['user']),
+    tabs() {
+      return [
+        {
+          label: "资源地图",
+          name: "resourceMap",
+          comp: resourceMap,
+          permission: "",
+        },
+        {
+          label: "资源管理",
+          name: "resourceManagement",
+          comp: resourceManagement,
+          permission: "",
+        },
+        {
+          label: "资源分类",
+          name: "resourceClassification",
+          comp: resourceClassification,
+          permission: "",
+        },
+      ]
+    }
+  },
+  created() {
+    this.areaId = this.user.info.areaId
+  },
+
+  methods: {
+    changeArea() {
+      this.$nextTick(() => {
+        // this.$refs[this.tabs[Number(this.currIndex)].name][0].getList()
+      })
+    }
+  },
+
+}
+</script>
+
+<style lang="scss" scoped>
+.resourceList {
+  height: 100%;
+  width: 100%;
+}
+</style>