特制化,使标题跟随菜单目录变化

2022-08-18 17:27:50 +08:00
parent 3b7ee0c6cc
commit 35e612d35c
6 changed files with 295 additions and 290 deletions
--- a/packages/publicity/AppVillageIntroduction/AppVillageIntroduction.vue
+++ b/packages/publicity/AppVillageIntroduction/AppVillageIntroduction.vue
@@ -1,44 +1,42 @@
 <template>
  <div class="doc-circulation ailist-wrapper">
    <keep-alive :include="['List']">
-      <component ref="component" :is="component" @change="onChange" :params="params" :instance="instance" :dict="dict"></component>
+      <component ref="component" :is="component" @change="onChange" :params="params" v-bind="$props"/>
    </keep-alive>
  </div>
 </template>

 <script>
-  import List from './components/List'
-  import Add from './components/Add'
-  import Detail from './components/Detail'
+import List from './components/List'
+import Add from './components/Add'
+import Detail from './components/Detail'

-  export default {
+export default {
  name: 'AppVillageIntroduction',
  label: '本村简介',
-
  props: {
    instance: Function,
-      dict: Object
+    dict: Object,
+    menuName: {default: "本村简介"}
  },
-
-    data () {
+  data() {
    return {
      component: 'List',
      params: {},
      include: []
    }
  },
-
  components: {
    Add,
    List,
    Detail
  },

-    mounted () {
+  mounted() {
  },

  methods: {
-      onChange (data) {
+    onChange(data) {
      if (data.type === 'Add') {
        this.component = 'Add'
        this.params = data.params
@@ -61,13 +59,13 @@
      }
    }
  }
-  }
+}
 </script>

 <style lang="scss">
-  .doc-circulation {
+.doc-circulation {
  height: 100%;
  background: #F3F6F9;
  overflow: auto;
-  }
+}
 </style>
--- a/packages/publicity/AppVillageIntroduction/components/Add.vue
+++ b/packages/publicity/AppVillageIntroduction/components/Add.vue
@@ -1,7 +1,7 @@
 <template>
  <ai-detail>
    <template slot="title">
-      <ai-title :title="params.id ? '编辑本村简介' : '添加本村简介'" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
+      <ai-title :title="pageTitle" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
      </ai-title>
    </template>
    <template slot="content">
@@ -43,17 +43,19 @@
 </template>

 <script>
-  import { mapState } from 'vuex'
-  export default {
+import {mapState} from 'vuex'
+
+export default {
  name: 'Add',

  props: {
    instance: Function,
    dict: Object,
-      params: Object
+    params: Object,
+    menuName: String
  },

-    data () {
+  data() {
    return {
      info: {},
      form: {
@@ -74,10 +76,10 @@
  },

  computed: {
-      ...mapState(['user'])
+    ...mapState(['user']),
+    pageTitle: v => `${!!v.params.id ? '编辑' : '添加'}${v.menuName}`
  },
-
-    created () {
+  created() {
    this.form.areaId = this.user.info.areaId
    this.disabledLevel = this.user.info.areaList.length
    if (this.params && this.params.id) {
@@ -87,7 +89,7 @@
  },

  methods: {
-      getInfo (id) {
+    getInfo(id) {
      this.instance.post(`/app/appcountrysidetourism/queryDetailById?id=${id}`).then(res => {
        if (res.code === 0) {
          this.form = res.data
@@ -96,7 +98,7 @@
      })
    },

-      confirm () {
+    confirm() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.instance.post(`/app/appcountrysidetourism/addOrUpdate`, {
@@ -118,14 +120,14 @@
      })
    },

-      cancel (isRefresh) {
+    cancel(isRefresh) {
      this.$emit('change', {
        type: 'list',
        isRefresh: !!isRefresh
      })
    }
  }
-  }
+}
 </script>

 <style scoped lang="scss">
--- a/packages/publicity/AppVillageIntroduction/components/List.vue
+++ b/packages/publicity/AppVillageIntroduction/components/List.vue
@@ -1,7 +1,7 @@
 <template>
  <ai-list class="notice">
    <template slot="title">
-      <ai-title title="本村简介" isShowBottomBorder isShowArea v-model="search.areaId" :instance="instance" @change="search.current = 1, getList()"></ai-title>
+      <ai-title :title="menuName" isShowBottomBorder isShowArea v-model="search.areaId" :instance="instance" @change="search.current = 1, getList()"></ai-title>
    </template>
    <template slot="content">
      <ai-search-bar class="search-bar">
@@ -57,9 +57,9 @@

    props: {
      instance: Function,
-      dict: Object
+      dict: Object,
+      menuName:String
    },
-
    data() {
      return {
        search: {
--- a/packages/publicity/AppVillageRegulations/AppVillageRegulations.vue
+++ b/packages/publicity/AppVillageRegulations/AppVillageRegulations.vue
@@ -1,26 +1,27 @@
 <template>
  <div class="doc-circulation ailist-wrapper">
    <keep-alive :include="['List']">
-      <component ref="component" :is="component" @change="onChange" :params="params" :instance="instance" :dict="dict"></component>
+      <component ref="component" :is="component" @change="onChange" :params="params" v-bind="$props"/>
    </keep-alive>
  </div>
 </template>

 <script>
-  import List from './components/List'
-  import Add from './components/Add'
-  import Detail from './components/Detail'
+import List from './components/List'
+import Add from './components/Add'
+import Detail from './components/Detail'

-  export default {
+export default {
  name: 'AppVillageRegulations',
  label: '村规民约',

  props: {
    instance: Function,
-      dict: Object
+    dict: Object,
+    menuName: {default: "村规民约"}
  },

-    data () {
+  data() {
    return {
      component: 'List',
      params: {},
@@ -34,11 +35,11 @@
    Detail
  },

-    mounted () {
+  mounted() {
  },

  methods: {
-      onChange (data) {
+    onChange(data) {
      if (data.type === 'Add') {
        this.component = 'Add'
        this.params = data.params
@@ -61,13 +62,13 @@
      }
    }
  }
-  }
+}
 </script>

 <style lang="scss">
-  .doc-circulation {
+.doc-circulation {
  height: 100%;
  background: #F3F6F9;
  overflow: auto;
-  }
+}
 </style>
--- a/packages/publicity/AppVillageRegulations/components/Add.vue
+++ b/packages/publicity/AppVillageRegulations/components/Add.vue
@@ -1,7 +1,7 @@
 <template>
  <ai-detail>
    <template slot="title">
-      <ai-title :title="params.id ? '编辑村规民约' : '添加村规民约'" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
+      <ai-title :title="pageTitle" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
      </ai-title>
    </template>
    <template slot="content">
@@ -50,7 +50,8 @@
    props: {
      instance: Function,
      dict: Object,
-      params: Object
+      params: Object,
+      menuName: String
    },

    data () {
@@ -74,7 +75,8 @@
    },

    computed: {
-      ...mapState(['user'])
+      ...mapState(['user']),
+      pageTitle: v => `${!!v.params.id ? '编辑' : '添加'}${v.menuName}`
    },

    created () {
--- a/packages/publicity/AppVillageRegulations/components/List.vue
+++ b/packages/publicity/AppVillageRegulations/components/List.vue
@@ -1,7 +1,7 @@
 <template>
  <ai-list class="notice">
    <template slot="title">
-      <ai-title title="村规民约" isShowBottomBorder isShowArea v-model="search.areaId" :instance="instance" @change="search.current = 1, getList()"></ai-title>
+      <ai-title :title="menuName" isShowBottomBorder isShowArea v-model="search.areaId" :instance="instance" @change="search.current = 1, getList()"></ai-title>
    </template>
    <template slot="content">
      <ai-search-bar class="search-bar">
@@ -51,13 +51,15 @@
 </template>

 <script>
-  import { mapState } from 'vuex'
-  export default {
+import {mapState} from 'vuex'
+
+export default {
  name: 'List',

  props: {
    instance: Function,
-      dict: Object
+    dict: Object,
+    menuName: String
  },

  data() {
@@ -72,12 +74,12 @@
      areaList: [],
      total: 10,
      colConfigs: [
-          { prop: 'title',  label: '标题', align: 'left', width: '200px' },
-          { prop: 'areaName', label: '地区', align: 'center' },
-          { prop: 'status', label: '发布状态', align: 'center', formart: v => v === '1' ? '已发布' : '未发布' },
-          { prop: 'createUserName', label: '发布人', align: 'center' },
-          { prop: 'createDate', label: '发布时间', align: 'center' },
-          { slot: 'options', label: '操作', align: 'center' }
+        {prop: 'title', label: '标题', align: 'left', width: '200px'},
+        {prop: 'areaName', label: '地区', align: 'center'},
+        {prop: 'status', label: '发布状态', align: 'center', formart: v => v === '1' ? '已发布' : '未发布'},
+        {prop: 'createUserName', label: '发布人', align: 'center'},
+        {prop: 'createDate', label: '发布时间', align: 'center'},
+        {slot: 'options', label: '操作', align: 'center'}
      ],
      areaName: '',
      unitName: '',
@@ -109,7 +111,7 @@
      })
    },

-      changeStatus (item) {
+    changeStatus(item) {
      let title = item.status == '1' ? '是否要取消发布?' : '是否要发布?';
      this.$confirm(title, {type: 'warning'}).then(() => {
        item.status = item.status == '1' ? '0' : '1'
@@ -142,10 +144,10 @@
      })
    }
  }
-  }
+}
 </script>

 <style lang="scss" scoped>
-  .notice {
-  }
+.notice {
+}
 </style>