This commit is contained in:
parent
6604680fa9
commit
7c14eab5f4
@ -1,10 +1,11 @@
|
|||||||
@font-face {
|
@font-face {
|
||||||
font-family: "iconfont"; /* Project id 4963823 */
|
font-family: "iconfont";
|
||||||
|
/* Project id 4963823 */
|
||||||
/* Color fonts */
|
/* Color fonts */
|
||||||
src:
|
src:
|
||||||
url('//at.alicdn.com/t/c/font_4963823_az9ar7pc4xi.woff2?t=1751352287411') format('woff2'),
|
url('iconfont.woff2?t=1763986578458') format('woff2'),
|
||||||
url('//at.alicdn.com/t/c/font_4963823_az9ar7pc4xi.woff?t=1751352287411') format('woff'),
|
url('iconfont.woff?t=1763986578458') format('woff'),
|
||||||
url('//at.alicdn.com/t/c/font_4963823_az9ar7pc4xi.ttf?t=1751352287411') format('truetype');
|
url('iconfont.ttf?t=1763986578458') format('truetype');
|
||||||
}
|
}
|
||||||
|
|
||||||
.iconfont {
|
.iconfont {
|
||||||
@ -15,15 +16,50 @@
|
|||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon-weibo1:before {
|
.suoyou:before {
|
||||||
|
content: "\e601";
|
||||||
|
}
|
||||||
|
|
||||||
|
.jinjianniu:before {
|
||||||
|
content: "\e633";
|
||||||
|
}
|
||||||
|
|
||||||
|
.wodeyiban:before {
|
||||||
|
content: "\e62d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.daibanrenwu:before {
|
||||||
|
content: "\e60d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.caikuang:before {
|
||||||
|
content: "\e629";
|
||||||
|
}
|
||||||
|
|
||||||
|
.geipaishui:before {
|
||||||
|
content: "\e67d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.huoche:before {
|
||||||
|
content: "\e69c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.huanweibujianguanyangjihua:before {
|
||||||
|
content: "\e657";
|
||||||
|
}
|
||||||
|
|
||||||
|
.a-icon-caikuangguanli:before {
|
||||||
|
content: "\e600";
|
||||||
|
}
|
||||||
|
|
||||||
|
.weibo1:before {
|
||||||
content: "\e636";
|
content: "\e636";
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon-qq:before {
|
.qq:before {
|
||||||
content: "\e66a";
|
content: "\e66a";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.weixin:before {
|
||||||
.icon-weixin:before {
|
|
||||||
content: "\e607";
|
content: "\e607";
|
||||||
}
|
}
|
||||||
|
|||||||
1
src/common/assets/iconfont/iconfont.js
Normal file
1
src/common/assets/iconfont/iconfont.js
Normal file
File diff suppressed because one or more lines are too long
93
src/common/assets/iconfont/iconfont.json
Normal file
93
src/common/assets/iconfont/iconfont.json
Normal file
@ -0,0 +1,93 @@
|
|||||||
|
{
|
||||||
|
"id": "4963823",
|
||||||
|
"name": "no name",
|
||||||
|
"font_family": "iconfont",
|
||||||
|
"css_prefix_text": "",
|
||||||
|
"description": "",
|
||||||
|
"glyphs": [
|
||||||
|
{
|
||||||
|
"icon_id": "4479522",
|
||||||
|
"name": "所有",
|
||||||
|
"font_class": "suoyou",
|
||||||
|
"unicode": "e601",
|
||||||
|
"unicode_decimal": 58881
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "11831864",
|
||||||
|
"name": "紧急按钮",
|
||||||
|
"font_class": "jinjianniu",
|
||||||
|
"unicode": "e633",
|
||||||
|
"unicode_decimal": 58931
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "14789028",
|
||||||
|
"name": "我的已办",
|
||||||
|
"font_class": "wodeyiban",
|
||||||
|
"unicode": "e62d",
|
||||||
|
"unicode_decimal": 58925
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "26520584",
|
||||||
|
"name": "待办任务",
|
||||||
|
"font_class": "daibanrenwu",
|
||||||
|
"unicode": "e60d",
|
||||||
|
"unicode_decimal": 58893
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "6745171",
|
||||||
|
"name": "采矿",
|
||||||
|
"font_class": "caikuang",
|
||||||
|
"unicode": "e629",
|
||||||
|
"unicode_decimal": 58921
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "7134728",
|
||||||
|
"name": "给排水",
|
||||||
|
"font_class": "geipaishui",
|
||||||
|
"unicode": "e67d",
|
||||||
|
"unicode_decimal": 59005
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "11557367",
|
||||||
|
"name": "火车",
|
||||||
|
"font_class": "huoche",
|
||||||
|
"unicode": "e69c",
|
||||||
|
"unicode_decimal": 59036
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "13555639",
|
||||||
|
"name": "环卫部件管养计划",
|
||||||
|
"font_class": "huanweibujianguanyangjihua",
|
||||||
|
"unicode": "e657",
|
||||||
|
"unicode_decimal": 58967
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "44887238",
|
||||||
|
"name": "采矿",
|
||||||
|
"font_class": "a-icon-caikuangguanli",
|
||||||
|
"unicode": "e600",
|
||||||
|
"unicode_decimal": 58880
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "4546492",
|
||||||
|
"name": "weibo",
|
||||||
|
"font_class": "weibo1",
|
||||||
|
"unicode": "e636",
|
||||||
|
"unicode_decimal": 58934
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "599914",
|
||||||
|
"name": "QQ",
|
||||||
|
"font_class": "qq",
|
||||||
|
"unicode": "e66a",
|
||||||
|
"unicode_decimal": 58986
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "15933094",
|
||||||
|
"name": "微信",
|
||||||
|
"font_class": "weixin",
|
||||||
|
"unicode": "e607",
|
||||||
|
"unicode_decimal": 58887
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
BIN
src/common/assets/iconfont/iconfont.ttf
Normal file
BIN
src/common/assets/iconfont/iconfont.ttf
Normal file
Binary file not shown.
BIN
src/common/assets/iconfont/iconfont.woff
Normal file
BIN
src/common/assets/iconfont/iconfont.woff
Normal file
Binary file not shown.
BIN
src/common/assets/iconfont/iconfont.woff2
Normal file
BIN
src/common/assets/iconfont/iconfont.woff2
Normal file
Binary file not shown.
@ -1,20 +1,20 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
const VITE_APP_TITLE = import.meta.env.VITE_APP_TITLE
|
// const VITE_APP_TITLE = import.meta.env.VITE_APP_TITLE
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<footer class="layout-footer">
|
<!-- <footer class="layout-footer">
|
||||||
MIT © 2025-PRESENT {{ VITE_APP_TITLE }}
|
MIT © 2025-PRESENT {{ VITE_APP_TITLE }}
|
||||||
</footer>
|
</footer> -->
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.layout-footer {
|
// .layout-footer {
|
||||||
width: 100%;
|
// width: 100%;
|
||||||
min-height: 50px;
|
// min-height: 50px;
|
||||||
display: flex;
|
// display: flex;
|
||||||
align-items: center;
|
// align-items: center;
|
||||||
justify-content: center;
|
// justify-content: center;
|
||||||
color: var(--el-text-color-placeholder);
|
// color: var(--el-text-color-placeholder);
|
||||||
}
|
// }
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -111,8 +111,49 @@ export default {
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="home">
|
<div class="home">
|
||||||
<div class="card">1</div>
|
<div class="function-bar">
|
||||||
<div class="card">2</div>
|
<div class="one-box">
|
||||||
|
<div class="daiban-top"><i class="iconfont wodeyiban"></i></div>
|
||||||
|
<div
|
||||||
|
class="daiban-center"
|
||||||
|
style="font-size: 24px; font-weight: 700; margin: 20px"
|
||||||
|
>
|
||||||
|
12
|
||||||
|
</div>
|
||||||
|
<div class="daiban-bottom">待办事项</div>
|
||||||
|
</div>
|
||||||
|
<div class="two-box">
|
||||||
|
<div class="yiban-top"><i class="iconfont daibanrenwu"></i></div>
|
||||||
|
<div
|
||||||
|
class="yiban-center"
|
||||||
|
style="font-size: 24px; font-weight: 700; margin: 20px"
|
||||||
|
>
|
||||||
|
0
|
||||||
|
</div>
|
||||||
|
<div class="yiban-bottom">已办事项</div>
|
||||||
|
</div>
|
||||||
|
<div class="three-box">
|
||||||
|
<div class="jinji-top"><i class="iconfont jinjianniu"></i></div>
|
||||||
|
<div
|
||||||
|
class="jinji-center"
|
||||||
|
style="font-size: 24px; font-weight: 700; margin: 20px"
|
||||||
|
>
|
||||||
|
0
|
||||||
|
</div>
|
||||||
|
<div class="jinji-bottom">紧急事项</div>
|
||||||
|
</div>
|
||||||
|
<div class="four-box">
|
||||||
|
<div class="taskAll-top"><i class="iconfont suoyou"></i></div>
|
||||||
|
<div
|
||||||
|
class="taskAll-center"
|
||||||
|
style="font-size: 24px; font-weight: 700; margin: 20px"
|
||||||
|
>
|
||||||
|
0
|
||||||
|
</div>
|
||||||
|
<div class="taskAll-bottom">所有任务</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="echarts-bar">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
<div class="card-title">矿山生产总览</div>
|
<div class="card-title">矿山生产总览</div>
|
||||||
@ -126,25 +167,74 @@ export default {
|
|||||||
<div class="chart-container" ref="transportChart"></div>
|
<div class="chart-container" ref="transportChart"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
font-family: "Microsoft YaHei", Arial, sans-serif;
|
|
||||||
}
|
|
||||||
.home {
|
.home {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
.function-bar {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
height: 30%;
|
||||||
}
|
margin: 10px;
|
||||||
body {
|
i {
|
||||||
background-color: #f5f7fa;
|
font-size: 36px;
|
||||||
color: #333;
|
|
||||||
overflow-x: hidden;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.one-box,
|
||||||
|
.two-box,
|
||||||
|
.three-box,
|
||||||
|
.four-box {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 25%;
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
|
||||||
|
padding: 20px;
|
||||||
|
margin: 0 5px;
|
||||||
|
transition: all 0.3s;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.one-box {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
.four-box {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.echarts-bar {
|
||||||
|
display: flex;
|
||||||
|
height: 65%;
|
||||||
|
// /* 卡片样式 */
|
||||||
|
.card {
|
||||||
|
width: 50%;
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
|
||||||
|
padding: 20px;
|
||||||
|
margin: 0 5px;
|
||||||
|
transition: all 0.3s;
|
||||||
|
}
|
||||||
|
.card:hover {
|
||||||
|
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
.card-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #e0e0e0;
|
||||||
|
}
|
||||||
|
.card-title {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #1a237e;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
.container {
|
.container {
|
||||||
display: flex;
|
display: flex;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
@ -154,34 +244,6 @@ body {
|
|||||||
height: 300px;
|
height: 300px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 卡片样式 */
|
|
||||||
.card {
|
|
||||||
width: 48%;
|
|
||||||
background-color: white;
|
|
||||||
border-radius: 8px;
|
|
||||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
|
|
||||||
padding: 20px;
|
|
||||||
margin: 20px 10px;
|
|
||||||
transition: all 0.3s;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.card:hover {
|
|
||||||
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-header {
|
|
||||||
display: flex;
|
|
||||||
justify-content: between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
border-bottom: 1px solid #e0e0e0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-title {
|
|
||||||
font-size: 18px;
|
|
||||||
color: #1a237e;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -240,7 +240,7 @@ function updateCountdown() {
|
|||||||
}
|
}
|
||||||
//忘记密码
|
//忘记密码
|
||||||
function forgetPwd() {
|
function forgetPwd() {
|
||||||
forgetFormData.password = ''
|
forgetFormData.password = "";
|
||||||
isForgetPwd.value = true;
|
isForgetPwd.value = true;
|
||||||
}
|
}
|
||||||
watch(isDisabled, (newVal, oldVal) => {
|
watch(isDisabled, (newVal, oldVal) => {
|
||||||
@ -364,13 +364,13 @@ watch(isDisabled, (newVal, oldVal) => {
|
|||||||
</div>
|
</div>
|
||||||
<div class="iconAll" v-if="!isForgetPwd">
|
<div class="iconAll" v-if="!isForgetPwd">
|
||||||
<button>
|
<button>
|
||||||
<i class="iconfont icon-weixin"></i>
|
<i class="iconfont weixin"></i>
|
||||||
</button>
|
</button>
|
||||||
<button>
|
<button>
|
||||||
<i class="iconfont icon-qq"></i>
|
<i class="iconfont qq"></i>
|
||||||
</button>
|
</button>
|
||||||
<button>
|
<button>
|
||||||
<i class="iconfont icon-weibo1"></i>
|
<i class="iconfont weibo1"></i>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<el-form
|
<el-form
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user