移除废弃
This commit is contained in:
parent
e2cc292f11
commit
e877d8894a
@ -1,5 +0,0 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
'@vue/cli-plugin-babel/preset'
|
||||
]
|
||||
}
|
@ -1,19 +0,0 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"module": "esnext",
|
||||
"baseUrl": "./",
|
||||
"moduleResolution": "node",
|
||||
"paths": {
|
||||
"@/*": [
|
||||
"src/*"
|
||||
]
|
||||
},
|
||||
"lib": [
|
||||
"esnext",
|
||||
"dom",
|
||||
"dom.iterable",
|
||||
"scripthost"
|
||||
]
|
||||
}
|
||||
}
|
12150
package-lock.json
generated
12150
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
Binary file not shown.
Before Width: | Height: | Size: 4.2 KiB |
@ -1,17 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
65
src/App.vue
65
src/App.vue
@ -1,65 +0,0 @@
|
||||
<template>
|
||||
<div class="mx-auto bg-blue-600 max-w-86 relative">
|
||||
<header class="p-4 pt-12">
|
||||
<div class="flex flex-row">
|
||||
<div class="flex-1">
|
||||
<span class="font-sans text-xs text-gray-300">DemoDemo {{ activeArticle.id }}</span>
|
||||
<h1 class="font-bold text-white">Demo Demo</h1>
|
||||
</div>
|
||||
<div class="bg-white rounded-full flex bg-opacity-15 h-9 w-9 items-center justify-center">
|
||||
<div class="border-light-200 border-1 h-3 w-3 relative">
|
||||
<div class="rounded-full bg-yellow-400 h-2 -top-1 -right-1 w-2 absolute"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-6">
|
||||
<ul class="bg-white rounded-xl flex bg-opacity-20 mx-10 text-white text-xs justify-around overflow-hidden">
|
||||
<li v-for="item in navbar.list" :key="item" class="rounded-md cursor-pointer bg-opacity-30 py-2 px-4"
|
||||
:class="{ 'bg-white': item === navbar.active }" @click="navbar.setPage(item)">
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<PageHome v-if="navbar.active === '主页'" v-model:id=activeArticle.id />
|
||||
<PageQiye v-if="navbar.active === '企业'" />
|
||||
<PageFile v-if="navbar.active === '文件'" />
|
||||
<PageWeibo v-if="navbar.active === '微博'" />
|
||||
<PageArticle v-if="activeArticle.id !== 0" class="top-0 right-0 bottom-0 left-0 absolute" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive } from "vue"
|
||||
import PageHome from "./components/PageHome.vue"
|
||||
import PageFile from "./components/PageFile.vue"
|
||||
import PageWeibo from "./components/PageWeibo.vue"
|
||||
import PageQiye from "./components/PageQiye.vue"
|
||||
import PageArticle from "./components/PageArticle.vue"
|
||||
|
||||
const activeArticle = reactive({
|
||||
id: 0
|
||||
})
|
||||
|
||||
const navbar = reactive({
|
||||
list: ['主页', '企业', '文件', '微博'],
|
||||
active: '主页',
|
||||
setPage: name => {
|
||||
console.log("active:", name)
|
||||
navbar.active = name
|
||||
}
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#app {
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
color: #2c3e50;
|
||||
background: #fafafa;
|
||||
padding: 2rem;
|
||||
}
|
||||
</style>
|
Binary file not shown.
Before Width: | Height: | Size: 6.7 KiB |
@ -1,28 +0,0 @@
|
||||
<template lang="pug">
|
||||
main(class="bg-blue-500")
|
||||
div(class="flex items-center justify-between p-4 text-white")
|
||||
i.pi.pi-chevron-left
|
||||
div(class="rounded-t-2xl bg-white py-3 px-2 pb-16 mt-1 pb-120")
|
||||
div.flex.mb-2(class="items-center p-4")
|
||||
i.pi.pi-star.mr-2.text-yellow-400
|
||||
span(class="font-bold") 文章标题
|
||||
div.px-4
|
||||
p.my-2 xxx xxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx xxx xxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx
|
||||
div(class="h-32 bg-blue-600 text-white rounded-md")
|
||||
p.my-2 xxx xxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx xxx xxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx
|
||||
|
||||
span(class="font-sans text-gray-300 text-xs") 佚名
|
||||
span(class="font-sans text-gray-300 text-xs ml-2") 2024-12-02
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const data = [
|
||||
{ name: '1.file_name.zip', size: 12 },
|
||||
{ name: '2.file_name.zip', size: 12 },
|
||||
{ name: '3.file_name.zip', size: 12 },
|
||||
{ name: '4.file_name.zip', size: 12 },
|
||||
{ name: '5.file_name.zip', size: 12 },
|
||||
{ name: '6.file_name.zip', size: 12 },
|
||||
]
|
||||
</script>
|
@ -1,32 +0,0 @@
|
||||
<template lang="pug">
|
||||
div(class="rounded-t-2xl bg-white py-3 px-2 pb-16 mt-6")
|
||||
div.flex.mb-2
|
||||
div.flex-1
|
||||
//span(class="text-gray-400 font-bold") File download
|
||||
div.flex
|
||||
div(class="rounded-md flex p-1 px-4")
|
||||
i.pi.pi-list
|
||||
ul(class="flex flex-col gap-3")
|
||||
li(v-for="(item, index) in data" :key="index" class="bg-white rounded-md flex shadow-lg py-2 px-4 shadow-gray-100")
|
||||
div(class="flex gap-2 w-12 items-center")
|
||||
div(class="w-8 h-8 bg-blue-500 rounded-xl text-white flex items-center justify-center")
|
||||
i.pi.pi-file
|
||||
div(class="flex gap-2 flex-1 flex-col")
|
||||
div.flex.gap-2.items-center.text-gray-500.text-md
|
||||
span.flex-1 {{ item.name }}
|
||||
span.font-sans.text-gray-400.text-sm 1.25MB
|
||||
span(class="font-sans text-gray-300 text-xs") 2024-12-02
|
||||
div(class="font-sans text-xs text-gray-300 flex items-center justify-center py-6")
|
||||
span 没有更多了..
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const data = [
|
||||
{ name: '1.file_name.zip', size: 12 },
|
||||
{ name: '2.file_name.zip', size: 12 },
|
||||
{ name: '3.file_name.zip', size: 12 },
|
||||
{ name: '4.file_name.zip', size: 12 },
|
||||
{ name: '5.file_name.zip', size: 12 },
|
||||
{ name: '6.file_name.zip', size: 12 },
|
||||
]
|
||||
</script>
|
@ -1,111 +0,0 @@
|
||||
<template lang="pug">
|
||||
main(class="bg-white rounded-t-xl mt-17 p-4 pt-38 shadow-gray-200 relative")
|
||||
// 功能导航
|
||||
div(class="bg-white rounded-xl shadow-md mt-6 p-6 -top-22 shadow-gray-200 w-78 absolute")
|
||||
div(class="flex flex-row gap-1")
|
||||
div(class="flex flex-col gap-1" v-for="item in 22" :key="item")
|
||||
div.bg-blue-500.w-2.h-2(:style="{opacity: opacity()}" v-for="x in 7" :key="x")
|
||||
ul(class="flex flex-wrap mt-3 gap-2 justify-around")
|
||||
li(v-for="item in 功能" :key="item.name" class="flex flex-col justify-center items-center")
|
||||
div(class="rounded-xl bg-blue-500 h-8 w-8 flex justify-center items-center text-white")
|
||||
i.pi.pi-box
|
||||
span(class="font-sans text-xs mt-1") {{ item.name }}
|
||||
// 任务列表
|
||||
button(@click="任务.stretch = !任务.stretch") 展开列表
|
||||
div(class="bg-white rounded-md shadow-md mt-6 p-6 shadow-gray-200" v-for="item in 任务.list" :key="item.id")
|
||||
div(class="flex flex-row flex-nowrap")
|
||||
div(class="font-bold flex-1 text-sm") {{ item.name }}
|
||||
div(:class="{ expanded: 任务.stretch }" v-show="任务.stretch" class="transition transition-all ease-out duration-700 box")
|
||||
p 任务描述
|
||||
|
||||
div(class="font-sans text-xs text-gray-300 flex items-center justify-center py-6")
|
||||
span 没有更多了..
|
||||
PageArticle(v-if="article.show")
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.box {
|
||||
transform: scaleY(0);
|
||||
transform-origin: top;
|
||||
transition: transform 0.5s ease;
|
||||
overflow: hidden;
|
||||
background-color: #f9f9f9;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.box.expanded {
|
||||
transform: scaleY(1);
|
||||
}
|
||||
</style>
|
||||
|
||||
<script setup>
|
||||
import { reactive, defineProps, defineEmits } from "vue"
|
||||
|
||||
const prop = defineProps({
|
||||
id: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:id'])
|
||||
const click = () => {
|
||||
emit('update:id', 123) //代表是将num值修改为123
|
||||
}
|
||||
|
||||
|
||||
const 任务 = reactive({
|
||||
stretch: true,
|
||||
list: [
|
||||
{ id: 1, name: '添加某功能' },
|
||||
{ id: 2, name: '处理某bug' },
|
||||
{ id: 3, name: '处理某bug' },
|
||||
{ id: 3, name: '提供某数据' },
|
||||
]
|
||||
})
|
||||
|
||||
|
||||
const article = reactive({
|
||||
show: true,
|
||||
id: 1,
|
||||
name: "这是一篇文章",
|
||||
date: "3分钟前",
|
||||
})
|
||||
|
||||
const 功能 = [
|
||||
{ name: "待办", count: 1 },
|
||||
{ name: "邮件", count: 1 },
|
||||
{ name: "抄送", count: 1 },
|
||||
{ name: "发起", count: 1 },
|
||||
]
|
||||
|
||||
const opacity = () => Math.floor(Math.random() * 10 + 1) / 10
|
||||
|
||||
const 会议 = [
|
||||
{ name: "1会议目标", status: "会议通知", time: "7月19日", date: "3分钟前" },
|
||||
{ name: "2会议目标", status: "会议通知", time: "7月18日", date: "2小时前" },
|
||||
{ name: "3会议目标", status: "会议通知", time: "今天下午", date: "昨天" },
|
||||
{ name: "4会议总结", status: "会议记录", time: "07月14日", date: "3月11日" },
|
||||
{ name: "5会议总结", status: "会议记录", time: "07月14日", date: "12月12日" },
|
||||
{ name: "6会议总结", status: "会议记录", time: "07月14日", date: "2023年12月" },
|
||||
{ name: "7会议总结", status: "会议记录", time: "07月14日", date: "2023年12月" },
|
||||
{ name: "8会议总结", status: "会议记录", time: "07月14日", date: "2023年12月" },
|
||||
]
|
||||
|
||||
const data = {
|
||||
list: [
|
||||
{ name: "通报栏" },
|
||||
{ name: "合同到期提醒" },
|
||||
],
|
||||
articles: [
|
||||
{ name: "1这是一篇文章", date: "3分钟前" },
|
||||
{ name: "2这是一篇文章", date: "2小时前" },
|
||||
{ name: "3这是一篇文章", date: "昨天" },
|
||||
{ name: "4这是一篇文章", date: "3月11日" },
|
||||
{ name: "5这是一篇文章", date: "12月12日" },
|
||||
{ name: "6这是一篇文章", date: "2023年12月" },
|
||||
{ name: "7这是一篇文章", date: "2023年12月" },
|
||||
{ name: "8这是一篇文章", date: "2023年12月" },
|
||||
],
|
||||
}
|
||||
</script>
|
@ -1,58 +0,0 @@
|
||||
<template lang="pug">
|
||||
main(class="bg-white rounded-t-xl mt-6 p-4 pt-4 shadow-gray-200 relative")
|
||||
div(class="rounded-md shadow-md mt-6 p-6 shadow-gray-200")
|
||||
div(class="mb-2")
|
||||
ul(class="flex flex-row flex-nowrap gap-2 bg-blue-500 bg-opacity-20 rounded-md justify-around")
|
||||
li(
|
||||
v-for="item in data" :key="item.name"
|
||||
class="rounded-md cursor-pointer font-sans text-sm py-2 px-3"
|
||||
:class="{'bg-blue-500': item.name === '企业简介', 'text-white': item.name === '企业简介'}"
|
||||
) {{ item.name }}
|
||||
div
|
||||
ul
|
||||
li(v-for="article in articles" :key="article.name")
|
||||
span(class="font-sans text-sm mr-2") {{ article.name }}
|
||||
time(:datetime="article.date" class="font-sans text-xs text-gray-300") {{ article.date }}
|
||||
div(class="flex flex-row flex-nowrap justify-between items-center")
|
||||
div(class="flex flex-row flex-nowrap gap-2")
|
||||
// 各项列表
|
||||
div.rounded-md.shadow-md.mt-6.p-6.shadow-gray-200(v-for="item in list" :key="item.name")
|
||||
div.flex.flex-row.flex-nowrap
|
||||
div.flex-1.font-bold.text-sm {{ item.name }}
|
||||
div.text-xs 查看更多
|
||||
div
|
||||
ul
|
||||
li(v-for="article in articles" :key="article.name")
|
||||
span.text-sm {{ article.name }}
|
||||
time.font-sans.text-xs.text-gray-300.ml-1(:datetime="article.date") {{ article.date }}
|
||||
div(class="font-sans text-xs text-gray-300 flex items-center justify-center py-6")
|
||||
span 没有更多了..
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const data = [
|
||||
{ name: "企业简介" },
|
||||
{ name: "企业资质" },
|
||||
{ name: "发展历程" },
|
||||
]
|
||||
|
||||
const list = [
|
||||
{ name: "新闻中心" },
|
||||
{ name: "董监高专栏" },
|
||||
{ name: "海红语录" },
|
||||
{ name: "海红公益" },
|
||||
{ name: "通知通报" },
|
||||
{ name: "员工天地" },
|
||||
]
|
||||
|
||||
const articles = [
|
||||
{ name: "1这是一篇文章", date: "3分钟前" },
|
||||
{ name: "2这是一篇文章", date: "2小时前" },
|
||||
{ name: "3这是一篇文章", date: "昨天" },
|
||||
{ name: "4这是一篇文章", date: "3月11日" },
|
||||
{ name: "5这是一篇文章", date: "12月12日" },
|
||||
{ name: "6这是一篇文章", date: "2023年12月" },
|
||||
{ name: "7这是一篇文章", date: "2023年12月" },
|
||||
{ name: "8这是一篇文章", date: "2023年12月" },
|
||||
]
|
||||
</script>
|
@ -1,42 +0,0 @@
|
||||
<template lang="pug">
|
||||
main(class="bg-white rounded-t-xl mt-6 p-4 pt-4 shadow-gray-200 relative")
|
||||
div.rounded-xl.overflow-hidden.relative
|
||||
textarea(cols="30", rows="3", class="rounded-xl bg-gray-100 border-0 tracking-wide w-full text-2xl placeholder:text-gray-400 focus:outline-none focus:ring-0")
|
||||
button(class="bg-blue-500 rounded-md text-white px-2 py-1 text-sm absolute bottom-4 right-2") Submit
|
||||
div.pt-2
|
||||
div.flex.flex-row-reverse
|
||||
div(class="rounded-md flex p-1 px-4")
|
||||
i.pi.pi-list
|
||||
ul(class="flex gap-3 flex-col py-4")
|
||||
li(v-for="item in data" :key="item.id" class="bg-white rounded-xl flex shadow-lg p-2 shadow-gray-100")
|
||||
div(class="flex justify-center")
|
||||
div(class="bg-blue-500 w-8 h-8 rounded-full mt-2")
|
||||
div(class="flex flex-col ml-2")
|
||||
div
|
||||
span(class="text-gray-500") user_name
|
||||
span(class="text-gray-400 text-sm ml-2") 2 hours ago
|
||||
div
|
||||
p(class="text-gray-500") xxxxxxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxx xxxxxxxxxxxxxx xxxx
|
||||
div(class="font-sans text-xs text-gray-300 flex items-center justify-center py-6")
|
||||
span 没有更多了..
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'All',
|
||||
active: true
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Active',
|
||||
active: false
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Completed',
|
||||
active: false
|
||||
}
|
||||
]
|
||||
</script>
|
@ -1,6 +0,0 @@
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
import 'primeicons/primeicons.css'
|
||||
import 'windi.css'
|
||||
|
||||
createApp(App).mount('#app')
|
9
vite.config.js
Normal file
9
vite.config.js
Normal file
@ -0,0 +1,9 @@
|
||||
export default {
|
||||
build: {
|
||||
minify: 'terser',
|
||||
terserOptions: {
|
||||
compress: false, // 禁用源码压缩
|
||||
mangle: false, // 禁用变量名压缩
|
||||
}
|
||||
}
|
||||
}
|
@ -1,13 +0,0 @@
|
||||
export default {
|
||||
build: {
|
||||
minify: 'terser', // 启用 Terser 压缩
|
||||
terserOptions: {
|
||||
compress: {
|
||||
keep_fnames: true // 禁用压缩对象名
|
||||
},
|
||||
output: {
|
||||
beautify: true // 保留对象名
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user