shuishen
2023-12-20 895ba2f255e05b780c52fc1667c045c495b129b8
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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
<!-- 走访日志 -->
<template>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" ref="crud" v-model="form"
            :permission="permissionList" @search-change="searchChange" @search-reset="searchReset"
            @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
            @refresh-change="refreshChange" @on-load="onLoad">
        </avue-crud>
    </basic-container>
</template>
 
<script>
import { getList } from "@/api/punch_card"
import { mapGetters } from "vuex"
import website from '@/config/website'
 
export default {
    data () {
        return {
            form: {},
            query: {},
            loading: true,
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            datetime: "",
            selectionList: [],
            option: {
                menu: false,
                addBtn: false,
                border: true,
                index: false,
                selection: false,
                height: "auto",
                calcHeight: 54,
                dialogWidth: 950,
                tip: false,
                searchShow: true,
                searchMenuSpan: 3,
                //stripe:true,
                viewBtn: true,
                excelBtn: true,
                dialogClickModal: false,
                column: [
                    {
                        label: "打卡人员",
                        prop: "name",
                        search: true
                    },
                    {
                        label: "打卡时间",
                        prop: "createTime",
                        type: "date",
                        format: "yyyy-MM-dd HH:mm:ss",
                        valueFormat: "yyyy-MM-dd HH:mm:ss",
                        rules: [
                            {
                                required: true,
                                message: "请输入走访时间",
                                trigger: "blur",
                            },
                        ],
                    },
                    {
                        label: "工作内容",
                        prop: "workContent",
                    },
                    {
                        label: "经度",
                        prop: "lng",
                    },
                    {
                        label: "纬度",
                        prop: "lat",
                    },
                    {
                        label: "打卡地址",
                        prop: "address",
                    },
                    {
                        label: "打卡图片",
                        prop: "img",
                        type: "upload",
                        labelWidth: 120,
                        width: 80,
                        listType: "picture-img",
                        action: "/api/blade-resource/oss/endpoint/put-file",
                        propsHttp: {
                            res: "data",
                            name: 'name',
                            url: "link",
                        },
                        span: 24,
                    },
 
                ],
            },
            data: [],
        }
    },
    watch: {
    },
    computed: {
        ...mapGetters(["permission", "userInfo"]),
        permissionList () {
            return {
                addBtn: this.vaildData(this.permission.gridWorkLog_add, true),
                viewBtn: this.vaildData(this.permission.gridWorkLog_view, true),
                delBtn: this.vaildData(this.permission.gridWorkLog_delete, true),
                editBtn: this.vaildData(this.permission.gridWorkLog_edit, true),
            }
        },
        ids () {
            let ids = []
            this.selectionList.forEach((ele) => {
                ids.push(ele.id)
            })
            return ids.join(",")
        },
    },
    methods: {
        searchReset () {
            this.query = {}
            this.onLoad(this.page)
        },
        searchChange (params, done) {
            this.query = params
            this.page.currentPage = 1
            this.onLoad(this.page, params)
            done()
        },
        selectionChange (list) {
            this.selectionList = list
        },
        selectionClear () {
            this.selectionList = []
            this.$refs.crud.toggleSelection()
        },
 
        currentChange (currentPage) {
            this.page.currentPage = currentPage
        },
        sizeChange (pageSize) {
            this.page.pageSize = pageSize
        },
        refreshChange () {
            this.onLoad(this.page, this.query)
        },
        onLoad (page, params = {}) {
            this.loading = true
 
            getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
                const data = res.data.data
                this.page.total = data.total
                this.data = data.records.map(item => {
                    if (item.img && item.img.length > 0) {
                        var urls = []
                        var names = item.img.split(",")
                        names.forEach(name => {
                            urls.push(website.minioUrl + name)
                        })
                        item.img = urls.join(",")
                    }
 
                    return item
                })
 
                this.loading = false
                this.selectionClear()
            })
        }
    },
}
</script>
 
<style>
.avue-upload__icon {
    line-height: 6;
}
</style>