网格员申办

packages/2.0.5/AppGridMember/AppGridMember.vue

@@ -1,79 +1,117 @@
 <template>
-  <div class="AppGridMember">
-    <keep-alive :include="['List']">
-      <component
-        ref="component"
-        :is="component"
-        @change="onChange"
-        :params="params"
-        :instance="instance"
-        :dict="dict"
-      ></component>
-    </keep-alive>
-  </div>
+  <ai-list class="AppGridMember" v-if="!isShowDetail">
+    <template slot="title">
+      <ai-title title="网格员管理" :isShowBottomBorder="false"></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 :ref="String(i)" v-if="currIndex == i" :is="tab.comp" @change="onChange" lazy :instance="instance" :dict="dict" :permissions="permissions"/>
+        </el-tab-pane>
+      </el-tabs>
+    </template>
+  </ai-list>
+  <Add v-else-if="component === 'Add'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></Add>
+  <Family v-else-if="component === 'Family'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></Family>
+  <ApplyDetail v-else-if="component === 'ApplyDetail'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></ApplyDetail>
+  <ApplyAdd v-else-if="component === 'ApplyAdd'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></ApplyAdd>
 </template>
 
 <script>
-import List from "./components/list";
-import Add from "./components/add";
-import Family from "./components/Family";
+  import List from './components/list'
+  import ApplyList from './components/ApplyList'
+  import Add from './components/add'
+  import ApplyDetail from './components/ApplyDetail'
+  import ApplyAdd from './components/ApplyAdd'
+  import Family from './components/Family'
 
-export default {
-  name: "AppGridMember",
-  label: "网格管理员",
+  export default {
+    name: "AppGridMember",
+    label: "网格管理员",
 
-  props: {
-    instance: Function,
-    dict: Object,
-  },
-
-  data() {
-    return {
-      component: "List",
-      params: {},
-      include: [],
-    };
-  },
-
-  components: {
-    Add,
-    List,
-    Family
-  },
-
-  mounted() {},
-
-  methods: {
-    onChange(data) {
-      if (data.type === "Add") {
-        this.component = "Add";
-        this.params = data.params;
-      }
-
-      if (data.type === "Family") {
-        this.component = "Family"
-        this.params = data.params
-      }
-
-      if (data.type === "list") {
-        this.component = "List";
-        this.params = data.params;
-
-        this.$nextTick(() => {
-          if (data.isRefresh) {
-            this.$refs.component.getList();
-          }
-        });
-      }
+    props: {
+      instance: Function,
+      dict: Object,
+      permissions: Function
     },
-  },
-};
+
+    data() {
+      return {
+        component: "List",
+        params: {},
+        include: [],
+        currIndex: '0',
+        isShowDetail: false
+      };
+    },
+
+      computed: {
+        tabs () {
+          const tabList = [
+            {label: '网格员信息', name: 'List', comp: List, permission: ''},
+            {label: '申报信息', name: 'ApplyList', comp: ApplyList, permission: ''}
+          ].filter(item => {
+            return true
+          })
+
+          return tabList
+        }
+      },
+
+    components: {
+      Add,
+      List,
+      Family,
+      ApplyList,
+      ApplyDetail,
+      ApplyAdd
+    },
+
+    mounted() {},
+
+    methods: {
+      onChange(data) {
+        if (data.type === "Add") {
+          this.component = "Add"
+          this.isShowDetail = true
+          this.params = data.params
+        }
+
+        if (data.type === "Family") {
+          this.component = "Family"
+          this.isShowDetail = true
+          this.params = data.params
+        }
+        if (data.type === "ApplyDetail") {
+          this.component = "ApplyDetail"
+          this.isShowDetail = true
+          this.params = data.params
+        }
+
+        if (data.type === "ApplyAdd") {
+          this.component = "ApplyAdd"
+          this.isShowDetail = true
+          this.params = data.params
+        }
+
+        if (data.type === "list") {
+          this.component = "List"
+          this.isShowDetail = false
+          this.params = data.params
+        }
+
+        if (data.type === "ApplyList") {
+          this.component = "ApplyList"
+          this.isShowDetail = false
+          this.params = data.params
+        }
+      }
+    }
+  }
 </script>
 
 <style lang="scss">
-.AppGridMember {
-  height: 100%;
-  background: #f3f6f9;
-  overflow: auto;
-}
+  .AppGridMember {
+    height: 100%;
+  }
 </style>