zouyu
2023-11-16 a4add192450f06f9e4748e6513234510f431b21e
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
<template>
  <div class="mod-config">
    <basic-container>
      <ttable
        :table="table"
        @handleSelectionChange="handleSelectionChange"
        :uploadInfo="uploadInfo"
        :isShowHide="true"
        :prelang="prelang"
        :options="options"
        :ajaxFun="ajaxFun"
        ref="shiftTable"
      >
        <template #toolbar></template>
      </ttable>
      <!-- 弹窗, 新增 / 修改 -->
      <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getData"></table-form>
    </basic-container>
  </div>
</template>
 
<script>
  import {fetchList, delObj} from '@/api/basic/shift'
  import TableForm from './shift-form'
  import {mapGetters} from 'vuex'
  import ttable from '@/views/common/ztt-table.vue'
 
  export default {
    data() {
      return {
        ajaxFun:fetchList,
        addOrUpdateVisible: false,
        multipleSelection: [],
        uploadInfo: {//是否展示上传EXCEL以及对应的url
          isShow: false,
          url: ''
        },
        prelang: "operation",
        options: {
          height: 300,//默认高度-为了表头固定
          stripe: true, // 是否为斑马纹 table
          highlightCurrentRow: false, // 是否要高亮当前行
          border: true,//是否有纵向边框
          lazy: false,//是否需要懒加载
          fit: true,//列的宽度是否自撑开
          multiSelect: true,//
          seqNo: true,
          isShowHide: true,//是否显示显影按钮
          isSearch: false,//高级查询按钮
          defaultOrderBy:{column:'id',direction:'asc'}
        },
        table: {
          total: 0,
          currentPage: 1,
          pageSize: 20,
          data: [],
          // 标题
          column: [
            {minWidth:'140',prop:"name",label:"班次",sort: true,isTrue:true,isSearch:true,searchInfoType:'text',render:{fun:this.addOrUpdateHandle}}
          ],
          toolbar: [
            {
              text: '新增',
              type: 'primary',
              fun: this.addOrUpdateHandle
            }
          ],
          operator: [
            {
              text: '删除',
              icon: 'el-icon-delete',
              type: 'text',
              size: 'small',
              fun: this.deleteHandle
            }
          ],
          operatorConfig: {
            fixed: 'right',
            label: '操作',
            width: 100,
            minWidth: 100
          },
        },
      }
    },
    components: {
      TableForm,
      ttable
    },
    computed: {
      ...mapGetters(['permissions'])
    },
    methods: {
      // 获取数据列表
      getData () {
        this.$refs.shiftTable.getDataList();
      },
      // 新增 / 修改
      addOrUpdateHandle(row) {
        this.addOrUpdateVisible = true
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(row == null ? null : row.id)
        })
      },
      // 删除
      deleteHandle(row) {
        this.$confirm('是否确认删除班次名称为:' + row.name, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          closeOnClickModal: false,
          type: 'warning'
        }).then(function () {
          return delObj(row.id)
        }).then(data => {
          this.$message.success('删除成功')
          this.getData()
        })
      },
      handleSelectionChange(val) {
        this.multipleSelection = val
      },
    }
  }
</script>