移动系统liao
3 天以前 a737f5caf67b75abec3e89296c4321ea6d31bd9b
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
<template>
    <el-card shadow="hover" header="更新记录">
        <template #header>
            <el-icon style="display: inline; vertical-align: middle"> <ele-DocumentCopy /> </el-icon>
            <span> 更新记录 </span>
            <el-button type="primary" icon="ele-Refresh" round plain @click="refresh" style="float: right">更新记录</el-button>
        </template>
        <div class="commit" v-loading="state.loading">
            <el-timeline style="max-width: 600px" v-if="state.list.length > 0">
                <el-timeline-item v-for="(item, index) in state.list" :key="index" :timestamp="formatDate(new Date(item.commit.committer.date), 'YYYY-mm-dd HH:MM:SS')">
                    <el-link style="white-space: pre-line; word-break: break-all" :href="item.html_url" target="_blank"> {{ item.commit.message }}</el-link>
                </el-timeline-item>
            </el-timeline>
            <el-empty v-else description="空"></el-empty>
        </div>
    </el-card>
</template>
 
<script lang="ts">
export default {
    title: '更新记录',
    icon: 'ele-DocumentCopy',
    description: '当前项目更新记录',
};
</script>
 
<script setup lang="ts" name="commit">
import { reactive, onMounted } from 'vue';
import { formatDate } from '/@/utils/formatTime';
 
const state = reactive({
    loading: false,
    list: [] as any,
});
 
const getList = () => {
    axios({
        method: 'get',
        url: 'https://gitee.com/api/v5/repos/zuohuaijun/Admin.NET/commits',
        params: {
            page: 1,
            per_page: 10,
        },
    }).then((res: any) => {
        state.list = res.data;
        state.loading = false;
    });
};
 
const refresh = () => {
    state.loading = true;
    getList();
};
 
onMounted(() => {
    state.loading = true;
    getList();
});
</script>
 
<style scoped>
.progress {
    text-align: center;
}
.progress .percentage-value {
    font-size: 28px;
}
.progress .percentage-label {
    font-size: 12px;
    margin-top: 10px;
}
.commit {
    max-height: 500px;
    overflow: auto;
}
</style>