打卡登记记录页面，图标添加

shuishen

2023-12-19 1a048bbccadb9bc4d9f016c64b6d95b7362bfb61

打卡登记记录页面，图标添加

 src/api/punch_card/index.js

New file
@@ -0,0 +1,23 @@
/*
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2023-12-19 15:47:25
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-12-19 15:47:58
 * @FilePath: \jczz_web\src\api\punch_card\index.js
 * @Description:
 *
 * Copyright (c) 2023 by shuishen, All Rights Reserved.
 */
import request from "@/router/axios";

export const getList = (current, size, params) => {
  return request({
    url: "/api/blade-checkInRecords/checkInRecords/page",
    method: "get",
    params: {
      ...params,
      current,
      size,
    },
  });
};

 src/config/env.js

@@ -1,21 +1,25 @@
/*
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2023-12-14 17:10:00
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-12-19 16:55:56
 * @FilePath: \jczz_web\src\config\env.js
 * @Description:
 *
 * Copyright (c) 2023 by shuishen, All Rights Reserved.
 */
// 阿里矢量图标库配置
let iconfontVersion = ['567566_pwc3oottzol'];
let iconfontUrl = `//at.alicdn.com/t/font_$key.css`;
let iconfontVersion = ["567566_pwc3oottzol", "4380189_e93ccwuqira"];
let iconfontUrl = `//at.alicdn.com/t/c/font_$key.css`;

let baseUrl = '';
let codeUrl = `${baseUrl}/code`
const env = process.env
if (env.NODE_ENV === 'development') {
    baseUrl = `/api`; // 开发环境地址
} else if (env.NODE_ENV === 'production') {
    baseUrl = ``; //生产环境地址
} else if (env.NODE_ENV === 'test') {
    baseUrl = ``; //测试环境地址
let baseUrl = "";
let codeUrl = `${baseUrl}/code`;
const env = process.env;
if (env.NODE_ENV === "development") {
  baseUrl = `/api`; // 开发环境地址
} else if (env.NODE_ENV === "production") {
  baseUrl = ``; //生产环境地址
} else if (env.NODE_ENV === "test") {
  baseUrl = ``; //测试环境地址
}
export {
    baseUrl,
    iconfontUrl,
    iconfontVersion,
    codeUrl,
    env
}
export { baseUrl, iconfontUrl, iconfontVersion, codeUrl, env };

 src/config/iconList.js

@@ -66,7 +66,7 @@
      "iconfont iconicon_add",
      "iconfont icongithub",
      "iconfont icongitee2",
    ]
    ],
  },
  {
    label: "系统图标",
@@ -113,6 +113,33 @@
      "iconfont icon-msnui-360",
      "iconfont icon-iframe",
      "iconfont icon-huanyingye",
    ]
  }
]

      "iconfont icon-sr-fuwurenwuguanli",
      "iconfont icon-sr-jibenxinxi",
      "iconfont icon-sr-fuwuguanli",
      "iconfont icon-sr-changsuofenlei",
      "iconfont icon-sr-comments_icon",
      "iconfont icon-sr-liuchengguanli",
      "iconfont icon-sr-liuchengbushu",
      "iconfont icon-sr-shujuguanli",
      "iconfont icon-sr-_cishangongyi",
      "iconfont icon-sr-zhaobiaoguanli",
      "iconfont icon-sr-icon-test",
      "iconfont icon-sr-fangwuguanli",
      "iconfont icon-sr-icon_Overall_Utilisation",
      "iconfont icon-sr-wanggeguanli",
      "iconfont icon-sr-wenzhangfenlei",
      "iconfont icon-sr-moxingguanli",
      "iconfont icon-sr-hx_cgddgl",
      "iconfont icon-sr-a-2fuwu-zulinzixun",
      "iconfont icon-sr-xiaoquguanli",
      "iconfont icon-sr-ic_school_sbcl",
      "iconfont icon-sr-huiyiguanli",
      "iconfont icon-sr-tag",
      "iconfont icon-sr-neirongguanli",
      "iconfont icon-sr-home-2-line",
      "iconfont icon-sr-a-danjucaozuoliuchenggenzong",
      "iconfont icon-sr-biaoqianguanli",
    ],
  },
];

 src/views/punch_card/index.vue

New file
@@ -0,0 +1,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>