Merge remote-tracking branch 'origin/dev_community_party_stas_zxc'

3 years ago · bc77c4ad3f
1 changed files with 359 additions and 0 deletions
--- a/src/views/modules/communityParty/stas/index.vue
+++ b/src/views/modules/communityParty/stas/index.vue
@ -0,0 +1,359 @@
+<template>
+  <div class="div_main">
+    <div class="div_search">
+      <el-form :inline="true"
+               :model="form"
+               ref="ref_searchform"
+               :label-width="'100px'">
+        <div>
+          <el-form-item prop="mySelectOrg" label-width="130px" label="参加活动党组织">
+            <el-cascader
+                    class="list_item_width_1"
+                    v-model="joinOrgIds"
+                    size="small"
+                    :options="orgList"
+                    placeholder="请选择党组织"
+                    :props="{
+                      checkStrictly: true,
+                      label: 'partyOrgName',
+                      value: 'id',
+                      children: 'children'
+                    }"
+                    @change="handleChangeOrg"
+                    clearable/>
+          </el-form-item>
+          <el-form-item label="活动开始时间"
+                        prop="serviceTimeArea">
+            <el-date-picker v-model="serviceTimeArea"
+                            clearable
+                            type="daterange"
+                            format="yyyy-MM-dd"
+                            value-format="yyyy-MM-dd"
+                            range-separator="至"
+                            start-placeholder="开始日期"
+                            end-placeholder="结束日期">
+            </el-date-picker>
+          </el-form-item>
+          <el-button style="margin-left:10px"
+                     class="diy-button--search"
+                     size="small"
+                     @click="handleSearch">查询</el-button>
+          <el-button style="margin-left:10px"
+                     class="diy-button--reset"
+                     size="small"
+                     @click="resetSearch">重置</el-button>
+        </div>
+      </el-form>
+    </div>
+    <div class="div_table">
+      <div class="div_btn">
+      <el-button style="margin-left:10px"
+                 class="diy-button--reset"
+                 size="small"
+                 @click="handleExport">导出</el-button>
+      </div>
+      <el-table class="table"
+                :data="tableData"
+                border
+                :height="tableHeight"
+                v-loading="tableLoading"
+                :header-cell-style="{background:'#2195FE',color:'#FFFFFF'}"
+                style="width: 100%">
+        <el-table-column label="序号"
+                         header-align="center"
+                         align="center"
+                         type="index"
+                         width="50"></el-table-column>
+
+        <el-table-column prop="joinOrgName"
+                         header-align="center"
+                         align="center"
+                         label="参加活动党组织"
+                         min-width="100">
+        </el-table-column>
+        <el-table-column prop="dydhNum"
+                         header-align="center"
+                         align="center"
+                         label="支部党员大会(次)"
+                         min-width="80">
+        </el-table-column>
+        <el-table-column prop="wyhNum"
+                         header-align="center"
+                         align="center"
+                         label="支部委员会(次)"
+                         show-overflow-tooltip
+                         max-width="100">
+        </el-table-column>
+        <el-table-column prop="dxzhNum"
+                         header-align="center"
+                         show-overflow-tooltip
+                         align="center"
+                         label="党小组会(次)"
+                         mix-width="80">
+        </el-table-column>
+        <el-table-column prop="dkNum"
+                         header-align="center"
+                         align="center"
+                         show-overflow-tooltip
+                         label="党课(次)"
+                         mix-width="80">
+        </el-table-column>
+        <el-table-column prop="ztdrNum"
+                         header-align="center"
+                         align="center"
+                         show-overflow-tooltip
+                         label="主题党日(次)"
+                         width="100">
+        </el-table-column>
+        <el-table-column prop="wmfwNum"
+                         header-align="center"
+                         align="center"
+                         show-overflow-tooltip
+                         label="为民服务活动(次)"
+                         width="130">
+        </el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+
+<script>
+import { requestPost } from "@/js/dai/request";
+import { mapGetters } from 'vuex'
+import { Loading } from 'element-ui' // 引入Loading服务
+
+let loading // 加载动画
+export default {
+  data () {
+    return {
+      form: {
+        joinOrgId: '',
+        joinOrgType: '',
+        startTime: '',
+        endTime: ''
+      },
+      tableData: [],
+      orgList: [],
+      serviceTimeArea: '',
+      partyOrg: {
+        partyOrgType: '',
+        id: ''
+      },
+      joinOrgIds: [],
+      tableLoading: false,
+      agencyId: ''
+    }
+  },
+  components: {
+
+  },
+  async created () {
+    await this.getOrgList()
+    await this.handleSearch()
+  },
+  async mounted () {
+    const { user } = this.$store.state
+    this.agencyId = user.agencyId
+
+  },
+
+  methods: {
+    handleSearch () {
+      this.loadTable()
+    },
+    handleChangeOrg () {
+      if (this.joinOrgIds.length > 0 && this.joinOrgIds) {
+        this.form.joinOrgId = this.joinOrgIds[this.joinOrgIds.length - 1]
+      } else {
+        this.form.joinOrgId = ''
+      }
+    },
+    getOrgList() {
+      return this.$http
+          .get('/resi/partymember/icPartyOrg/getSearchTreelist', {
+            params: { agencyId: localStorage.getItem('agencyId') }
+          })
+          .then(({ data: res }) => {
+            if (res.code !== 0) {
+              return this.$message.error(res.msg)
+            }else {
+              this.orgList = this.deepArrTOnull(res.data)
+            }
+          }).catch(() => {return this.$message.error("网络错误");})
+    },
+    deepArrTOnull(arr) {
+      let a = []
+      a = arr.map(item => {
+        return {
+          ...item,
+          children: (item.children.length > 0 && this.deepArrTOnull(item.children) )|| null
+        }
+      })
+      return a
+    },
+    async loadTable () {
+      this.tableLoading = true
+      if (Array.isArray(this.serviceTimeArea) && this.serviceTimeArea.length > 0) {
+        this.form.startTime = this.serviceTimeArea[0];
+        this.form.endTime = this.serviceTimeArea[1];
+      }else {
+        this.form.startTime = '';
+        this.form.endTime = '';
+      }
+
+      if (this.form.joinOrgId === '' || this.form.joinOrgId === null || this.form.joinOrgId === undefined){
+        let a = this.orgList[0]
+        this.form.joinOrgId = a.id;
+        this.joinOrgIds = this.form.joinOrgId
+      }else {
+        if (Array.isArray(this.joinOrgIds)){
+          this.form.joinOrgId = this.joinOrgIds[this.joinOrgIds.length - 1];
+        }
+      }
+      const url = "/resi/partymember/icPartyAct/patryactstatis"
+      // const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/patryactstatis"
+      let params = {
+        ...this.form
+      }
+      const { data, code, msg } = await requestPost(url, params)
+      if (code === 0) {
+        this.tableData = data
+      } else {
+        this.$message.error(msg)
+      }
+      this.tableLoading = false
+    },
+
+    //重置搜索条件
+    resetSearch () {
+      this.form = {
+        joinOrgId: '',
+        joinOrgType: '',
+        startTime: '',
+        endTime: ''
+      }
+      this.serviceTimeArea = ''
+      this.joinOrgIds = []
+      this.partyOrg = {
+        id: '',
+        partyOrgType: ''
+      }
+      this.loadTable()
+    },
+
+    //导出表格
+    async handleExport () {
+      let title = '党建数据统计'
+      const url = "/resi/partymember/icPartyAct/export"
+      // const url = "http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/export"
+      let params = {
+        ...this.form
+      }
+      app.ajax.exportFilePost(
+        url,
+        params,
+        (data, rspMsg) => {
+          this.download(data, title + '.xls')
+        },
+        (rspMsg, data) => {
+          this.$message.error(rspMsg);
+        }
+      );
+
+    },
+    // 下载文件
+    download (data, fileName) {
+      if (!data) {
+        return
+      }
+
+      var csvData = new Blob([data])
+
+      if (window.navigator && window.navigator.msSaveOrOpenBlob) {
+        window.navigator.msSaveOrOpenBlob(csvData, fileName);
+      }
+      // for Non-IE (chrome, firefox etc.)
+      else {
+        var a = document.createElement('a');
+        document.body.appendChild(a);
+        a.style = 'display: none';
+        var url = window.URL.createObjectURL(csvData);
+        a.href = url;
+        a.download = fileName;
+        a.click();
+        a.remove();
+        window.URL.revokeObjectURL(url);
+      }
+
+    },
+    // 开启加载动画
+    startLoading () {
+      loading = Loading.service({
+        lock: true, // 是否锁定
+        text: '正在加载……', // 加载中需要显示的文字
+        background: 'rgba(0,0,0,.7)' // 背景颜色
+      })
+    },
+    // 结束加载动画
+    endLoading () {
+      if (loading) {
+        loading.close()
+      }
+    }
+  },
+  computed: {
+    tableHeight () {
+      return this.$store.state.inIframe ? this.clientHeight - 350 + this.iframeHeight : this.clientHeight - 350
+    },
+
+    ...mapGetters(['clientHeight', 'iframeHeight'])
+  },
+  watch: {
+
+  },
+  props: {
+
+  }
+}
+</script>
+<style lang="scss" scoped >
+@import "@/assets/scss/buttonstyle.scss";
+@import "@/assets/scss/modules/management/list-main.scss";
+.div_main {
+  width: 100%;
+}
+
+.div_search {
+  background: #ffffff;
+  border-radius: 4px;
+  padding: 30px 20px 5px;
+  box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
+}
+
+.item_width_1 {
+  width: 260px;
+}
+.item_width_2 {
+  width: 620px;
+}
+
+.div_table {
+  background: #ffffff;
+  box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
+  border-radius: 4px;
+  margin-top: 15px;
+  // padding: 23px 30px 10px;
+
+  .table {
+    margin-top: 20px;
+  }
+}
+
+.el-row {
+  /* margin-bottom: 20px; */
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 10px;
+  margin-right: 50px;
+}
+</style>