组织换届

project/pingchang/apps/AppOrganizationChange/components/List.vue

@@ -0,0 +1,205 @@
+<template>
+  <ai-list class="List">
+    <template slot="title">
+      <ai-title title="组织换届" isShowBottomBorder/>
+    </template>
+    <template #left>
+      <ai-tree-menu title="组织目录" searchPlaceholder="请输入组织名称" @search="onSearch">
+        <ai-party-tree
+            :filter-node-method="filterNode"
+            ref="tree"
+            :instance="instance"
+            :root="user.info.organizationId"
+            :current-node-key="selected.id"
+            @select="onTreeChange"/>
+      </ai-tree-menu>
+    </template>
+    <template slot="content">
+      <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" lazy :instance="instance"
+                       :dict="dict" :permissions="permissions" v-on="$listeners"/>
+          </el-tab-pane>
+        </el-tabs>
+    </template>
+  </ai-list>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+import moment from './moment.vue'
+import history from './history.vue'
+
+
+export default {
+  name: 'List',
+  props: {
+    instance: Function,
+    permissions: Function,
+    dict: Object,
+    selected: Object
+  },
+  data() {
+    return {
+      search: {
+        current: 1,
+        size: 10,
+        con: '',
+        age: [],
+        sex: '',
+        nation: '',
+        partyStatus: '',
+        flowStatus: '',
+        education: '',
+        partyPosition: '',
+        birthStart: '',
+        birthEnd: '',
+        turnPositiveStart: '',
+        turnPositiveEnd: '',
+        joinPartyStart: '',
+        joinPartyEnd: ''
+      },
+      orgName: '',
+      loading: false,
+      total: 0,
+      colConfigs: [
+        {type: 'selection', label: ''},
+        {prop: 'name', label: '姓名', align: 'center'},
+        {prop: 'sex', label: '性别', align: 'center', dict: 'sex'},
+        {prop: 'age', label: '年龄', align: 'center'},
+        // {
+        //   prop: 'auditStatus', label: '审核状态', align: 'center',
+        //   render: (h, {row}) => h('span', {class: `audit-${row.auditStatus}`}, this.dict.getLabel('auditStatus', row.auditStatus))
+        // },
+        {prop: 'partyStatus', label: '党籍状态', align: 'center', dict: 'partyStatus'},
+        {prop: 'joinPartyTime', label: '入党日期', align: 'center'},
+        {prop: 'partyPosition', label: '党内职务', align: 'center', dict: 'partyPosition'},
+        {prop: 'flowStatus', label: '流动状态', align: 'center', dict: 'flowStatus'},
+      ],
+      tableData: [],
+      ids: '',
+      tabs: [
+        {label: '当前届次', name: 'moment', comp: moment, permission: ''},
+        {label: '历史届次', name: 'history', comp: history, permission: 'app_appgirdmemberapply_detail'}
+      ],
+      currIndex: 0
+    }
+  },
+  components: {
+    moment,
+    history
+  },
+  computed: {
+    ...mapState(['user']),
+    orgTree() {
+      return this.$refs.tree?.$refs?.partyTree
+    },
+    exportQuery() {
+      let {id: partyOrgId} = this.selected
+      return {
+        ids: this.ids ? this.ids.split(',') : [],
+        ...this.search, partyOrgId
+      }
+    },
+    isShowAddBtn() {
+      return this.selected.isLeaf == 1
+    }
+  },
+  created() {
+    this.dict.load('disciplinary', 'partyType', 'sex', 'nation', 'education', 'partyStatus', 'partyPosition', 'flowStatus', 'auditStatus')
+    this.getList()
+  },
+  methods: {
+    showNeighbourSetting(id) {
+      this.$router.push({query: {id}, hash: "#ns"})
+    },
+    onTreeChange(e) {
+      this.$emit("update:selected", e)
+      this.getList(e.id)
+    },
+
+    onSearch(v) {
+      this.orgTree.filter(v)
+    },
+
+    getList(partyOrgId) {
+      if (!this.user.info.organizationId) return
+
+      this.loading = true
+      partyOrgId = partyOrgId || this.selected.id
+      this.instance.post(`/app/appparty/list`, null, {
+        params: {partyOrgId, ...this.search, age: this.search.age?.join(',')}
+      }).then(res => {
+        this.loading = false
+        if (res?.data) {
+          this.tableData = res.data.records
+          this.total = res.data.total
+        }
+      }).catch(() => {
+        this.loading = false
+      })
+    },
+    removeAll() {
+      if (!this.ids) {
+        return this.$message.error('请选择党员')
+      }
+      this.remove(this.ids)
+    },
+    handleSelectionChange(e) {
+      this.ids = e.map(v => v.id).join(',')
+    },
+    filterNode(value, data) {
+      if (!value) return true
+      return data.name.indexOf(value) !== -1
+    },
+    remove(id) {
+      this.$confirm('确定删除该数据？').then(() => {
+        this.instance.post(`/app/appparty/delete?ids=${id}`).then(res => {
+          if (res.code == 0) {
+            this.$message.success('删除成功！')
+            this.getList()
+          }
+        })
+      })
+    },
+    toDetail(id) {
+      this.$router.push({query: {id}})
+    },
+    toAdd(id) {
+      this.$router.push({query: {id}, hash: "#add"})
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.List {
+  .party-table__btns {
+    display: flex;
+    align-items: center;
+  }
+
+  ::v-deep .audit-0 {
+    color: #FF8822 !important;
+  }
+
+  ::v-deep .audit-1 {
+    color: #2EA222 !important;
+  }
+
+  ::v-deep .ai-list__content--right {
+    flex: 1;
+    min-width: 0;
+    margin-left: 1px;
+    box-shadow: none;
+
+    .ai-list__content--right-wrapper {
+      width: 100%;
+    }
+  }
+  ::v-deep .is-current>.el-tree-node__content{
+    width: 100%!important;
+    padding-right: 16px!important;
+  }
+}
+</style>