|
@@ -1,44 +1,474 @@
|
|
<template>
|
|
<template>
|
|
<div class="mod-home">
|
|
<div class="mod-home">
|
|
- <h1>智能应用云服务平台</h1>
|
|
|
|
- <ul>
|
|
|
|
- <!-- <li>开发人员:陈瑞杰、杜俊逸、胡志明、孙浩博</li>
|
|
|
|
- <li>前端git地址:<a href="https://gitee.com/djy8023/mkcloud-vue" target="_blank">mkcloud-vue</a></li>
|
|
|
|
- <li>后端git地址:<a href="https://gitee.com/djy8023/mkcloud-fast" target="_blank">mkcloud-fast</a></li>
|
|
|
|
- <li>目前实现的功能有:用户管理、角色管理</li>
|
|
|
|
- <li>目前正在实现的功能有:镜像管理</li>
|
|
|
|
- <li>目前遇到的问题:k8s集群断电,备份重启</li> -->
|
|
|
|
-
|
|
|
|
- <h2>8.1日更新</h2>
|
|
|
|
- <li>1.安装与调试,使用集群备份软件velero</li>
|
|
|
|
- <li>2.解决集群断电恢复重启问题</li>
|
|
|
|
- <li>3.新增数据库应用管理与存储卷管理数据表</li>
|
|
|
|
- <li>4.后台编写应用管理与存储卷管理的CRUD</li>
|
|
|
|
- <li>5.前端添加应用管理页面与存储卷管理页面列表、CRUD功能</li>
|
|
|
|
- <li>6.成功实现前端,后端连接kubepshere API</li>
|
|
|
|
- <li>7.修改,调试harbor仓库为https协议类型的网址</li>
|
|
|
|
- <li>8.修改前端页面图标</li>
|
|
|
|
- <li>
|
|
|
|
- 9.修改新增存储卷的弹窗,仿照kubepshere的新增过程,能够对数据库进行存储,但是还不能直接对kubesphere操作
|
|
|
|
- </li>
|
|
|
|
- <li>10.后端访问kubesphere API,实现后台调用s2ibuilder成功</li>
|
|
|
|
- <li>11.添加kubesphere</li>
|
|
|
|
-
|
|
|
|
- <h2>11月更新</h2>
|
|
|
|
- <li>1.优化监控界面</li>
|
|
|
|
- <li>2.优化算法打包速度</li>
|
|
|
|
- <li>3.优化算法发布速度</li>
|
|
|
|
- <li>4.修改算法表</li>
|
|
|
|
- <li>5.应用界面增加暂停和启动功能</li>
|
|
|
|
- <li>6.Harbor仓库的优化配置</li>
|
|
|
|
- <li>7.解决若干BUG</li>
|
|
|
|
- <li>8.修改前端界面</li>
|
|
|
|
- </ul>
|
|
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="22">
|
|
|
|
+ <h3>集群资源使用状况</h3>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="2"> </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+
|
|
|
|
+ <el-row type="flex">
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <el-card shadow="hover" body-style="padding:5px">
|
|
|
|
+ <columnCharts
|
|
|
|
+ :charData="radarDataList"
|
|
|
|
+ :id="'Radarcontainer'"
|
|
|
|
+ ></columnCharts>
|
|
|
|
+ </el-card>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <el-card shadow="hover">
|
|
|
|
+ <el-row :gutter="20">
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <pieChart
|
|
|
|
+ :charData="cpuPieData"
|
|
|
|
+ :id="'CPUcontainer'"
|
|
|
|
+ :content="'CPU'"
|
|
|
|
+ ></pieChart>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(metrics.cluster_cpu_utilisation * 100)
|
|
|
|
+ }}%</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>CPU</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong>{{ this.metrics.cluster_cpu_usage }}core</strong>
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>已使用</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong>{{ this.metrics.cluster_cpu_total }}core</strong>
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>总计</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </el-card>
|
|
|
|
+ <el-card shadow="hover">
|
|
|
|
+ <el-row :gutter="20">
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <pieChart
|
|
|
|
+ :charData="memoryPieData"
|
|
|
|
+ :id="'Memorycontainer'"
|
|
|
|
+ :content="'内存'"
|
|
|
|
+ ></pieChart>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(metrics.cluster_memory_utilisation * 100)
|
|
|
|
+ }}%</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>内存</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(
|
|
|
|
+ this.metrics.cluster_memory_usage_wo_cache /
|
|
|
|
+ (1024 * 1024 * 1024)
|
|
|
|
+ )
|
|
|
|
+ }}Gi</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>已使用</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(
|
|
|
|
+ this.metrics.cluster_memory_total / (1024 * 1024 * 1024)
|
|
|
|
+ )
|
|
|
|
+ }}Gi</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>总计</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </el-card>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <el-card shadow="hover">
|
|
|
|
+ <el-row :gutter="20">
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <pieChart
|
|
|
|
+ :charData="localDiskSizePieData"
|
|
|
|
+ :id="'Localdiskchart'"
|
|
|
|
+ :content="'存储'"
|
|
|
|
+ ></pieChart>
|
|
|
|
+ <!-- <div :id="'container3'"></div> -->
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(
|
|
|
|
+ this.metrics.cluster_disk_size_utilisation * 100
|
|
|
|
+ )
|
|
|
|
+ }}%</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>存储</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(
|
|
|
|
+ this.metrics.cluster_disk_size_usage / (1024 * 1024 * 1024)
|
|
|
|
+ )
|
|
|
|
+ }}GB</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>已使用</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(
|
|
|
|
+ metrics.cluster_disk_size_capacity / (1024 * 1024 * 1024)
|
|
|
|
+ )
|
|
|
|
+ }}GB</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>总计</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </el-card>
|
|
|
|
+ <el-card shadow="hover">
|
|
|
|
+ <el-row :gutter="20">
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <!-- <g2-pie
|
|
|
|
+ style="height: 125px; width: 125px"
|
|
|
|
+ :type="'ring'"
|
|
|
|
+ :axis-name="{ name: '容器组', value: ' ' }"
|
|
|
|
+ :data="containerGroupPieData"
|
|
|
|
+ :guide="{ name: '容器组' }"
|
|
|
|
+ >
|
|
|
|
+ </g2-pie> -->
|
|
|
|
+
|
|
|
|
+ <pieChart
|
|
|
|
+ :charData="containerGroupPieData"
|
|
|
|
+ :id="'Containerscontainer'"
|
|
|
|
+ :content="'容器组'"
|
|
|
|
+ ></pieChart>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(metrics.cluster_pod_utilisation * 100)
|
|
|
|
+ }}%</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>容器组</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong>{{ metrics.cluster_pod_running_count }}</strong>
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>已使用</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong>{{ metrics.cluster_pod_quota }}</strong>
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>总计</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </el-card>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <el-card shadow="hover">
|
|
|
|
+ <h3>集群组件状态</h3>
|
|
|
|
+ <el-row :gutter="8">
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(this.apiServer.apiserver_request_rate)
|
|
|
|
+ }}times/s</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>API 每秒请求数</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong
|
|
|
|
+ >{{
|
|
|
|
+ formatNumber(
|
|
|
|
+ this.apiServer.apiserver_request_latencies * 1000
|
|
|
|
+ )
|
|
|
|
+ }}ms</strong
|
|
|
|
+ >
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>API 请求延迟</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong>{{ this.scheduler.scheduler_schedule_attempts }}</strong>
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>调度器调度次数</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="4">
|
|
|
|
+ <br />
|
|
|
|
+ <strong>-</strong>
|
|
|
|
+ <br />
|
|
|
|
+ <br />
|
|
|
|
+ <div>调度失败的容器组</div>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </el-card>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="12">
|
|
|
|
+ <el-card>
|
|
|
|
+ <el-row>
|
|
|
|
+ <h3>节点用量</h3>
|
|
|
|
+ </el-row>
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col>
|
|
|
|
+ <el-table
|
|
|
|
+ stripe
|
|
|
|
+ style="width: 100%"
|
|
|
|
+ :data="nodesList"
|
|
|
|
+ height="250"
|
|
|
|
+ >
|
|
|
|
+ <el-table-column prop="host" label="host"></el-table-column>
|
|
|
|
+ <el-table-column prop="role" label="role"></el-table-column>
|
|
|
|
+ <el-table-column prop="node" label="node"></el-table-column>
|
|
|
|
+ <el-table-column
|
|
|
|
+ prop="node_cpu_utilisation"
|
|
|
|
+ label="CPU%"
|
|
|
|
+ ></el-table-column>
|
|
|
|
+ <el-table-column
|
|
|
|
+ prop="node_disk_inode_utilisation"
|
|
|
|
+ label="inode 使用率"
|
|
|
|
+ ></el-table-column>
|
|
|
|
+ <el-table-column
|
|
|
|
+ prop="node_pod_utilisation"
|
|
|
|
+ label="容器组"
|
|
|
|
+ ></el-table-column>
|
|
|
|
+ <el-table-column
|
|
|
|
+ prop="node_memory_utilisation"
|
|
|
|
+ label="内存%"
|
|
|
|
+ ></el-table-column>
|
|
|
|
+ <el-table-column
|
|
|
|
+ prop="node_disk_size_utilisation"
|
|
|
|
+ label="存储%"
|
|
|
|
+ ></el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </el-card>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="8"> </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+
|
|
|
|
+ <el-col> </el-col>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
-export default {};
|
|
|
|
|
|
+import pieChart from "../modules/monitor/charts/pieChart.vue";
|
|
|
|
+import columnCharts from "../modules/monitor/charts/cloumnCharts.vue";
|
|
|
|
+import {
|
|
|
|
+ getMetrics,
|
|
|
|
+ getApiServer,
|
|
|
|
+ getScheduler,
|
|
|
|
+ getNodes,
|
|
|
|
+ getPhysicalMonitor,
|
|
|
|
+} from "@/utils/token";
|
|
|
|
+export default {
|
|
|
|
+ components: {
|
|
|
|
+ pieChart,
|
|
|
|
+ columnCharts,
|
|
|
|
+ },
|
|
|
|
+ data() {
|
|
|
|
+ return {};
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ //节点列表
|
|
|
|
+ nodesList() {
|
|
|
|
+ const nodes = this.$store.state.monitor.nodesList;
|
|
|
|
+ var nodesList = [];
|
|
|
|
+ for (var i = 0; i < nodes.length; i++) {
|
|
|
|
+ const host = nodes[i].host;
|
|
|
|
+ const node = nodes[i].node;
|
|
|
|
+ const role = nodes[i].role;
|
|
|
|
+ const node_cpu_utilisation = this.formatNumber(
|
|
|
|
+ nodes[i].node_cpu_utilisation * 100
|
|
|
|
+ );
|
|
|
|
+ const node_disk_inode_utilisation = this.formatNumber(
|
|
|
|
+ nodes[i].node_disk_inode_utilisation * 100
|
|
|
|
+ );
|
|
|
|
+ const node_pod_utilisation = this.formatNumber(
|
|
|
|
+ nodes[i].node_pod_utilisation * 100
|
|
|
|
+ );
|
|
|
|
+ const node_memory_utilisation = this.formatNumber(
|
|
|
|
+ nodes[i].node_memory_utilisation * 100
|
|
|
|
+ );
|
|
|
|
+ const node_disk_size_utilisation = this.formatNumber(
|
|
|
|
+ nodes[i].node_disk_size_utilisation * 100
|
|
|
|
+ );
|
|
|
|
+ nodesList.push({
|
|
|
|
+ host: host,
|
|
|
|
+ node: node,
|
|
|
|
+ role: role,
|
|
|
|
+ node_cpu_utilisation: node_cpu_utilisation,
|
|
|
|
+ node_disk_inode_utilisation: node_disk_inode_utilisation,
|
|
|
|
+ node_cpu_utilisation: node_pod_utilisation,
|
|
|
|
+ node_memory_utilisation: node_memory_utilisation,
|
|
|
|
+ node_disk_size_utilisation: node_disk_size_utilisation,
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ console.log("nodelist", nodesList);
|
|
|
|
+ return nodesList;
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ //完整的cluster_metrics
|
|
|
|
+ metrics() {
|
|
|
|
+ var metrics = this.$store.state.monitor.metrics;
|
|
|
|
+
|
|
|
|
+ return metrics;
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ //集群资源使用比例
|
|
|
|
+ radarDataList() {
|
|
|
|
+ var radarDataList = [];
|
|
|
|
+ var cpu_utilisation = this.metrics.cluster_cpu_utilisation * 100;
|
|
|
|
+ var memory_utilisation = this.metrics.cluster_memory_utilisation * 100;
|
|
|
|
+ var disk_size_utilisation =
|
|
|
|
+ this.metrics.cluster_disk_size_utilisation * 100;
|
|
|
|
+ var pod_utilisation = this.metrics.cluster_pod_utilisation * 100;
|
|
|
|
+
|
|
|
|
+ var cpu=this.formatNumber(cpu_utilisation);
|
|
|
|
+ var disk=this.formatNumber(disk_size_utilisation);
|
|
|
|
+ var pod=this.formatNumber(pod_utilisation);
|
|
|
|
+ var memory=this.formatNumber(memory_utilisation);
|
|
|
|
+
|
|
|
|
+ radarDataList.push({ name: "CPU", value: cpu });
|
|
|
|
+ radarDataList.push({ name: "本地存储", value: disk });
|
|
|
|
+ radarDataList.push({ name: "容器组", value: pod });
|
|
|
|
+ radarDataList.push({ name: "内存", value: memory });
|
|
|
|
+
|
|
|
|
+ return radarDataList;
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ //CPU 饼图
|
|
|
|
+ cpuPieData() {
|
|
|
|
+ var cpuPieData = [];
|
|
|
|
+ var cpu_usage = this.metrics.cluster_cpu_usage * 1;
|
|
|
|
+ var cpu_rest =
|
|
|
|
+ (this.metrics.cluster_cpu_total - this.metrics.cluster_cpu_usage) * 1;
|
|
|
|
+ cpuPieData.push({ name: "已使用", value: cpu_usage });
|
|
|
|
+ cpuPieData.push({ name: "未使用", value: cpu_rest });
|
|
|
|
+ return cpuPieData;
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ //内存饼图
|
|
|
|
+ memoryPieData() {
|
|
|
|
+ var memoryPieData = [];
|
|
|
|
+ var memory_rest =
|
|
|
|
+ this.metrics.cluster_memory_total *
|
|
|
|
+ (1 - this.metrics.cluster_memory_utilisation) *
|
|
|
|
+ 1;
|
|
|
|
+ var memory_usage =
|
|
|
|
+ (this.metrics.cluster_memory_total -
|
|
|
|
+ this.metrics.cluster_memory_available) *
|
|
|
|
+ 1;
|
|
|
|
+
|
|
|
|
+ memoryPieData.push({ name: "已使用", value: memory_usage });
|
|
|
|
+ memoryPieData.push({ name: "未使用", value: memory_rest });
|
|
|
|
+ return memoryPieData;
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ //存储饼图
|
|
|
|
+ localDiskSizePieData() {
|
|
|
|
+ var localDiskSizePieData = [];
|
|
|
|
+
|
|
|
|
+ var disk_size_rest = this.metrics.cluster_disk_size_capacity * 1;
|
|
|
|
+ var disk_size_usage = this.metrics.cluster_disk_size_usage * 1;
|
|
|
|
+
|
|
|
|
+ localDiskSizePieData.push({ name: "已使用", value: disk_size_usage });
|
|
|
|
+ localDiskSizePieData.push({ name: "未使用", value: disk_size_rest });
|
|
|
|
+
|
|
|
|
+ return localDiskSizePieData;
|
|
|
|
+ },
|
|
|
|
+ apiServer() {
|
|
|
|
+ var apiServer = this.$store.state.monitor.apiServer;
|
|
|
|
+ return apiServer;
|
|
|
|
+ },
|
|
|
|
+ scheduler() {
|
|
|
|
+ var scheduler = this.$store.state.monitor.scheduler;
|
|
|
|
+ return scheduler;
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ //容器组饼图
|
|
|
|
+ containerGroupPieData() {
|
|
|
|
+ var containerGroupPieData = [];
|
|
|
|
+ var pod_rest =
|
|
|
|
+ (this.metrics.cluster_pod_quota -
|
|
|
|
+ this.metrics.cluster_pod_running_count) *
|
|
|
|
+ 1;
|
|
|
|
+ var pod_usage = this.metrics.cluster_pod_running_count * 1;
|
|
|
|
+ containerGroupPieData.push({ name: "已使用", value: pod_usage });
|
|
|
|
+ containerGroupPieData.push({ name: "未使用", value: pod_rest });
|
|
|
|
+ return containerGroupPieData;
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ created() {
|
|
|
|
+ getNodes();
|
|
|
|
+ getMetrics();
|
|
|
|
+ getApiServer();
|
|
|
|
+ getScheduler();
|
|
|
|
+ getPhysicalMonitor();
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ activated() {},
|
|
|
|
+ mounted() {},
|
|
|
|
+
|
|
|
|
+ methods: {
|
|
|
|
+ //数字处理
|
|
|
|
+ formatNumber(num) {
|
|
|
|
+ return Math.round(num * 100) / 100;
|
|
|
|
+ },
|
|
|
|
+ reset() {},
|
|
|
|
+ },
|
|
|
|
+ updated() {},
|
|
|
|
+};
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style>
|
|
<style>
|