cao
This commit is contained in:
parent
cffcd0014e
commit
5e530a1a90
File diff suppressed because it is too large
Load Diff
|
|
@ -9,10 +9,15 @@
|
|||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"vue": "^3.3.8"
|
||||
"@dataview/datav-vue3": "^0.0.0-test.1672506674342",
|
||||
"echarts": "^5.4.3",
|
||||
"vue": "^3.3.8",
|
||||
"vue-router": "^4.2.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "^4.5.0",
|
||||
"sass": "^1.69.5",
|
||||
"sass-loader": "^13.3.2",
|
||||
"vite": "^5.0.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
30
src/App.vue
30
src/App.vue
|
|
@ -1,30 +1,12 @@
|
|||
<script setup>
|
||||
import HelloWorld from './components/HelloWorld.vue'
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<a href="https://vitejs.dev" target="_blank">
|
||||
<img src="/vite.svg" class="logo" alt="Vite logo" />
|
||||
</a>
|
||||
<a href="https://vuejs.org/" target="_blank">
|
||||
<img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
|
||||
</a>
|
||||
</div>
|
||||
<HelloWorld msg="Vite + Vue" />
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.logo {
|
||||
height: 6em;
|
||||
padding: 1.5em;
|
||||
will-change: filter;
|
||||
transition: filter 300ms;
|
||||
}
|
||||
.logo:hover {
|
||||
filter: drop-shadow(0 0 2em #646cffaa);
|
||||
}
|
||||
.logo.vue:hover {
|
||||
filter: drop-shadow(0 0 2em #42b883aa);
|
||||
<style lang="scss">
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
defineProps({
|
||||
msg: String,
|
||||
})
|
||||
|
||||
const count = ref(0)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<h1>{{ msg }}</h1>
|
||||
|
||||
<div class="card">
|
||||
<button type="button" @click="count++">count is {{ count }}</button>
|
||||
<p>
|
||||
Edit
|
||||
<code>components/HelloWorld.vue</code> to test HMR
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
Check out
|
||||
<a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
|
||||
>create-vue</a
|
||||
>, the official Vue + Vite starter
|
||||
</p>
|
||||
<p>
|
||||
Install
|
||||
<a href="https://github.com/vuejs/language-tools" target="_blank">Volar</a>
|
||||
in your IDE for a better DX
|
||||
</p>
|
||||
<p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.read-the-docs {
|
||||
color: #888;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
<div style="background-color: red; height: 100px; width: 750px;">
|
||||
sadsasdfsdf
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
</script>
|
||||
|
|
@ -1,5 +1,10 @@
|
|||
import { createApp } from 'vue'
|
||||
import './style.css'
|
||||
// import './style.css'
|
||||
import App from './App.vue'
|
||||
|
||||
createApp(App).mount('#app')
|
||||
// import DataV, { setClassNamePrefix } from '@dataview/datav-vue3';
|
||||
import router from "./router";
|
||||
|
||||
const app=createApp(App)
|
||||
app.use(router)
|
||||
app.mount('#app')
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
|
||||
const routes= [
|
||||
{
|
||||
path: '/',
|
||||
name: 'index',
|
||||
component:()=>import('@/view/index.vue'),
|
||||
},
|
||||
// {
|
||||
// path: '/a',
|
||||
// name: 'indesx',
|
||||
// component:()=>import('@/components/header.vue'),
|
||||
// },
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(),
|
||||
routes
|
||||
})
|
||||
|
||||
export default router
|
||||
|
|
@ -61,7 +61,7 @@ button:focus-visible {
|
|||
#app {
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
|
@ -77,3 +77,7 @@ button:focus-visible {
|
|||
background-color: #f9f9f9;
|
||||
}
|
||||
}
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,86 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="header">
|
||||
<div class="logo"></div>
|
||||
<div class="tab">
|
||||
<div class="tab-li">首 页</div>
|
||||
<div class="tab-li">商 品</div>
|
||||
<div class="tab-li">商 户</div>
|
||||
<div class="tab-li">订 单</div>
|
||||
<div class="tab-li">财 务</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="right">
|
||||
<div class="rigth-li">泸县</div>
|
||||
<div class="rigth-li">15:39:25</div>
|
||||
<div class="rigth-li">2023.01.20</div>
|
||||
<div class="rigth-li">关机</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
||||
import { onMounted } from 'vue';
|
||||
import { BorderBox1 } from '@dataview/datav-vue3';
|
||||
import * as echarts from 'echarts';
|
||||
import header from "@/components/header.vue"
|
||||
// alert(5454)
|
||||
console.log(header)
|
||||
onMounted(() => {
|
||||
|
||||
})
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.box {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: #000C14;
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
color: #B0C7D1;
|
||||
height: 40px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.logo {
|
||||
width: 20vw;
|
||||
background-color: red;
|
||||
margin-right: 30px;
|
||||
height: 40px;
|
||||
align-items: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.tab {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.tab-li {
|
||||
width: 120px;
|
||||
background-color: #002641;
|
||||
text-align: center;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
margin: 0 10px;
|
||||
color: white;
|
||||
text-shadow: 0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 10px white; //设置发光效果
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
font-size: 15px;
|
||||
margin-right: 30px;
|
||||
align-items: center;
|
||||
|
||||
.rigth-li {
|
||||
margin-right: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,10 +1,18 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import path from 'path'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [vue()],
|
||||
server: { // ← ← ← ← ← ←
|
||||
host: '0.0.0.0' // ← 新增内容 ←
|
||||
},
|
||||
resolve:{
|
||||
//别名配置，引用src路径下的东西可以通过@如：import Layout from '@/layout/index.vue'
|
||||
alias: {
|
||||
'@': path.resolve(__dirname, 'src')
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue