81 lines
2.1 KiB
Vue
81 lines
2.1 KiB
Vue
<template>
|
||
<div class="background">
|
||
<p class="company-name" @click="">企业列表</p>
|
||
<div v-if="jsonData">
|
||
<div v-for="(item, index) in jsonData.root.kczy.row" :key="index">
|
||
<!-- 使用 router-link 来实现路由导航 -->
|
||
<router-link :to="{ name: 'corporateInfo', query: { id: item.ID } }" class="router-link">
|
||
<p style="font-size: 18px;">{{ item.FIELD0001 }}</p>
|
||
</router-link>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref } from 'vue';
|
||
import axios from 'axios';
|
||
import { fetchToken } from '../utils/getToken';
|
||
import x2js from 'x2js';
|
||
|
||
// 使用首字母小写的 x2js
|
||
const x2jsInstance = new x2js();
|
||
|
||
// 用于存储获取的数据
|
||
const token = ref('');
|
||
const data = ref('');
|
||
const jsonData = ref(null);
|
||
|
||
// 在组件加载时调用 fetchToken 函数
|
||
fetchToken().then((response) => {
|
||
if (response) {
|
||
token.value = response;
|
||
// 获取 token 后调用 fetchData 函数
|
||
fetchData(response);
|
||
}
|
||
});
|
||
|
||
// 加入 token 获取数据
|
||
const fetchData = async (token) => {
|
||
try {
|
||
const response = await axios.get(`api/seeyon/rest/dee/task/getMineral?token=${token.id}`);
|
||
data.value = response.data;
|
||
// 将XML数据转换为JSON数据，传递的是 data.value
|
||
jsonData.value = x2jsInstance.xml2js(data.value);
|
||
// console.log(jsonData.value);
|
||
} catch (error) {
|
||
console.error(error);
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
.background {
|
||
background-image: url("../assets/img/index3.png");
|
||
background-size: 100% 100%;
|
||
background-position: center;
|
||
height: 100vh; /* 设置高度为视口高度 */
|
||
/* 其他样式属性 */
|
||
}
|
||
* {
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
.company-name {
|
||
color: blue;
|
||
font-size: 24px;
|
||
text-align: center;
|
||
/* 设置文本内容距离顶部的距离为 50 像素 */
|
||
padding-top: 110px;
|
||
font-weight: bold;
|
||
}
|
||
.router-link {
|
||
text-decoration: none; /* 去掉下划线 */
|
||
color: inherit; /* 继承父元素的颜色，这里是指定的字体颜色 */
|
||
}
|
||
|
||
.router-link:hover {
|
||
color: inherit; /* 继承父元素的颜色，鼠标悬停时颜色不变 */
|
||
}
|
||
</style>
|