0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style: 样式调整

This commit is contained in:
xieyonghong 2023-04-13 16:42:27 +08:00
parent 3f1e9f4980
commit f70b2c78ce
31 changed files with 171 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -64,6 +64,7 @@
"typescript": "^4.9.3",
"vite": "^4.0.0",
"vite-plugin-html": "^3.2.0",
"vite-plugin-progress": "^0.0.7",
"vite-plugin-style-import": "^2.0.0",
"vite-plugin-vue-setup-extend": "^0.4.0",
"vue-tsc": "^1.0.11"

BIN
public/images/device-access.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
public/images/device-gateway.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.1 KiB

After

Width:  |  Height:  |  Size: 4.3 KiB

BIN
public/images/device-media.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
public/images/device-product.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 5.1 KiB

BIN
public/images/device-type-3-big.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 4.1 KiB

BIN
public/images/network.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 4.5 KiB

BIN
public/images/protocol.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.8 KiB

After

Width:  |  Height:  |  Size: 4.4 KiB

BIN
public/images/scene/trigger-type/device.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.8 KiB

After

Width:  |  Height:  |  Size: 4.7 KiB

BIN
public/images/scene/trigger-type/scene.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.7 KiB

After

Width:  |  Height:  |  Size: 4.0 KiB

BIN
public/images/stream.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.0 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

12
src/components/CardBox/index.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="card">
<div class="card j-table-card-box">
<div
class="card-warp"
:class="{ active: active ? 'active' : '' }"
@ -225,11 +225,13 @@ const handleClick = () => {
.card-content {
position: relative;
padding: 30px 12px 16px 30px;
padding: 30px 12px 30px 30px;
overflow: hidden;
.card-item-avatar {
margin-right: 16px;
display: flex;
align-items: center;
}
.card-item-body {
@ -237,6 +239,10 @@ const handleClick = () => {
flex-direction: column;
flex-grow: 1;
width: 0;
.ant-row{
margin-top: 19px;
}
}
.card-state {
@ -285,7 +291,7 @@ const handleClick = () => {
}
:deep(.card-item-content-text) {
color: rgba(0, 0, 0, 0.75);
color: rgba(0, 0, 0, 0.7);
font-size: 12px;
}
}

1
src/components/Layout/BasicLayoutPage.vue
View File

@ -4,6 +4,7 @@
v-model:openKeys="state.openKeys"
v-model:collapsed="state.collapsed"
v-model:selectedKeys="state.selectedKeys"
:headerHeight='60'
:pure="state.pure"
:breadcrumb="{ routes: breadcrumb }"
@backClick='routerBack'

1
src/components/Search/Search.vue
View File

@ -7,6 +7,7 @@
:deleteRequest='deleteSearchHistory'
:columns='columns'
:class='props.class'
style='padding-top: 18px; padding-bottom: 18px;'
@search='searchSubmit'
/>
</template>

91
src/style.less
View File

@ -3,6 +3,97 @@
right: -12px;
}
.ant-pro-page-container {
.ant-page-header-footer {
border-top: 1px solid #e9e9e9;
padding-top: 10px;
}
}
.ant-pro-basicLayout {
.ant-pro-top-nav-header-main {
gap: 16px;
}
.ant-pro-top-nav-header {
.ant-menu-item {
padding: 0 10px !important;
&:not(:first-child) {
margin-left: 8px;
}
&:hover {
background-color: transparent;
}
}
.ant-menu-item-selected,& .ant-menu-item-active {
transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
h1,& .right-content, & .anticon-bell {
color: #fff;
}
& .ant-pro-menu-item-title,& .anticon,& .ant-menu-item-active {
color: rgba(#fff, 0.55);
}
.ant-menu-item-selected {
& .ant-pro-menu-item-title,& .anticon {
color: #fff;
}
}
.ant-menu-item-selected,& .ant-menu-item-active {
transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
background: linear-gradient(0deg, rgba(#fff, 0.25) 0%, rgba(#fff, 0) 82%);
&::after {
left: 0;
right: 0;
border-bottom-color: rgba(#fff, .8);
}
}
&.light {
background: #3F4960;
box-shadow: 0 1px 0px 0px #E9E9E9;
h1,& .right-content, & .anticon-bell {
color: #fff;
}
.ant-menu-item-selected,& .ant-menu-item-active {
transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
background: linear-gradient(0deg, rgba(#fff, 0.15) 0%, rgba(#fff, 0) 82%);
&::after {
left: 0;
right: 0;
border-bottom-color: rgba(#fff, .7);
}
}
}
}
.ant-layout-sider {
box-shadow: 1px 0 0 0 #E9E9E9 !important;
}
.ant-page-header.has-breadcrumb {
background: transparent;
padding-top: 20px;
padding-bottom: 0;
}
.ant-pro-page-container-children-content {
margin-top: 16px;
}
.ant-pro-sider-menu {
padding-top: 6px;
}
}
// 说明文档样式
.doc {
height: 750px;

6
src/views/device/Instance/Detail/Info/index.vue
View File

@ -17,9 +17,9 @@
<j-descriptions-item label="产品名称">{{
instanceStore.current?.productName
}}</j-descriptions-item>
<j-descriptions-item label="产品分类">{{
instanceStore.current?.classifiedName
}}</j-descriptions-item>
<!-- <j-descriptions-item label="产品分类">{{-->
<!-- instanceStore.current?.classifiedName-->
<!-- }}</j-descriptions-item>-->
<j-descriptions-item label="设备类型">{{
instanceStore.current?.deviceType?.text
}}</j-descriptions-item>

8
src/views/device/Instance/index.vue
View File

@ -164,8 +164,8 @@
>
<template #img>
<img
:width="88"
:height="88"
:width="80"
:height="80"
:src="
slotProps?.photoUrl ||
getImage('/device/instance/device-card.png')
@ -173,12 +173,12 @@
/>
</template>
<template #content>
<Ellipsis style="width: calc(100% - 100px)">
<Ellipsis style="width: calc(100% - 100px); margin-bottom: 18px;">
<span style="font-size: 16px; font-weight: 600">
{{ slotProps.name }}
</span>
</Ellipsis>
<j-row style="margin-top: 20px">
<j-row>
<j-col :span="12">
<div class="card-item-content-text">
设备类型

6
src/views/device/Product/index.vue
View File

@ -69,7 +69,7 @@
</slot>
</template>
<template #content>
<Ellipsis style="width: calc(100% - 100px)"
<Ellipsis style="width: calc(100% - 100px); margin-bottom: 18px;"
><span
style="font-weight: 600; font-size: 16px"
>
@ -621,8 +621,8 @@ onMounted(() => {
background: #f0f2f5;
}
.productImg {
width: 88px;
height: 88px;
width: 80px;
height: 80px;
}
.productName {
white-space: nowrap; /*强制在同一行内显示所有文本，直到文本结束或者遭遇br标签对象才换行。*/

2
src/views/edge/Device/index.vue
View File

@ -68,7 +68,7 @@
{{ slotProps.name }}
</span>
</Ellipsis>
<j-row style="margin-top: 20px">
<j-row style="margin-top: 18px">
<j-col :span="12">
<div class="card-item-content-text">
设备类型

2
src/views/edge/Resource/index.vue
View File

@ -38,7 +38,7 @@
{{ slotProps.name }}
</span>
</Ellipsis>
<j-row style="margin-top: 20px">
<j-row style="margin-top: 18px">
<j-col :span="12">
<div class="card-item-content-text">
通讯协议

2
src/views/iot-card/Platform/index.vue
View File

@ -27,7 +27,7 @@
</slot>
</template>
<template #content>
<h3 style='font-size: 16px;width: calc(100% - 90px)'>
<h3 style='font-size: 16px;width: calc(100% - 90px); margin-bottom: 18px;'>
<Ellipsis>
{{ slotProps.name }}
</Ellipsis>

5
src/views/link/Protocol/index.vue
View File

@ -43,10 +43,7 @@
<template #content>
<div class="card-item-content">
<Ellipsis
style="
width: calc(100% - 100px);
margin-bottom: 10px;
"
style="margin-bottom: 18px;"
>
<span
style="

2
src/views/rule-engine/Alarm/Configuration/index.vue
View File

@ -78,7 +78,7 @@
<div class="content-des-title">
关联场景联动
</div>
<Ellipsis
<Ellipsis style='margin-bottom: 18px;'
><div>
{{ (slotProps?.scene || []).map((item: any) => item?.name).join(',') || '' }}
</div></Ellipsis

2
src/views/rule-engine/Alarm/Log/TabComponent/indev.vue
View File

@ -60,7 +60,7 @@
/>
</template>
<template #content>
<Ellipsis style="width: calc(100% - 100px)">
<Ellipsis style="width: calc(100% - 100px);">
<span style="font-weight: 500">
{{ slotProps.alarmName }}
</span>

4
src/views/rule-engine/Instance/index.vue
View File

@ -46,12 +46,12 @@
<template #img>
<slot name="img">
<img
:src="getImage('/device-product.png')"
:src="getImage('/scene/trigger-type/scene.png')"
/>
</slot>
</template>
<template #content>
<Ellipsis style="width: calc(100% - 100px)">
<Ellipsis style="width: calc(100% - 100px); margin-bottom: 18px;">
<span
style="
font-weight: 600;

4
src/views/rule-engine/Scene/index.vue
View File

@ -61,7 +61,7 @@
<span class='subTitle-content'>
<Ellipsis :lineClamp="2">
{{
slotProps?.description ||
slotProps?.description ? slotProps?.description :
typeMap.get(slotProps.triggerType)?.tip
}}
</Ellipsis>
@ -388,7 +388,7 @@ const handleView = (id: string, triggerType: string) => {
<style scoped lang='less'>
.subTitle {
position: relative;
margin-top: 10px;
margin-top: 18px;
.subTitle-title {
position: absolute;

5
src/views/system/Department/components/AddDeviceOrProductDialog.vue
View File

@ -70,8 +70,11 @@
</slot>
</template>
<template #content>
<h3 class="card-item-content-title">
<h3 class="card-item-content-title" style='margin-bottom: 18px;'>
<Ellipsis style="width: calc(100% - 100px);"
>
{{ slotProps.name }}
</Ellipsis>
</h3>
<j-row>
<j-col :span="12">

5
src/views/system/Department/device/index.vue
View File

@ -87,8 +87,11 @@
</slot>
</template>
<template #content>
<h3 class="card-item-content-title">
<h3 class="card-item-content-title" style='margin-bottom: 18px;'>
<Ellipsis style="width: calc(100% - 100px);"
>
{{ slotProps.name }}
</Ellipsis>
</h3>
<j-row>
<j-col :span="12">

5
src/views/system/Department/product/index.vue
View File

@ -86,8 +86,11 @@
</slot>
</template>
<template #content>
<h3 class="card-item-content-title">
<h3 class="card-item-content-title" style='margin-bottom: 18px;'>
<Ellipsis style="width: calc(100% - 100px);"
>
{{ slotProps.name }}
</Ellipsis>
</h3>
<j-row>
<j-col :span="12">

4
vite.config.ts
View File

@ -14,6 +14,7 @@ import monacoEditorPlugin from 'vite-plugin-monaco-editor';
import { JetlinksVueResolver } from './plugin/jetlinks'
import { optimizeDeps } from './plugin/optimize'
import copy from 'rollup-plugin-copy';
import progress from 'vite-plugin-progress'
// https://vitejs.dev/config/
export default defineConfig(({ mode}) => {
@ -83,7 +84,8 @@ export default defineConfig(({ mode}) => {
targets: [
{src: 'node_modules/@liveqing/liveplayer-v3/dist/component/liveplayer-lib.min.js', dest: 'public/js'},
]
})
}),
progress()
],
server: {
host:'0.0.0.0',

33
yarn.lock
View File

@ -986,6 +986,11 @@
resolved "https://registry.npmjs.org/@types/node/-/node-18.14.0.tgz"
integrity sha512-5EWrvLmglK+imbCJY0+INViFWUHg1AHel1sq4ZVSfdcNqGy9Edv3UB9IIzzg+xPaUcAgZYcfVs2fBcwDeZzU0A==
"@types/node@^10.3.6":
version "10.17.60"
resolved "http://registry.jetlinks.cn/@types%2fnode/-/node-10.17.60.tgz#35f3d6213daed95da7f0f73e75bcc6980e90597b"
integrity sha512-F0KIgDJfy2nA3zMLmWGKxcH2ZVEtCZXHHdOQs2gSaQ27+lNeEfGxzkIw90aXswATX7AZ33tahPbzy6KAfUreVw==
"@types/normalize-package-data@^2.4.0":
version "2.4.1"
resolved "https://registry.npmmirror.com/@types/normalize-package-data/-/normalize-package-data-2.4.1.tgz"
@ -5413,6 +5418,11 @@ process@^0.11.10:
resolved "https://registry.jetlinks.cn/process/-/process-0.11.10.tgz"
integrity sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==
progress@^2.0.3:
version "2.0.3"
resolved "http://registry.jetlinks.cn/progress/-/progress-2.0.3.tgz#7e8cf8d8f5b8f239c1bc68beb4eb78567d572ef8"
integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==
promise-all-reject-late@^1.0.0:
version "1.0.1"
resolved "https://registry.jetlinks.cn/promise-all-reject-late/-/promise-all-reject-late-1.0.1.tgz"
@ -5525,6 +5535,13 @@ rc@1.2.8, rc@^1.0.1, rc@^1.1.6, rc@^1.2.1, rc@^1.2.8:
minimist "^1.2.0"
strip-json-comments "~2.0.1"
rd@^2.0.1:
version "2.0.1"
resolved "http://registry.jetlinks.cn/rd/-/rd-2.0.1.tgz#e18a8af5b2f7440c0db1523ca04c6e0f9660003f"
integrity sha512-/XdKU4UazUZTXFmI0dpABt8jSXPWcEyaGdk340KdHnsEOdkTctlX23aAK7ChQDn39YGNlAJr1M5uvaKt4QnpNw==
dependencies:
"@types/node" "^10.3.6"
read-cmd-shim@^2.0.0:
version "2.0.0"
resolved "http://47.108.170.157:9013/read-cmd-shim/-/read-cmd-shim-2.0.0.tgz#4a50a71d6f0965364938e9038476f7eede3928d9"
@ -6402,6 +6419,13 @@ tough-cookie@~2.5.0:
psl "^1.1.28"
punycode "^2.1.1"
treer@^1.0.4:
version "1.0.4"
resolved "http://registry.jetlinks.cn/treer/-/treer-1.0.4.tgz#3b5ff47baec11c97476b8b7712da71cf459d52a3"
integrity sha512-Q2oAOOxzGYq+/KoKT1bZSSwDL4Y4WYukjiYBAn6GrNlt1xKKf5JS216dsSzkPDoYTHA9CXdbYkehUG7F1JT+5A==
dependencies:
commander "^2.9.0"
treeverse@^1.0.4:
version "1.0.4"
resolved "http://47.108.170.157:9013/treeverse/-/treeverse-1.0.4.tgz#a6b0ebf98a1bca6846ddc7ecbc900df08cb9cd5f"
@ -6781,6 +6805,15 @@ vite-plugin-monaco-editor@^1.1.0:
resolved "https://registry.jetlinks.cn/vite-plugin-monaco-editor/-/vite-plugin-monaco-editor-1.1.0.tgz"
integrity sha512-IvtUqZotrRoVqwT0PBBDIZPNraya3BxN/bfcNfnxZ5rkJiGcNtO5eAOWWSgT7zullIAEqQwxMU83yL9J5k7gww==
vite-plugin-progress@^0.0.7:
version "0.0.7"
resolved "http://registry.jetlinks.cn/vite-plugin-progress/-/vite-plugin-progress-0.0.7.tgz#10979d2195b4dd1960ad0ec9347ce844fc13b97d"
integrity sha512-zyvKdcc/X+6hnw3J1HVV1TKrlFKC4Rh8GnDnWG/2qhRXjqytTcM++xZ+SAPnoDsSyWl8O93ymK0wZRgHAoglEQ==
dependencies:
picocolors "^1.0.0"
progress "^2.0.3"
rd "^2.0.1"
vite-plugin-style-import@^2.0.0:
version "2.0.0"
resolved "https://registry.npmjs.org/vite-plugin-style-import/-/vite-plugin-style-import-2.0.0.tgz"