Blame view

src/components/scm/integralRuleDiv.vue 2.75 KB
f52d2b06   wuxw   积分功能开发中
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
  <template>
    <div>
  
    <el-card class="box-card">
      <div slot="header" class="flex justify-between">
        <el-button-group>
          <el-button size="small" @click="openAddModal">{{ $t('common.add') }}</el-button>
          <el-button size="small" @click="openEditModal">{{ $t('common.edit') }}</el-button>
          <el-button size="small" @click="openDeleteModal">{{ $t('common.delete') }}</el-button>
        </el-button-group>
      </div>
      <el-tree
        :data="integralRules"
        :props="defaultProps"
        node-key="ruleId"
        highlight-current
        @node-click="handleNodeClick"
      ></el-tree>
    </el-card>
    <add-integral-rule ref="addIntegralRule" @success="handleSuccess" />
      <edit-integral-rule ref="editIntegralRule" @success="handleSuccess" />
      <delete-integral-rule ref="deleteIntegralRule" @success="handleSuccess" />
    </div>
  </template>
  
  <script>
  import { listIntegralRule } from '@/api/scm/integralRuleApi'
  import { getCommunityId } from '@/api/community/communityApi'
  import AddIntegralRule from '@/components/scm/addIntegralRule'
  import EditIntegralRule from '@/components/scm/editIntegralRule'
  import DeleteIntegralRule from '@/components/scm/deleteIntegralRule'
  export default {
    name: 'IntegralRuleDiv',
    data() {
      return {
        integralRules: [],
        curIntegralRule: {},
        defaultProps: {
          children: 'children',
          label: 'ruleName'
        }
      }
    },
    components: {
      AddIntegralRule,
      EditIntegralRule,
      DeleteIntegralRule
    },
    created() {
      this.communityId = getCommunityId()
      this.refreshList()
    },
    methods: {
      async refreshList() {
        try {
          const params = {
            page: 1,
            row: 100,
            communityId: this.communityId
          }
          const { data } = await listIntegralRule(params)
          this.integralRules = data
          if (this.integralRules.length > 0) {
            this.handleNodeClick(this.integralRules[0])
          }
        } catch (error) {
          this.$message.error(this.$t('integralRule.fetchError'))
        }
      },
      handleNodeClick(data) {
        this.curIntegralRule = data
        this.$emit('switch', data)
      },
      openAddModal() {
        this.$refs.addIntegralRule.open()
      },
      openEditModal() {
        if (!this.curIntegralRule.ruleId) {
          this.$message.warning(this.$t('integralRule.selectRule'))
          return
        }
        this.$refs.editIntegralRule.open(this.curIntegralRule)
      },
      openDeleteModal() {
        if (!this.curIntegralRule.ruleId) {
          this.$message.warning(this.$t('integralRule.selectRule'))
          return
        }
        this.$refs.deleteIntegralRule.open(this.curIntegralRule)
      },
      handleSuccess() {
        this.refreshList()
      }
    }
  }
  </script>
  
  <style scoped>
  .box-card {
    height: 100%;
  }
  
  .el-tree {
    margin-top: 10px;
  }
  </style>