123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159 |
- <template>
- <div class="page">
- <el-form :inline="true" class="query-form" ref="searchForm" :model="searchForm" @keyup.enter.native="refreshList()" @submit.native.prevent>
- <!-- 搜索框-->
- <el-form-item prop="name">
- <el-input v-model="searchForm.name" placeholder="请输入业务类型" clearable></el-input>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="refreshList()" icon="el-icon-search">查询</el-button>
- <el-button @click="resetSearch()" icon="el-icon-refresh-right">重置</el-button>
- </el-form-item>
- </el-form>
- <div class="jp-table" style="">
- <vxe-toolbar :refresh="{query: refreshList}" custom>
- <template #buttons>
- <el-button v-if="hasPermission('program_service_type:add')" type="primary" icon="el-icon-plus" @click="add()">新建</el-button>
- <el-button v-if="hasPermission('program_service_type:del')" type="danger" icon="el-icon-delete" @click="del()" :disabled="$refs.serviceTypeTable && $refs.serviceTypeTable.getCheckboxRecords().length === 0" plain>删除</el-button>
- </template>
- </vxe-toolbar>
- <div class="jp-table-body">
- <vxe-table
- border="inner"
- auto-resize
- resizable
- height="auto"
- :loading="loading"
- size="small"
- ref="serviceTypeTable"
- show-header-overflow
- show-overflow
- highlight-hover-row
- :menu-config="{}"
- @sort-change="sortChangeHandle"
- :sort-config="{remote:true}"
- :data="dataList"
- :tree-config="{transform: true, rowField: 'id', parentField: 'parentId'}"
- :checkbox-config="{}">
- <vxe-column type="seq" width="60" title="序号"></vxe-column>
- <vxe-column type="checkbox" width="50" ></vxe-column>
- <vxe-column min-width="350" title="业务类型" field="name" align="left" tree-node></vxe-column>
- <vxe-column min-width="50" align="center" title="序号" field="sort"></vxe-column>
- <vxe-column min-width="50" align="center" title="级别" field="level"></vxe-column>
- <vxe-column min-width="50" align="center" title="备注" field="remarks"></vxe-column>
- <vxe-column title="操作" width="230px" fixed="right" align="center">
- <template #default="scope">
- <el-button v-if="hasPermission('program_service_type:edit')&&scope.row.level === 1" text type="primary" @click="addChild(scope.row.id)">新建子类型</el-button>
- <el-button v-if="hasPermission('program_service_type:edit')" text type="primary" @click="edit(scope.row.id)">修改</el-button>
- <el-button v-if="hasPermission('program_service_type:del')" text type="primary" @click="del(scope.row.id)">删除</el-button>
- </template>
- </vxe-column>
- </vxe-table>
- </div>
- </div>
- <ProgramServiceTypeForm ref="programServiceTypeForm" @refreshDataList="refreshList"></ProgramServiceTypeForm>
- </div>
- </template>
- <script>
- import ProgramServiceTypeService from '@/api/program/ProgramServiceTypeService'
- import ProgramServiceTypeForm from './ProgramServiceTypeForm'
- export default {
- data () {
- return {
- searchForm: {
- name: '',
- sort: ''
- },
- dataList: [],
- tablePage: {
- total: 0,
- currentPage: 1,
- pageSize: 10,
- orders: []
- },
- loading: false
- }
- },
- programServiceTypeService: null,
- created () {
- this.programServiceTypeService = new ProgramServiceTypeService()
- },
- components: {
- ProgramServiceTypeForm
- },
- mounted () {
- this.refreshList()
- },
- methods: {
- // 新增
- add () {
- this.$refs.programServiceTypeForm.init('add', '')
- },
- addChild (id) {
- this.$refs.programServiceTypeForm.init('addChild', id)
- },
- // 修改
- edit (id) {
- id = id || this.$refs.serviceTypeTable.getCheckboxRecords().map(item => {
- return item.id
- })[0]
- this.$refs.programServiceTypeForm.init('edit', id)
- },
- // 查看
- view (id) {
- this.$refs.programServiceTypeForm.init('view', id)
- },
- // 获取数据列表
- refreshList () {
- this.loading = true
- this.programServiceTypeService.list({
- 'current': this.tablePage.currentPage,
- 'size': this.tablePage.pageSize,
- 'orders': this.tablePage.orders,
- ...this.searchForm
- }).then((data) => {
- this.dataList = data.records
- this.tablePage.total = data.total
- this.loading = false
- })
- },
- // 当前页
- currentChangeHandle ({ currentPage, pageSize }) {
- this.tablePage.currentPage = currentPage
- this.tablePage.pageSize = pageSize
- this.refreshList()
- },
- // 排序
- sortChangeHandle (column) {
- this.tablePage.orders = []
- if (column.order != null) {
- this.tablePage.orders.push({column: this.$utils.toLine(column.property), asc: column.order === 'asc'})
- }
- this.refreshList()
- },
- // 删除
- del (id) {
- let ids = id || this.$refs.serviceTypeTable.getCheckboxRecords().map(item => {
- return item.id
- }).join(',')
- this.$confirm(`确定删除所选项吗?`, '提示', {
- confirmButtonText: '确定',
- cancelButtonText: '取消',
- type: 'warning'
- }).then(() => {
- this.loading = true
- this.programServiceTypeService.delete(ids).then((data) => {
- this.$message.success(data)
- this.refreshList()
- this.loading = false
- })
- })
- },
- resetSearch () {
- this.$refs.searchForm.resetFields()
- this.refreshList()
- }
- }
- }
- </script>
|