From edf03dbb5d4f92835599ad8d6e9eb97d6cdda3a6 Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Mon, 14 Mar 2022 12:21:24 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=9D=91=E5=8A=A1=E5=85=AC?=
 =?UTF-8?q?=E5=BC=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 project/oms/apps/AppArticles/AppArticles.vue  |  33 ++
 .../oms/apps/AppArticles/components/Add.vue   |  15 +-
 .../apps/AppArticles/components/Detail.vue    |  88 ++--
 .../oms/apps/AppArticles/components/Event.vue | 407 +++++++++---------
 4 files changed, 274 insertions(+), 269 deletions(-)
 create mode 100644 project/oms/apps/AppArticles/AppArticles.vue

diff --git a/project/oms/apps/AppArticles/AppArticles.vue b/project/oms/apps/AppArticles/AppArticles.vue
new file mode 100644
index 00000000..8e8fbb2a
--- /dev/null
+++ b/project/oms/apps/AppArticles/AppArticles.vue
@@ -0,0 +1,33 @@
+<template>
+  <section class="AppArticles">
+    <component :is="currentComponent" :instance="instance" :dict="dict" :permissions="permissions"/>
+  </section>
+</template>
+
+<script>
+import Add from "./components/Add";
+import Detail from "./components/Detail";
+import Event from "./components/Event";
+
+export default {
+  name: "AppArticles",
+  label: "村务公开(运营版)",
+  components: {Event, Detail, Add},
+  props: {
+    instance: Function,
+    dict: Object,
+    permissions: Function
+  },
+  computed: {
+    currentComponent() {
+      return this.$route.hash == "#add" ? Add :
+          !!this.$route.query?.id ? Detail : Event
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AppArticles {
+}
+</style>
diff --git a/project/oms/apps/AppArticles/components/Add.vue b/project/oms/apps/AppArticles/components/Add.vue
index 3e2ebafb..d9f9c3bc 100644
--- a/project/oms/apps/AppArticles/components/Add.vue
+++ b/project/oms/apps/AppArticles/components/Add.vue
@@ -54,7 +54,6 @@ export default {
 
   props: {
     dict: Object,
-    params: Object,
     instance: Function,
     areaId: String
   },
@@ -78,7 +77,10 @@ export default {
   },
 
   computed: {
-    ...mapState(['user'])
+    ...mapState(['user']),
+    params() {
+      return this.$route.query
+    }
   },
 
   created() {
@@ -89,7 +91,7 @@ export default {
 
   methods: {
     onBack() {
-      this.cancel()
+      this.$router.push({})
     },
 
     getInfo() {
@@ -124,13 +126,6 @@ export default {
         }
       })
     },
-
-    cancel(isRefresh) {
-      this.$emit('change', {
-        type: 'list',
-        isRefresh: !!isRefresh
-      })
-    }
   }
 }
 </script>
diff --git a/project/oms/apps/AppArticles/components/Detail.vue b/project/oms/apps/AppArticles/components/Detail.vue
index c1e445db..a1a550bf 100644
--- a/project/oms/apps/AppArticles/components/Detail.vue
+++ b/project/oms/apps/AppArticles/components/Detail.vue
@@ -20,58 +20,58 @@
 </template>
 
 <script>
-  export default {
-    name: 'detail',
+export default {
+  name: 'detail',
+  props: {
+    instance: Function,
+    dict: Object,
+    permissions: Function,
+  },
 
-    props: {
-      instance: Function,
-      dict: Object,
-      permissions: Function,
-      params: Object
-    },
+  data() {
+    return {
+      info: {}
+    }
+  },
+  computed: {
+    params() {
+      return this.$route.query
+    }
+  },
+  mounted() {
+    this.getInfo()
+  },
 
-    data () {
-      return {
-        info: {}
-      }
-    },
-
-    mounted () {
-      this.getInfo()
-    },
-
-    methods: {
-      getInfo () {
-        this.instance.post(`/appvillageinfo/queryDetailById?id=${this.params.id}`).then(res => {
-          if (res.code === 0) {
-            this.info = res.data
-            if (res.data.thumbUrl) {
-              this.info.thumbUrl = JSON.parse(res.data.thumbUrl)
-            }
+  methods: {
+    getInfo() {
+      this.instance.post(`/appvillageinfo/queryDetailById?id=${this.params.id}`).then(res => {
+        if (res?.data) {
+          this.info = res.data
+          if (res.data.thumbUrl) {
+            this.info.thumbUrl = JSON.parse(res.data.thumbUrl)
           }
-        })
-      },
+        }
+      })
+    },
 
-      onBack () {
-        this.$emit('change', {
-          type: 'list'
-        })
-      }
+    onBack() {
+      this.$router.push({})
     }
   }
+}
 </script>
 
 <style scoped lang="scss">
-  .cover {
-    display: block;
-    width: 300px;
-    height: 140px;
-    margin: 20px auto;
-  }
+.cover {
+  display: block;
+  width: 300px;
+  height: 140px;
+  margin: 20px auto;
+}
 
-  .subTitle {
-    text-align: center;
-    font-size: 12px;
-    font-weight: normal;
-  }
+.subTitle {
+  text-align: center;
+  font-size: 12px;
+  font-weight: normal;
+}
 </style>
diff --git a/project/oms/apps/AppArticles/components/Event.vue b/project/oms/apps/AppArticles/components/Event.vue
index bce67543..bde7c754 100644
--- a/project/oms/apps/AppArticles/components/Event.vue
+++ b/project/oms/apps/AppArticles/components/Event.vue
@@ -1,56 +1,56 @@
 <template>
   <section class="event">
     <ai-list>
-      <ai-title  slot="title" title="村务公开" isShowBottomBorder></ai-title>
+      <ai-title slot="title" title="村务公开" isShowBottomBorder></ai-title>
       <template slot="content">
         <ai-search-bar>
           <template slot="left">
-            <el-button icon="iconfont iconAdd" type="primary" size="small" @click="add">添加</el-button>
+            <el-button icon="iconfont iconAdd" type="primary" size="small" @click="toAdd">添加</el-button>
           </template>
           <template slot="right">
             <el-input
-              placeholder="请输入标题"
-              size="small"
-              clearable
-              v-model="search.title"
-              @keyup.enter.native="search.current = 1, getList()"
-              @clear="search.current = 1, search.title = '', getList()"
-              suffix-icon="iconfont iconSearch" />
+                placeholder="请输入标题"
+                size="small"
+                clearable
+                v-model="search.title"
+                @keyup.enter.native="search.current = 1, getList()"
+                @clear="search.current = 1, search.title = '', getList()"
+                suffix-icon="iconfont iconSearch"/>
           </template>
         </ai-search-bar>
         <div class="ai-table">
           <ai-table
-            :tableData="tableData"
-            :col-configs="colConfigs"
-            :total="total"
-            :current.sync="search.current"
-            :size.sync="search.size"
-            @getList="getList">
+              :tableData="tableData"
+              :col-configs="colConfigs"
+              :total="total"
+              :current.sync="search.current"
+              :size.sync="search.size"
+              @getList="getList">
             <el-table-column slot="options" label="操作" align="center" width="250" fixed="right">
               <template slot-scope="{ row }" class="fs-14">
                 <div class="table-options">
                   <el-button
-                    type="text"
-                    @click="publish(row)"
-                    title="发布">
-                     发布
+                      type="text"
+                      @click="publish(row)"
+                      title="发布">
+                    发布
                   </el-button>
                   <el-button
-                    type="text"
-                    title="详情"
-                    @click="toDetail(row.id)">
+                      type="text"
+                      title="详情"
+                      @click="toDetail(row.id)">
                     详情
                   </el-button>
                   <el-button
-                    type="text"
-                    title="编辑"
-                    @click="toAdd(row.id)">
+                      type="text"
+                      title="编辑"
+                      @click="toEdit(row.id)">
                     编辑
                   </el-button>
                   <el-button
-                    @click="remove(row.id)"
-                    type="text"
-                    title="删除">
+                      @click="remove(row.id)"
+                      type="text"
+                      title="删除">
                     删除
                   </el-button>
                 </div>
@@ -60,30 +60,31 @@
         </div>
       </template>
     </ai-list>
-    <ai-dialog title="请选择发布平台企业" :visible.sync="dialog" width="600px"  @onConfirm="saveSaas">
+    <ai-dialog title="请选择发布平台企业" :visible.sync="dialog" width="600px" @onConfirm="saveSaas">
       <el-form ref="saasForm" :model="dialogForm" size="small" label-width="120px">
         <el-form-item required label="saas平台" prop="saasId" :rules="[{required: true, message: '请选择saas平台'}]">
           <el-select v-model="dialogForm.saasId" placeholder="请选择saas平台" style="width:100%;" @change="getCompanyList">
             <el-option
-              v-for="item in saasList"
-              :key="item.value"
-              :label="item.name"
-              :value="item.id">
+                v-for="item in saasList"
+                :key="item.value"
+                :label="item.name"
+                :value="item.id">
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item required label="saas企业" prop="corpId" :rules="[{required: true, message: '请选择saas企业'}]">
           <el-select v-model="dialogForm.corpId" placeholder="请选择saas企业" style="width:100%;" @change="selectCompany">
             <el-option
-              v-for="item in companyList"
-              :key="item.value"
-              :label="item.name"
-              :value="item.id">
+                v-for="item in companyList"
+                :key="item.value"
+                :label="item.name"
+                :value="item.id">
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item required label="地区" prop="areaId" :rules="[{required: true, message: '请选择发布地区'}]">
-          <ai-area-get :instance="instance" v-model="dialogForm.areaId" :root="rootId" :name.sync="dialogForm.areaName" />
+          <ai-area-get :instance="instance" v-model="dialogForm.areaId" :root="rootId"
+                       :name.sync="dialogForm.areaName"/>
         </el-form-item>
       </el-form>
     </ai-dialog>
@@ -91,202 +92,178 @@
 </template>
 
 <script>
-  import { mapState } from 'vuex'
+import {mapState} from 'vuex'
 
-  export default {
-    name: 'event',
+export default {
+  name: 'event',
 
-    props: {
-      instance: Function,
-      dict: Object,
-    },
+  props: {
+    instance: Function,
+    dict: Object,
+  },
 
-    computed: {
-      ...mapState(['user']),
-      colConfigs() {
-        return [
-          { prop: 'type', label: '类型', formart: v => this.dict.getLabel('villInfoType', v) },
-          { prop: 'title', label: '标题', align: 'left' },
-          { prop: 'createDate', label: '创建时间', dateFormart: 'YYYY-MM-DD', align: 'center' },
-          { prop: 'createUser', label: '发布人', align: 'center' },
-          { slot: 'options', label: '操作' }
-        ]
-      }
-    },
+  computed: {
+    ...mapState(['user']),
+    colConfigs() {
+      return [
+        {prop: 'type', label: '类型', formart: v => this.dict.getLabel('villInfoType', v)},
+        {prop: 'title', label: '标题', align: 'left'},
+        {prop: 'createDate', label: '创建时间', dateFormart: 'YYYY-MM-DD', align: 'center'},
+        {prop: 'createUser', label: '发布人', align: 'center'},
+        {slot: 'options', label: '操作'}
+      ]
+    }
+  },
 
-    data () {
-      return {
-        search: {
-          current: 1,
-          size: 10,
-          title: ''
-        },
-        total: 0,
-        ids: [],
-        tableData: [],
-        dialog: false,
-        dialogForm: {},
-        saasList: [],
-        companyList: [],
-        rootId: ''
-      }
-    },
-    mounted () {
-      this.dict.load('villInfoType').then(() => {
-        this.getList()
-        this.getsaasList()
+  data() {
+    return {
+      search: {
+        current: 1,
+        size: 10,
+        title: ''
+      },
+      total: 0,
+      ids: [],
+      tableData: [],
+      dialog: false,
+      dialogForm: {},
+      saasList: [],
+      companyList: [],
+      rootId: ''
+    }
+  },
+  mounted() {
+    this.dict.load('villInfoType').then(() => {
+      this.getList()
+      this.getsaasList()
+    })
+  },
+
+  methods: {
+    getsaasList() {
+      this.instance.post("/appSaas/page", null, {
+        params: {size: 10000}
+      }).then(res => {
+        if (res?.data) {
+          this.saasList = res.data?.records
+        }
       })
     },
 
-    methods: {
-      getsaasList() {
-        this.instance.post("/appSaas/page", null, {
-          params: {size: 10000}
-        }).then(res => {
-          if (res?.data) {
-            this.saasList = res.data?.records
+    getCompanyList() {
+      this.instance.post("/appCorp/page", null, {
+        params: {saasId: this.dialogForm.saasId, size: 10000}
+      }).then(res => {
+        if (res?.data) {
+          this.companyList = res.data.records
+          this.rootId = ''
+          this.dialogForm.areaId = ''
+          this.corpId = ''
+        }
+      })
+    },
+
+    selectCompany() {
+      this.companyList.map(item => {
+        if (item.id == this.dialogForm.corpId) {
+          this.rootId = item.areaId
+          this.dialogForm.areaId = item.areaId
+        }
+      })
+    },
+
+    getList() {
+      this.instance.post(`/appvillageinfo/list`, null, {
+        params: {
+          ...this.search,
+          areaId: this.areaId
+        }
+      }).then(res => {
+        if (res.data) {
+          this.tableData = res.data.records
+          this.total = res.data.total
+        }
+      })
+    },
+
+    publish(params) {
+      this.dialogForm.id = params.id
+      this.dialog = true
+    },
+
+    toAdd() {
+      this.$router.push({hash: "#add"})
+    },
+    toEdit(id) {
+      this.$router.push({hash: "#add", query: {id}})
+    },
+
+    toDetail(id) {
+      this.$router.push({query: {id}})
+    },
+
+    remove(id) {
+      this.$confirm('确定删除该数据？').then(() => {
+        this.instance.post(`/app/appvillageinfo/delete?ids=${id}`).then(res => {
+          if (res.code == 0) {
+            this.$message.success('删除成功！')
+            this.getList()
           }
         })
-      },
+      })
+    },
 
-      getCompanyList() {
-        this.instance.post("/appCorp/page", null, {
-          params: {saasId:this.dialogForm.saasId, size: 10000}
-        }).then(res => {
-          if (res?.data) {
-            this.companyList = res.data.records
-            this.rootId = ''
-            this.dialogForm.areaId = ''
-            this.corpId = ''
-          }
-        })
-      },
-
-      selectCompany() {
-        this.companyList.map(item => {
-          if(item.id == this.dialogForm.corpId) {
-            this.rootId = item.areaId
-            this.dialogForm.areaId = item.areaId
-          }
-        })
-      },
-
-      getList () {
-        this.instance.post(`/appvillageinfo/list`, null, {
-          params: {
-            ...this.search,
-            areaId: this.areaId
-          }
-        }).then(res => {
-          if (res.data) {
-            this.tableData = res.data.records
-            this.total = res.data.total
-          }
-        })
-      },
-
-      publish (params) {
-        this.dialogForm.id = params.id
-        this.dialog = true
-      },
-
-      toAdd (id) {
-        this.$emit('change', {
-          type: 'add',
-          params: {
-            id
-          }
-        })
-      },
-
-      add () {
-        this.$emit('change', {
-          type: 'add',
-          params: {
-            id: ''
-          }
-        })
-      },
-
-      toEdit (id) {
-        this.$emit('change', {
-          type: 'add',
-          params: {
-            type: 'ReportAdd',
-            id
-          }
-        })
-      },
-
-      toDetail (id) {
-        this.$emit('change', {
-          type: 'detail',
-          params: {
-            type: 'eventDetail',
-            id
-          }
-        })
-      },
-
-      remove (id) {
-        this.$confirm('确定删除该数据？').then(() => {
-          this.instance.post(`/app/appvillageinfo/delete?ids=${id}`).then(res => {
-            if (res.code == 0) {
-              this.$message.success('删除成功！')
-              this.getList()
+    saveSaas() {
+      this.$refs.saasForm.validate(v => {
+        if (v) {
+          this.instance.post(`/appvillageinfo/sync?corpId=${this.dialogForm.corpId}&id=${this.dialogForm.id}&areaId=${this.dialogForm.areaId}`).then(res => {
+            if (res?.code == 0) {
+              this.dialog = false;
+              this.$message.success("发布成功")
+              this.dialogForm = {}
+            } else {
+              this.$message.error(res?.msg)
             }
           })
-        })
-      },
-
-      saveSaas() {
-        this.$refs.saasForm.validate(v => {
-          if (v) {
-            this.instance.post(`/appvillageinfo/sync?corpId=${this.dialogForm.corpId}&id=${this.dialogForm.id}&areaId=${this.dialogForm.areaId}`).then(res => {
-              if (res?.code == 0) {
-                this.dialog = false;
-                this.$message.success("发布成功")
-                this.dialogForm = {}
-              } else {
-                this.$message.error(res?.msg)
-              }
-            })
-          }
-        })
-      },
-    }
+        }
+      })
+    },
   }
+}
 </script>
 
 <style lang="scss" scoped>
-  .event {
-    height: 100%;
-    ::v-deep th {
-      font-weight: bold!important;
-    }
-    ::v-deep .table-options{
-      span{
-        font-size: 14px!important;
-      }
+.event {
+  height: 100%;
+
+  ::v-deep th {
+    font-weight: bold !important;
+  }
+
+  ::v-deep .table-options {
+    span {
+      font-size: 14px !important;
     }
   }
-  .table-btn {
-    margin-right: 16px;
-    font-size: 14px;
-    color: #2266FF;
-    cursor: pointer;
+}
 
-    &:hover {
-      opacity: 0.6;
-    }
+.table-btn {
+  margin-right: 16px;
+  font-size: 14px;
+  color: #2266FF;
+  cursor: pointer;
 
-    &:last-child {
-      margin-right: 0;
-    }
-
-    &:last-child:hover {
-      color: #f46;
-      opacity: 1;
-    }
+  &:hover {
+    opacity: 0.6;
   }
+
+  &:last-child {
+    margin-right: 0;
+  }
+
+  &:last-child:hover {
+    color: #f46;
+    opacity: 1;
+  }
+}
 </style>