liukangdong
2024-09-29 b2d360d9113b6955287108ca9e90d76a1f3c1419
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
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<template>
  <TableLayout class="menu-layout" :permissions="['business:bjparam:query']">
    <!-- 表格和分页 -->
    <template v-slot:table-wrap>
      <ul class="toolbar" v-permissions="['business:bjparam:create', 'business:bjparam:delete', 'business:bjparam:sort']">
        <li><el-button type="primary" @click="$refs.OperaBjParamWindow.open('新建报价配置',null,null,pList)" icon="el-icon-plus" v-permissions="['business:bjparam:create']">新建</el-button></li>
        <li><el-button @click="deleteByIdInBatch" icon="el-icon-delete" v-permissions="['business:bjparam:delete']">删除</el-button></li>
      </ul>
      <el-table
          ref="table1"
          v-loading="isWorking.search"
          :data="tableData.list"
          :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
          row-key="id"
          stripe
          default-expand-all
          @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55" fixed="left"></el-table-column>
        <el-table-column prop="name" label="名称"  fixed="left" min-width="160px"></el-table-column>
        <el-table-column prop="rate" label="比例(100倍)" min-width="120px" class-name="table-column-icon"> </el-table-column>
        <el-table-column prop="type" label="类型" min-width="120px" class-name="table-column-icon">
          <template slot-scope="{row}">
            <span v-if="row.type == 0">毛坯</span>
            <span v-if="row.type == 1">精装</span>
          </template>
        </el-table-column>
        <el-table-column prop="sortnum" label="排序码" min-width="140px"></el-table-column>
<!--
        <el-table-column prop="remark" label="备注" min-width="120px"></el-table-column>
-->
        <el-table-column prop="editorName" label="操作人" min-width="100px"> </el-table-column>
        <el-table-column prop="editDate" label="操作时间" min-width="140px"></el-table-column>
        <el-table-column
            v-if="containPermissions(['business:bjparam:update', 'business:bjparam:create', 'business:bjparam:delete'])"
            label="操作"
            min-width="220"
            fixed="right"
        >
          <template slot-scope="{row}">
            <el-button type="text" icon="el-icon-edit" @click="$refs.OperaBjParamWindow.open('编辑报价配置', row,null,pList)" v-permissions="['business:bjparam:update']">编辑</el-button>
            <el-button type="text" icon="el-icon-plus" v-if="!row.parentId " @click="$refs.OperaBjParamWindow.open('新建子配置', null, row,pList)" v-permissions="['business:bjparam:create']">新建子配置</el-button>
            <el-button v-if="!row.fixed" type="text" icon="el-icon-delete" @click="deleteById(row)" v-permissions="['business:bjparam:delete']">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </template>
    <!-- 新建/修改 -->
    <OperaBjParamWindow ref="OperaBjParamWindow" @success="handlePageChange(tableData.pagination.pageIndex)"/>
  </TableLayout>
</template>
 
<script>
import TableLayout from '@/layouts/TableLayout'
import BaseTable from '@/components/base/BaseTable'
import { fetchTree, updateSort } from '@/api/business/bjParam'
import OperaBjParamWindow from '@/components/business/OperaBjParamWindow'
export default {
  name: 'bjParam',
  extends: BaseTable,
  components: { OperaBjParamWindow,  TableLayout },
  data () {
    return {
      // 是否正在处理中
      pList:[],
      isWorking: {
        sort: false
      }
    }
  },
  methods: {
    // 查询数据
    handlePageChange () {
      this.isWorking.search = true
      fetchTree()
        .then(records => {
          this.pList = records || []
          for (const p of  this.pList ) {
            if (p.hasChildren && p.children) {
              for (const item of p.children) {
                item.hasChildren = true
                item.children = []
              }
            }
          }
          this.tableData.list = this.pList
          console.log(this.tableData.list)
        })
        .catch(e => {
          this.$tip.apiFailed(e)
        })
        .finally(() => {
          this.isWorking.search = false
        })
    },
    // 查询父节点
    __findParent (id, parent) {
      if (parent.children === 0) {
        return
      }
      for (const menu of parent.children) {
        if (menu.id === id) {
          return parent
        }
        if (menu.children.length > 0) {
          const m = this.__findParent(id, menu)
          if (m != null) {
            return m
          }
        }
      }
      return null
    }
  },
  created () {
    this.config({
      module: '报价计算器配置',
      api: '/business/bjParam'
    })
    this.search()
  }
}
</script>
 
<style lang="scss" scoped>
@import "@/assets/style/variables.scss";
.menu-layout {
  /deep/ .table-content {
    margin-top: 0;
  }
}
// 图标列
.table-column-icon {
  // element-ui图标
  i {
    background-color: $primary-color;
    opacity: 0.72;
    font-size: 20px;
    color: #fff;
    padding: 4px;
    border-radius: 50%;
  }
  // 自定义图标
  [class^="eva-icon-"] {
    width: 20px;
    height: 20px;
    background-size: 16px;
    vertical-align: middle;
  }
}
</style>