ludc
2024-01-08 82dafa095dcfa9a94ed5b6fa45552e038eae3a12
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
<template>
    <basic-container>
        <avue-crud :option="option"
                :table-loading="loading"
                :data="data"
                :page.sync="page"
                :permission="permissionList"
                :before-open="beforeOpen"
                v-model="form"
                ref="crud"
                :cell-style="cellStyle" 
                :row-style="rowStyle"
                @on-load="onLoad">
            <template slot-scope="scope" slot="menu">
                <el-button type="text"
                        icon="el-icon-upload"
                        size="small"
                        v-if="permissionList.upload"
                        @click="handleDownload(scope.row)">上 传
                </el-button>
                <el-button type="text"
                        icon="el-icon-refresh"
                        size="small"
                        v-if="permissionList.restart"
                        @click="test">重 启
                </el-button>
            </template>
            <template slot-scope="{row}"
                        slot="port">
                <el-tag>{{`${row.port}`}}</el-tag>
            </template>
            <template slot-scope="{row}"
                        slot="serviceNum">
                <el-tag>{{`${row.serviceNum}`}}</el-tag>
            </template>
        </avue-crud>
    </basic-container>
</template>
 
<script>
import { getApplications } from "@/api/system/deploy";
import moment from 'moment';
export default {
    data() {
        return {
            option: {
                columnBtn:false,
                height: 'auto',
                calcHeight: 30,
                tip: false,
                searchShow: false,
                border: true,
                index: true,
                viewBtn: false,
                addBtn: false,
                editBtn: false,
                delBtn: false,
                selection: true,
                refreshBtn: false,
                dialogClickModal: false,
                column: [
                    {
                        label: "实例名称",
                        prop: "name",
                        sortable: true,
                    },
                    {
                        label: "运行状态",
                        prop: "status",
                    },
                    {
                        label: "启动时间",
                        prop: "statusTimestamp",
                    },
                    {
                        label: "端口号",
                        prop: "port",
                    },
                    {
                        label: "实例数量",
                        prop: "serviceNum",
                        width: 120,
                    },
                ]
            },
            data: [],
        }
    },
    created() {
      
    },
    computed: {
        permissionList() {
            return {
                upload: true,
                restart: true,
                // viewBtn: this.vaildData(this.permission, true),
            };
        },
    },
    methods: {
 
        onLoad(){
            getApplications().then(res=>{
                let serviceData = res.data.data;
                if(serviceData.length>0){
                    serviceData.forEach(element => {
                        //console.log("element",element);
                        // 将时间转换为本地时间
                        let localTime = moment.utc(element.statusTimestamp).local();
                        // 格式化时间为您想要的格式
                        let formattedTime = localTime.format('YYYY-MM-DD HH:mm:ss');
                        element.statusTimestamp = formattedTime;
                        this.data.push(element)
                    });
                }
                //console.log(res.data.data);
            });
        },
        rowStyle({row,column,rowIndex}){
            if(rowIndex%2===0){
            return {
                backgroundColor:'#eee',
                color:'#black',
            }
            }
        },
        cellStyle({row,column,rowIndex,columnIndex}){
            if(columnIndex==3){
            if(row.status==="UP"){
                return {
                    color:'green',
                    fontWeight:'bold',
                    fontSize:'20'
                }
            }else{
                return {
                    color:'red',
                    fontWeight:'bold',
                    fontSize:'20'
                }
            }
            }
        },
 
    }
}
</script>
 
<style scoped>
 
</style>