积分超市

project/fengdu/app/AppIntegratingSupermarket/AppIntegratingSupermarket.vue

@@ -1,105 +1,112 @@
 <template>
-  <div class="AppScoreSupermarket">
-    <ai-list v-show="!detailShow">
-      <template slot="title">
-        <ai-title title="积分超市" :isShowBottomBorder="false" :instance="instance" :isShowArea="true" v-model="areaId" @change="changeArea"></ai-title>
-      </template>
-      <template slot="tabs">
-        <el-tabs v-model="currIndex">
-          <el-tab-pane v-for="(tab,i) in tabs" :key="i" :name="String(i)" :label="tab.label">
-            <component
-              :is="tab.comp"
-              v-if="currIndex === String(i)"
-              :areaId="areaId"
-              :ref="tab.name"
-              @showDetail="showDetail"
-              :instance="instance"
-              :dict="dict"
-              :permissions="permissions" />
-          </el-tab-pane>
-        </el-tabs>
-      </template>
-    </ai-list>
-    <component v-if="detailShow" :is="currDet" :areaId="areaId" :info="info" @goBack="goBack" :instance="instance" :dict="dict" :permissions="permissions"/>
-  </div>
+  <ai-list 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 :areaId="areaId" :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>
+  <AddGoods v-else-if="componentName === 'AddGoods'" :areaId="areaId" :params="params" :instance="instance" :dict="dict" @change="onChange"></AddGoods>
+  <AddStore v-else-if="componentName === 'AddStore'" :areaId="areaId" :params="params" :instance="instance" :dict="dict" @change="onChange"></AddStore>
 </template>
 
 <script>
-import goodsManagement from './goodsManagement'
-import storeManagement from './storeManagement'
-import addGoods from './components/addGoods'
-import {mapState} from 'vuex'
+  import AddGoods from './components/AddGoods'
+  import AddStore from './components/AddStore'
+  import StoreList from './components/StoreList'
+  import GoodsList from './components/GoodsList'
+  import { mapState } from 'vuex'
 
-export default {
-  name: "AppIntegratingSupermarket",
-  label: "积分超市",
-  components: { goodsManagement, storeManagement, addGoods},
-  props: {
-    instance: Function,
-    dict: Object,
-    permissions: Function
-  },
+  export default {
+    name: 'AppIntegratingSupermarket',
+    label: '积分超市',
 
-  computed: {
-    tabs() {
-      return [
-        {
-          label: "商品信息",
-          name: "goodsManagement",
-          comp: goodsManagement,
-          detail: addGoods,
-          permission: "app_apppartyfee_config"
-        },
-        {
-          label: "店铺管理",
-          name: "storeManagement",
-          comp: storeManagement,
-          detail: '',
-          permission: "app_apppartyfee_statistics"
-        },
-      ]
+    components: {
+      GoodsList,
+      StoreList,
+      AddGoods,
+      AddStore
     },
-    ...mapState(['user']),
-    currDet() {
-      return this.tabs[Number(this.currIndex)].detail;
-    }
-  },
-  created() {
-    this.areaId = this.user.info.areaId;
-  },
-  data() {
-    return {
-      activeName: "orderManagement",
-      currIndex: 0,
-      areaId: '',
-      detailShow: false,
-      info: {}
-    }
-  },
-  methods: {
-    goBack() {
-      this.detailShow = false;
-      this.$nextTick(() => {
-        this.$refs[this.tabs[Number(this.currIndex)].name][0].getList();
-      })
+
+    props: {
+      instance: Function,
+      dict: Object,
+      permissions: Function
     },
-    showDetail(obj) {
-      this.info = {...obj};
-      this.detailShow = true;
+
+    computed: {
+      ...mapState(['user']),
+
+      tabs () {
+        const tabList = [
+          {label: '商品信息', name: 'GoodsList', comp: GoodsList, permission: ''},
+          {label: '店铺管理', name: 'StoreList', comp: StoreList, permission: ''}
+        ].filter(item => {
+          return true
+        })
+
+        return tabList
+      }
     },
-    changeArea() {
-      this.$nextTick(() => {
-        if (this.currIndex == 0) this.$refs[this.tabs[Number(this.currIndex)].name][0].getShopList();
-        if (this.currIndex == 1) this.$refs[this.tabs[Number(this.currIndex)].name][0].updateList();
-        this.$refs[this.tabs[Number(this.currIndex)].name][0].getList();
-      })
+
+    data () {
+      return {
+        activeName: 'GoodsList',
+        currIndex: '0',
+        componentName: '',
+        params: {},
+        areaName: '',
+        areaId: '',
+        isShowDetail: false
+      }
+    },
+
+    created () {
+      this.areaId = this.user.info.areaId
+    },
+
+    methods: {
+      onAreaChange () {
+        if (this.currIndex === '0') {
+          this.$nextTick(() => {
+            this.$refs[this.currIndex][0].getList()
+          })
+        }
+      },
+
+      onChange (data) {
+        if (data.type === 'GoodsList') {
+          this.componentName = 'GoodsList'
+          this.isShowDetail = false
+          this.params = data.params
+        }
+        if (data.type === 'StoreList') {
+          this.componentName = 'StoreList'
+          this.isShowDetail = false
+          this.params = data.params
+        }
+
+        if (data.type === 'AddGoods') {
+          this.componentName = 'AddGoods'
+          this.isShowDetail = true
+          this.params = data.params
+        }
+
+        if (data.type === 'AddStore') {
+          this.componentName = 'AddStore'
+          this.isShowDetail = true
+          this.params = data.params
+        }
+      }
     }
   }
-}
 </script>
+
 <style lang="scss" scoped>
-.AppScoreSupermarket {
-  width: 100%;
-  height: 100%;
-}
 </style>