迁移大屏UI库和应用
This commit is contained in:
aixianling
540
project/dvui/layout/AiDvWrapper/AiDvWrapper.vue
Normal file
540
project/dvui/layout/AiDvWrapper/AiDvWrapper.vue
Normal file
@@ -0,0 +1,540 @@
|
||||
<template>
|
||||
<section class="AiDvWrapper">
|
||||
<dv-full-screen-container>
|
||||
<div class="viewPanel column" flex>
|
||||
<el-row type="flex" class="headerPane">
|
||||
<div class="fill topPane">
|
||||
<div class="viewTabs" flex>
|
||||
<div v-for="view in tabs" :key="view.id" class="btn" :class="{active:view.id==active}" flex
|
||||
@click="$emit('change',view.id)">{{ view.label }}
|
||||
</div>
|
||||
<div v-if="hasMoreDvs" class="btn more" :class="{active:isMoreTabs}" flex>更多
|
||||
<div class="moreViews">
|
||||
<div v-for="view in moreTabs" :key="view.id" v-text="view.label"
|
||||
class="moreViewItem" :class="{active:view.id==active}"
|
||||
:popper-options="{boundariesElement:'AiDvWrapper'}"
|
||||
@click="$emit('change',view.id)"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="headerBottomBorder">
|
||||
<div class="breatheLights"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="headerCenter">
|
||||
<div class="headerZone">
|
||||
<div ref="fly" class="fly"/>
|
||||
<span>{{ title }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill topPane">
|
||||
<div class="settingZone" flex>
|
||||
<right-top-border class="time">{{ currentTime }}</right-top-border>
|
||||
<right-top-border class="setting" @click.native.stop="dialog=true"/>
|
||||
<right-top-border class="fullscreen" @click.native.stop="handleFullScreen"/>
|
||||
</div>
|
||||
<div class="headerBottomBorder right">
|
||||
<div class="breatheLights"/>
|
||||
</div>
|
||||
</div>
|
||||
</el-row>
|
||||
<div class="fill">
|
||||
<slot/>
|
||||
</div>
|
||||
</div>
|
||||
</dv-full-screen-container>
|
||||
<ai-dialog :visible.sync="dialog" title="设置" @onConfirm="handleSetting" width="500px" class="settingDialog">
|
||||
<el-form size="mini">
|
||||
<el-form-item label="轮播频次">
|
||||
<el-input-number v-model="setting.splitViewTime" :min="0" controls-position="right"/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</ai-dialog>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {fullScreenContainer} from '@jiaminghi/data-view'
|
||||
import {gsap} from 'gsap'
|
||||
import {MotionPathPlugin} from "gsap/MotionPathPlugin.js"
|
||||
import Vue from "vue";
|
||||
import RightTopBorder from "./rightTopBorder";
|
||||
|
||||
Vue.use(fullScreenContainer)
|
||||
|
||||
export default {
|
||||
name: "AiDvWrapper",
|
||||
components: {RightTopBorder},
|
||||
model: {
|
||||
prop: 'value',
|
||||
event: 'change'
|
||||
},
|
||||
props: {
|
||||
title: {default: "数字乡村数据大屏"},
|
||||
views: {
|
||||
default: () => []
|
||||
},
|
||||
value: {default: ''}
|
||||
},
|
||||
computed: {
|
||||
active: {
|
||||
set(v) {
|
||||
this.$emit('change', v)
|
||||
},
|
||||
get() {
|
||||
return this.value || this.views?.[0]?.id
|
||||
}
|
||||
},
|
||||
hasMoreDvs() {
|
||||
return this.views.length > 4
|
||||
},
|
||||
tabs() {
|
||||
return !this.hasMoreDvs ? this.views : this.views.slice(0, 3)
|
||||
},
|
||||
moreTabs() {
|
||||
return this.views?.slice(3) || []
|
||||
},
|
||||
isMoreTabs() {
|
||||
return this.moreTabs?.some(e => e.id == this.active)
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentTime: '',
|
||||
fullscreen: false,
|
||||
dialog: false,
|
||||
setting: {splitViewTime: 0}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleFullScreen() {
|
||||
this.fullscreen = !this.fullscreen
|
||||
if (this.fullscreen) {
|
||||
let el = document.documentElement;
|
||||
let rfs = el.requestFullScreen || el.webkitRequestFullScreen ||
|
||||
el.mozRequestFullScreen || el.msRequestFullScreen;
|
||||
rfs.call(el)
|
||||
} else {
|
||||
let el = document;
|
||||
let cfs = el.cancelFullScreen || el.webkitCancelFullScreen ||
|
||||
el.mozCancelFullScreen || el.exitFullScreen;
|
||||
cfs.call(el)
|
||||
}
|
||||
},
|
||||
initFly() {
|
||||
gsap.registerPlugin(MotionPathPlugin);
|
||||
const rand = (min, max) => min + (max - min) * Math.random(),
|
||||
startFly = (p) => {
|
||||
gsap.timeline()
|
||||
.fromTo(p, {
|
||||
x: rand(0, 600),
|
||||
y: 90 - rand(8, 50),
|
||||
scale: rand(1, 3),
|
||||
}, {
|
||||
y: 0,
|
||||
ease: 'elastic.easeInOut',
|
||||
duration: rand(2, 6),
|
||||
onComplete: () => {
|
||||
startFly(p, true);
|
||||
}
|
||||
}, 0)
|
||||
.fromTo(p, {
|
||||
opacity: 1
|
||||
}, {
|
||||
opacity: 0,
|
||||
duration: rand(1, 1.5),
|
||||
yoyo: true,
|
||||
repeat: -1,
|
||||
ease: 'power4.in'
|
||||
}, 0)
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
//初始化标题萤火效果
|
||||
let numP = 70;
|
||||
for (let i = 0; i <= numP; i++) {
|
||||
let p = document.createElement('div');
|
||||
p.id = "p" + i;
|
||||
this.$refs.fly?.appendChild(p)
|
||||
setTimeout(() => startFly(p), 1000)
|
||||
}
|
||||
}, 1000)
|
||||
},
|
||||
handleSetting() {
|
||||
if (this.setting.timer) clearInterval(this.setting.timer)
|
||||
let count = 0
|
||||
if (this.setting?.splitViewTime > 0) {
|
||||
this.setting.timer = setInterval(() => {
|
||||
if (this.views.length > 0) {
|
||||
count++
|
||||
this.active = this.views?.[count % this.views.length]?.id
|
||||
}
|
||||
}, this.setting.splitViewTime * 1000)
|
||||
}
|
||||
|
||||
this.dialog = false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
setInterval(() => {
|
||||
this.currentTime = this.$moment().format("YYYY/MM/DD HH:mm:ss")
|
||||
}, 1000)
|
||||
},
|
||||
mounted() {
|
||||
this.initFly()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@font-face {
|
||||
font-family: DIN;
|
||||
src: url("assets/D-DINExp.otf");
|
||||
}
|
||||
|
||||
@import url('../../lib/animation.scss');
|
||||
.AiDvWrapper {
|
||||
.viewPanel {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-image: url("https://cdn.cunwuyun.cn/dvcp/dv/background.png");
|
||||
padding: 0 0 20px;
|
||||
box-sizing: border-box;
|
||||
|
||||
& > .fill {
|
||||
width: 100%;
|
||||
padding: 0 40px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep.headerPane {
|
||||
height: 120px;
|
||||
width: 100%;
|
||||
padding: 0 10px;
|
||||
position: relative;
|
||||
color: #fff;
|
||||
|
||||
.topPane {
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
.viewTabs {
|
||||
height: 60px;
|
||||
font-size: 15px;
|
||||
overflow: visible;
|
||||
|
||||
.btn {
|
||||
cursor: pointer;
|
||||
justify-content: center;
|
||||
min-width: 120px;
|
||||
height: 48px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("assets/viewTabBtn.svg");
|
||||
|
||||
&.more {
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
|
||||
&:hover {
|
||||
background-image: url("assets/moreViewsBtn.svg");
|
||||
|
||||
.moreViews {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
position: relative;
|
||||
background-image: none;
|
||||
|
||||
&:before {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 126px;
|
||||
height: 38px;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
background-image: url("assets/viewTabBtn-active.svg");
|
||||
}
|
||||
}
|
||||
|
||||
& + .btn, & + .moreTabs {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.settingZone {
|
||||
font-family: DIN, serif;
|
||||
height: 60px;
|
||||
justify-content: flex-end;
|
||||
font-size: 18px;
|
||||
z-index: 5;
|
||||
|
||||
.rightTopBorder + .rightTopBorder {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.time {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.setting {
|
||||
background-image: url("assets/setting.svg");
|
||||
}
|
||||
|
||||
.fullscreen {
|
||||
background-image: url("assets/fullscreen.svg");
|
||||
}
|
||||
}
|
||||
|
||||
.headerCenter {
|
||||
width: 880px;
|
||||
height: 90px;
|
||||
z-index: 3;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center -32px;
|
||||
background-image: url("assets/headerCenterBg1.svg");
|
||||
|
||||
&:before {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
background: linear-gradient(180deg, #040718 0%, rgba(4, 7, 24, 0) 100%);
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
pointer-events: none;
|
||||
height: 64px;
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
.headerZone {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
width: 760px;
|
||||
height: 124px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url("assets/headerCenterBorderLight.svg"), url("assets/headerCenterBorder.svg"), url("assets/headerCenterBg2.png");
|
||||
background-position: center bottom, center 0, center -20px;
|
||||
overflow: visible;
|
||||
|
||||
& > span {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: calc(50% - 20px);
|
||||
transform: translate(-50%, -50%);
|
||||
white-space: nowrap;
|
||||
font-size: 40px;
|
||||
line-height: 47px;
|
||||
letter-spacing: 5px;
|
||||
text-shadow: 0 0 8px #1365FF, 0 0 2px rgba(133, 181, 255, .5);
|
||||
z-index: 9;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.fly {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 600px;
|
||||
height: 90px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 3;
|
||||
|
||||
& > div {
|
||||
width: 0;
|
||||
box-shadow: 0 0 1px 1px #0aa5ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.headerBottomBorder {
|
||||
position: relative;
|
||||
width: 538px;
|
||||
height: 15px;
|
||||
background-image: url("assets/headerBottomBorder.svg");
|
||||
|
||||
&:before {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: -3px;
|
||||
bottom: -3px;
|
||||
width: 40px;
|
||||
height: 12px;
|
||||
background-image: url("assets/headerBottomLight.svg");
|
||||
}
|
||||
|
||||
.breatheLights {
|
||||
position: absolute;
|
||||
right: -7px;
|
||||
bottom: -20px;
|
||||
transform: translateX(100%);
|
||||
width: 132px;
|
||||
height: 20px;
|
||||
animation: breathes 1.5s ease-in-out infinite alternate;
|
||||
animation-delay: .5s;
|
||||
display: flex;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
&:before {
|
||||
transform: translateX(calc(6px - 100%));
|
||||
display: block;
|
||||
content: " ";
|
||||
width: 44px;
|
||||
height: 20px;
|
||||
animation: breathes 1.5s ease-in-out infinite alternate;
|
||||
}
|
||||
|
||||
&:after {
|
||||
transform: translateX(-6px);
|
||||
display: block;
|
||||
content: " ";
|
||||
width: 44px;
|
||||
height: 20px;
|
||||
animation: breathes 1.5s infinite alternate;
|
||||
animation-delay: 1s;
|
||||
}
|
||||
}
|
||||
|
||||
&.right {
|
||||
float: right;
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
.moreViews {
|
||||
display: none;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
transform: translateY(100%);
|
||||
width: 120px;
|
||||
min-width: 120px;
|
||||
padding: 0;
|
||||
background: rgba(9, 43, 75, 0.5);
|
||||
box-shadow: 0 0 8px 0 #20B8FF inset;
|
||||
border: 1px solid #66DBFF;
|
||||
border-radius: 0;
|
||||
z-index: 2;
|
||||
|
||||
.moreViewItem {
|
||||
height: 44px;
|
||||
width: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-bottom: 1px solid #0C5369;
|
||||
margin: 0 10px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
|
||||
&:last-of-type {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
&.active, &:hover {
|
||||
color: #FFDB52;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep.settingDialog {
|
||||
.ai-dialog {
|
||||
background: #1D2127;
|
||||
box-shadow: 0 0 4px 0 #206EFF;
|
||||
border: 1px solid #4283FF;
|
||||
color: #fff;
|
||||
|
||||
.el-dialog__header {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
line-height: 28px;
|
||||
font-size: 20px;
|
||||
font-family: FZZZHONGJW--GB1-0, FZZZHONGJW--GB1;
|
||||
text-shadow: 0 0 8px #1365FF;
|
||||
background: linear-gradient(270deg, #F0F4FF 0%, #FFFFFF 51%, #F0F4FF 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
|
||||
.ai-dialog__header {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.el-dialog__footer {
|
||||
background: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.el-form {
|
||||
.el-form-item__label {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.el-input:after {
|
||||
position: absolute;
|
||||
display: block;
|
||||
right: 32px;
|
||||
top: 50%;
|
||||
content: "秒";
|
||||
transform: translateY(-50%);
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.el-input__inner {
|
||||
background: #262C33;
|
||||
border: 1px solid #030411;
|
||||
border-radius: 0;
|
||||
color: #fff;
|
||||
text-align: start;
|
||||
position: relative;
|
||||
|
||||
}
|
||||
|
||||
.el-input-number__decrease, .el-input-number__increase {
|
||||
border-color: #030411;
|
||||
background: #262C33;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes breatheList {
|
||||
0% {
|
||||
border-color: rgba(#FFC24A, 1);
|
||||
box-shadow: 0 0 8px 0 #FFC24A, 0 0 4px 0 #FFFAE7;
|
||||
}
|
||||
50% {
|
||||
border-color: rgba(#FFC24A, .4);
|
||||
box-shadow: 0 0 8px 0 rgba(#FFC24A, .4), 0 0 4px 0 rgba(#FFFAE7, .4);
|
||||
}
|
||||
100% {
|
||||
border-color: rgba(#FFC24A, .2);
|
||||
box-shadow: 0 0 8px 0 rgba(#FFC24A, .2), 0 0 4px 0 rgba(#FFFAE7, .2);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes breathes {
|
||||
0% {
|
||||
background-image: url("assets/parallelogram.svg");
|
||||
}
|
||||
50% {
|
||||
background-image: url("assets/parallelogram1.svg");
|
||||
}
|
||||
100% {
|
||||
background-image: url("assets/parallelogram2.svg");
|
||||
}
|
||||
}
|
||||
</style>
|
||||
BIN
project/dvui/layout/AiDvWrapper/assets/D-DINExp.otf
Normal file
BIN
project/dvui/layout/AiDvWrapper/assets/D-DINExp.otf
Normal file
Binary file not shown.
21
project/dvui/layout/AiDvWrapper/assets/corner.svg
Normal file
21
project/dvui/layout/AiDvWrapper/assets/corner.svg
Normal file
@@ -0,0 +1,21 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>路径备份</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="1826 14 1826 15 1821 15 1821 20 1820 20 1820 14"></polygon>
|
||||
<filter x="-150.0%" y="-150.0%" width="400.0%" height="400.0%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
|
||||
<feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 0.088934077 0 0 0 0 0.269903162 0 0 0 0 0.86962183 0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="头部导航备份" transform="translate(-1814.000000, -8.000000)" fill-rule="nonzero">
|
||||
<g id="路径备份" transform="translate(1823.000000, 17.000000) scale(-1, 1) translate(-1823.000000, -17.000000) ">
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#E8F9FF" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
21
project/dvui/layout/AiDvWrapper/assets/fullscreen.svg
Normal file
21
project/dvui/layout/AiDvWrapper/assets/fullscreen.svg
Normal file
@@ -0,0 +1,21 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>形状结合</title>
|
||||
<defs>
|
||||
<path d="M1902,22 L1902,38 L1886,38 L1886,22 L1902,22 Z M1901,23 L1887,23 L1887,37 L1901,37 L1901,23 Z M1895.35711,30.65 L1898.00355,33.2965534 L1898.00355,31.0035534 L1899.00355,31.0035534 L1899.00355,35.0035534 L1895.00355,35.0035534 L1895.00355,34.0035534 L1897.29655,34.0035534 L1894.65,31.3571068 L1895.35711,30.65 Z M1893,25 L1893,26 L1890.707,26 L1893.35355,28.6464466 L1892.64645,29.3535534 L1890,26.707 L1890,29 L1889,29 L1889,25 L1893,25 Z" id="path-1"></path>
|
||||
<filter x="-56.2%" y="-56.2%" width="212.5%" height="212.5%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
|
||||
<feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 0.088934077 0 0 0 0 0.269903162 0 0 0 0 0.86962183 0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="头部导航备份" transform="translate(-1880.000000, -16.000000)" fill-rule="nonzero">
|
||||
<g id="形状结合">
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#E8F9FF" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
@@ -0,0 +1,17 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="538px" height="15px" viewBox="0 0 538 15" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
||||
<title>编组</title>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="头部导航备份" transform="translate(-10.000000, -57.000000)">
|
||||
<g id="编组" transform="translate(10.000000, 57.000000)">
|
||||
<path d="M199,0 L196,3 L240,3 L242,5 L145.333,5 L132,15 L0,15 L2.21428571,13 L57.012,13 L60.0307692,10 L130.667,10 L144,0 L199,0 Z M425,9 L428,12 L453,12 L455,14 L422,14 L417,9 L425,9 Z M407,11 L409,13 L149,13 L151,11 L407,11 Z M538,3 L538,5 L254,5 L252,3 L538,3 Z"
|
||||
id="line_2" fill="#0085FF" opacity="0.5"
|
||||
transform="translate(269.000000, 7.500000) scale(-1, 1) translate(-269.000000, -7.500000) "></path>
|
||||
<polygon id="blue_blocks_2" fill="#0065FF" opacity="0.800000012"
|
||||
transform="translate(511.000000, 6.000000) scale(-1, 1) translate(-511.000000, -6.000000) "
|
||||
points="495 4 527 4 531 8 491 8"></polygon>
|
||||
<polygon id="矩形" fill="#0065FF" opacity="0.5" points="76 10 46 10 42 14 72 14"></polygon>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
33
project/dvui/layout/AiDvWrapper/assets/headerBottomLight.svg
Normal file
33
project/dvui/layout/AiDvWrapper/assets/headerBottomLight.svg
Normal file
@@ -0,0 +1,33 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="40px" height="12px" viewBox="0 0 40 12" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>矩形备份 4</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="-3.41060513e-13 0 32 0 28 4 -4.54747351e-13 4"></polygon>
|
||||
<filter x="-18.8%" y="-150.0%" width="137.5%" height="400.0%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.760001846 0 0 0 0 0.291006098 0 0 0 1 0" type="matrix"
|
||||
in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
<filter x="-18.8%" y="-150.0%" width="137.5%" height="400.0%" filterUnits="objectBoundingBox" id="filter-3">
|
||||
<feGaussianBlur stdDeviation="2" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1"
|
||||
result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.899941501 0 0 0 0 0.547561571 0 0 0 1 0" type="matrix"
|
||||
in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="头部导航备份" transform="translate(-6.000000, -63.000000)">
|
||||
<g id="head_left" transform="translate(10.000000, 57.000000)">
|
||||
<g id="矩形备份-4" transform="translate(0.000000, 10.000000)">
|
||||
<use fill="black" fill-opacity=".6" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#FFC143" fill-opacity=".6" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
<use fill="black" fill-opacity=".6" filter="url(#filter-3)" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
31
project/dvui/layout/AiDvWrapper/assets/headerCenterBg1.svg
Normal file
31
project/dvui/layout/AiDvWrapper/assets/headerCenterBg1.svg
Normal file
@@ -0,0 +1,31 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="928px" height="156px" viewBox="0 0 928 156" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>title_2</title>
|
||||
<defs>
|
||||
<path d="M844,0 L844,38.8055502 L812.851491,72 L31.1485094,72 L0,38.8055502 L0,0 L844,0 Z M840,0 L4,0 L4,37.194 L32.852,68 L811.147,68 L840,37.193 L840,0 Z" id="path-1"></path>
|
||||
<filter x="-7.9%" y="-79.2%" width="115.9%" height="286.1%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feOffset dx="0" dy="10" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="20" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 0.16179497 0 0 0 0 0.595551419 0 0 0 0 1 0 0 0 1 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
|
||||
<feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter2"></feMorphology>
|
||||
<feOffset dx="0" dy="0" in="shadowSpreadOuter2" result="shadowOffsetOuter2"></feOffset>
|
||||
<feGaussianBlur stdDeviation="4" in="shadowOffsetOuter2" result="shadowBlurOuter2"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 0.0240472561 0 0 0 0 0.420474739 0 0 0 0 1 0 0 0 1 0" type="matrix" in="shadowBlurOuter2" result="shadowMatrixOuter2"></feColorMatrix>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
|
||||
<feMergeNode in="shadowMatrixOuter2"></feMergeNode>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.5">
|
||||
<g id="头部导航备份" transform="translate(-496.000000, 32.000000)">
|
||||
<g id="title_2" transform="translate(538.000000, 0.000000)">
|
||||
<polygon id="填充" fill-opacity="0.5" fill="#4B6FFF" points="2 0 842 0 842 38 812 70 32 70 2 38"></polygon>
|
||||
<g id="形状">
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#B3E7FB" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
BIN
project/dvui/layout/AiDvWrapper/assets/headerCenterBg2.png
Normal file
BIN
project/dvui/layout/AiDvWrapper/assets/headerCenterBg2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
@@ -0,0 +1,25 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="782px" height="106px" viewBox="0 0 782 106" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>形状</title>
|
||||
<defs>
|
||||
<path d="M759.998,0 L687.998105,92 L606.999,92 L600.999,96 L558.999,96 L552.999,92 L432.662333,92 L416.662,80 L343.336,80 L327.335667,92 L206.999,92 L200.999,96 L158.999,96 L152.999562,92 L71.999895,92 L1.70530257e-13,0 L759.998,0 Z M754.526,0 L5.471,0 L73.738,88 L326.002,88 L342.002333,76 L417.995667,76 L433.996,88 L686.259,88 L754.526,0 Z"
|
||||
id="path-1"></path>
|
||||
<filter x="-2.3%" y="-15.6%" width="104.5%" height="131.2%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
|
||||
<feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 0.0240472561 0 0 0 0 0.420474739 0 0 0 0 1 0 0 0 1 0" type="matrix"
|
||||
in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="头部导航备份" transform="translate(-569.000000, 0.000000)">
|
||||
<g id="形状" transform="translate(580.000000, 0.000000)">
|
||||
<animate attributeName='opacity' dur='2s' values="1;.6;1" repeatCount="indefinite"/>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#B3E7FB" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
@@ -0,0 +1,44 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="164px" height="68px" viewBox="0 0 164 68" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>中间色块</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="413 88 347 88 336 96 424 96"></polygon>
|
||||
<filter x="-65.3%" y="-562.5%" width="230.6%" height="1225.0%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
|
||||
<feOffset dx="0" dy="1" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="3.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 0.141520579 0 0 0 0 0.448441981 0 0 0 0 1 0 0 0 1 0" type="matrix"
|
||||
in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
|
||||
<feMorphology radius="3" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter2"></feMorphology>
|
||||
<feOffset dx="0" dy="0" in="shadowSpreadOuter2" result="shadowOffsetOuter2"></feOffset>
|
||||
<feGaussianBlur stdDeviation="12" in="shadowOffsetOuter2" result="shadowBlurOuter2"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 0.21875 0 0 0 0 0.423793979 0 0 0 0 1 0 0 0 1 0" type="matrix"
|
||||
in="shadowBlurOuter2" result="shadowMatrixOuter2"></feColorMatrix>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
|
||||
<feMergeNode in="shadowMatrixOuter2"></feMergeNode>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<filter x="-49.9%" y="-393.8%" width="199.9%" height="887.5%" filterUnits="objectBoundingBox" id="filter-3">
|
||||
<feMorphology radius="1" operator="erode" in="SourceAlpha" result="shadowSpreadInner1"></feMorphology>
|
||||
<feGaussianBlur stdDeviation="1" in="shadowSpreadInner1" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1"
|
||||
result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 0.772446646 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0" type="matrix"
|
||||
in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="头部导航备份" transform="translate(-878.000000, -58.000000)">
|
||||
<g id="中间色块" transform="translate(580.000000, 0.000000)">
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#B5FBFF" fill-rule="evenodd" xlink:href="#path-1">
|
||||
<animate attributeName='opacity' dur='2s' values="0;1;0" repeatCount="indefinite"/>
|
||||
</use>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
36
project/dvui/layout/AiDvWrapper/assets/moreViewsBtn.svg
Normal file
36
project/dvui/layout/AiDvWrapper/assets/moreViewsBtn.svg
Normal file
@@ -0,0 +1,36 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="120px" height="32px" viewBox="0 0 120 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>编组 2</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="0 2.84217094e-14 102 0 120 18 120 32 0 32"></polygon>
|
||||
<filter x="-3.3%" y="-12.5%" width="106.7%" height="125.0%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feGaussianBlur stdDeviation="4" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 0.126200457 0 0 0 0 0.722235433 0 0 0 0 1 0 0 0 1 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
<polygon id="path-3" points="120 0 120 8 112 0"></polygon>
|
||||
<filter x="-18.8%" y="-18.8%" width="137.5%" height="137.5%" filterUnits="objectBoundingBox" id="filter-4">
|
||||
<feGaussianBlur stdDeviation="1.5" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 0.126200457 0 0 0 0 0.722235433 0 0 0 0 1 0 0 0 1 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="人口数据" transform="translate(-400.000000, -14.000000)">
|
||||
<g id="编组-2" transform="translate(400.000000, 14.000000)">
|
||||
<g id="矩形">
|
||||
<use fill-opacity="0.5" fill="#092B4B" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<path stroke="#66DBFF" stroke-width="0.5" d="M101.896447,0.25 L119.75,18.1035534 L119.75,31.75 L0.25,31.75 L0.25,0.25 L101.896447,0.25 Z" stroke-linejoin="square"></path>
|
||||
</g>
|
||||
<g id="矩形">
|
||||
<use fill-opacity="0.5" fill="#092B4B" fill-rule="evenodd" xlink:href="#path-3"></use>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-3"></use>
|
||||
<path stroke="#66DBFF" stroke-width="0.5" d="M119.75,0.25 L119.75,7.39644661 L112.603553,0.25 L119.75,0.25 Z" stroke-linejoin="square"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
27
project/dvui/layout/AiDvWrapper/assets/parallelogram.svg
Normal file
27
project/dvui/layout/AiDvWrapper/assets/parallelogram.svg
Normal file
@@ -0,0 +1,27 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="44px" height="20px" viewBox="0 0 44 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>矩形</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="84 0 110 0 106 4 80 4"></polygon>
|
||||
<filter x="-40.0%" y="-300.0%" width="180.0%" height="700.0%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.760001846 0 0 0 0 0.291006098 0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
<filter x="-33.3%" y="-250.0%" width="166.7%" height="600.0%" filterUnits="objectBoundingBox" id="filter-3">
|
||||
<feGaussianBlur stdDeviation="2" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.97961238 0 0 0 0 0.9078125 0 0 0 1 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="折线图" transform="translate(-508.000000, -76.000000)">
|
||||
<g id="矩形" transform="translate(570.000000, 86.000000) scale(-1, 1) translate(-570.000000, -86.000000) translate(515.000000, 84.000000)">
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#FFC143" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
32
project/dvui/layout/AiDvWrapper/assets/parallelogram1.svg
Normal file
32
project/dvui/layout/AiDvWrapper/assets/parallelogram1.svg
Normal file
@@ -0,0 +1,32 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="44px" height="20px" viewBox="0 0 44 20" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>矩形</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="84 0 110 0 106 4 80 4"></polygon>
|
||||
<filter x="-40.0%" y="-300.0%" width="180.0%" height="700.0%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.760001846 0 0 0 0 0.291006098 0 0 0 1 0" type="matrix"
|
||||
in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
<filter x="-33.3%" y="-250.0%" width="166.7%" height="600.0%" filterUnits="objectBoundingBox" id="filter-3">
|
||||
<feGaussianBlur stdDeviation="2" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1"
|
||||
result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.97961238 0 0 0 0 0.9078125 0 0 0 1 0" type="matrix"
|
||||
in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="折线图" transform="translate(-508.000000, -76.000000)">
|
||||
<g id="矩形"
|
||||
transform="translate(570.000000, 86.000000) scale(-1, 1) translate(-570.000000, -86.000000) translate(515.000000, 84.000000)">
|
||||
<use fill="black" fill-opacity=".4" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#FFC143" fill-opacity=".4" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
<use fill="black" fill-opacity=".4" filter="url(#filter-3)" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
32
project/dvui/layout/AiDvWrapper/assets/parallelogram2.svg
Normal file
32
project/dvui/layout/AiDvWrapper/assets/parallelogram2.svg
Normal file
@@ -0,0 +1,32 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="44px" height="20px" viewBox="0 0 44 20" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>矩形</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="84 0 110 0 106 4 80 4"></polygon>
|
||||
<filter x="-40.0%" y="-300.0%" width="180.0%" height="700.0%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="4" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.760001846 0 0 0 0 0.291006098 0 0 0 1 0" type="matrix"
|
||||
in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
<filter x="-33.3%" y="-250.0%" width="166.7%" height="600.0%" filterUnits="objectBoundingBox" id="filter-3">
|
||||
<feGaussianBlur stdDeviation="2" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1"
|
||||
result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.97961238 0 0 0 0 0.9078125 0 0 0 1 0" type="matrix"
|
||||
in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="折线图" transform="translate(-508.000000, -76.000000)">
|
||||
<g id="矩形"
|
||||
transform="translate(570.000000, 86.000000) scale(-1, 1) translate(-570.000000, -86.000000) translate(515.000000, 84.000000)">
|
||||
<use fill="black" fill-opacity=".1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#FFC143" fill-opacity=".1" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
<use fill="black" fill-opacity=".1" filter="url(#filter-3)" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
21
project/dvui/layout/AiDvWrapper/assets/setting.svg
Normal file
21
project/dvui/layout/AiDvWrapper/assets/setting.svg
Normal file
@@ -0,0 +1,21 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>形状结合</title>
|
||||
<defs>
|
||||
<path d="M1854,22 L1855.0708,24.679 L1857.9282,24.2679492 L1859.9282,27.7320508 L1858.1438,29.999 L1859.9282,32.2679492 L1857.9282,35.7320508 L1855.0718,35.321 L1854,38 L1850,38 L1848.9278,35.32 L1846.0718,35.7320508 L1844.0718,32.2679492 L1845.8558,30 L1844.0718,27.7320508 L1846.0718,24.2679492 L1848.9278,24.679 L1850,22 L1854,22 Z M1853.322,23 L1850.676,23 L1849.56392,25.7808587 L1846.599,25.353 L1845.276,27.645 L1847.1281,30 L1845.276,32.354 L1846.598,34.645 L1849.56392,34.2178686 L1850.677,37 L1853.322,37 L1854.43556,34.2191413 L1857.4,34.646 L1858.723,32.354 L1856.87138,29.9987274 L1858.723,27.645 L1857.4,25.353 L1854.43429,25.7808587 L1853.322,23 Z M1852,27 C1853.65685,27 1855,28.3431458 1855,30 C1855,31.6568542 1853.65685,33 1852,33 C1850.34315,33 1849,31.6568542 1849,30 C1849,28.3431458 1850.34315,27 1852,27 Z M1852,28 C1850.89543,28 1850,28.8954305 1850,30 C1850,31.1045695 1850.89543,32 1852,32 C1853.10457,32 1854,31.1045695 1854,30 C1854,28.8954305 1853.10457,28 1852,28 Z" id="path-1"></path>
|
||||
<filter x="-59.3%" y="-56.2%" width="218.7%" height="212.5%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feMorphology radius="1" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
|
||||
<feOffset dx="0" dy="0" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feColorMatrix values="0 0 0 0 0.088934077 0 0 0 0 0.269903162 0 0 0 0 0.86962183 0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="头部导航备份" transform="translate(-1838.000000, -16.000000)" fill-rule="nonzero">
|
||||
<g id="形状结合">
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill="#E8F9FF" xlink:href="#path-1"></use>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
50
project/dvui/layout/AiDvWrapper/assets/viewTabBtn-active.svg
Normal file
50
project/dvui/layout/AiDvWrapper/assets/viewTabBtn-active.svg
Normal file
@@ -0,0 +1,50 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="126px" height="38px" viewBox="0 0 126 38" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>编组 4备份</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="0 2.84217094e-14 102 0 120 18 120 32 0 32"></polygon>
|
||||
<filter x="-3.8%" y="-14.1%" width="107.5%" height="128.1%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="1.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.520060506 0 0 0 0 0 0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
<filter x="-6.2%" y="-23.4%" width="112.5%" height="146.9%" filterUnits="objectBoundingBox" id="filter-3">
|
||||
<feMorphology radius="1" operator="erode" in="SourceAlpha" result="shadowSpreadInner1"></feMorphology>
|
||||
<feGaussianBlur stdDeviation="4" in="shadowSpreadInner1" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.595413728 0 0 0 0 0.13954959 0 0 0 0.996011801 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
<polygon id="path-4" points="120 0 120 8 112 0"></polygon>
|
||||
<filter x="-56.2%" y="-56.2%" width="212.5%" height="212.5%" filterUnits="objectBoundingBox" id="filter-5">
|
||||
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||
<feGaussianBlur stdDeviation="1.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
|
||||
<feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.520060506 0 0 0 0 0 0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
|
||||
</filter>
|
||||
<filter x="-62.5%" y="-62.5%" width="225.0%" height="225.0%" filterUnits="objectBoundingBox" id="filter-6">
|
||||
<feMorphology radius="1" operator="erode" in="SourceAlpha" result="shadowSpreadInner1"></feMorphology>
|
||||
<feGaussianBlur stdDeviation="1.5" in="shadowSpreadInner1" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 1 0 0 0 0 0.595413728 0 0 0 0 0.13954959 0 0 0 0.996011801 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="编组-2" transform="translate(3.000000, 3.000000)">
|
||||
<g id="矩形">
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<use fill-opacity="0.198153409" fill="#A15400" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-1"></use>
|
||||
<path stroke="#FFCC52" stroke-width="0.5" d="M101.896447,0.25 L119.75,18.1035534 L119.75,31.75 L0.25,31.75 L0.25,0.25 L101.896447,0.25 Z" stroke-linejoin="square"></path>
|
||||
</g>
|
||||
<g id="形状结合">
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-5)" xlink:href="#path-4"></use>
|
||||
<use fill-opacity="0.198153409" fill="#A15400" fill-rule="evenodd" xlink:href="#path-4"></use>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-6)" xlink:href="#path-4"></use>
|
||||
<path stroke="#FFCC52" stroke-width="0.5" d="M119.75,0.25 L119.75,7.39644661 L112.603553,0.25 L119.75,0.25 Z" stroke-linejoin="square"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.3 KiB |
36
project/dvui/layout/AiDvWrapper/assets/viewTabBtn.svg
Normal file
36
project/dvui/layout/AiDvWrapper/assets/viewTabBtn.svg
Normal file
@@ -0,0 +1,36 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="120px" height="32px" viewBox="0 0 120 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>viewTabBtn</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="0 2.84217094e-14 102 0 120 18 120 32 0 32"></polygon>
|
||||
<filter x="-3.3%" y="-12.5%" width="106.7%" height="125.0%" filterUnits="objectBoundingBox" id="filter-2">
|
||||
<feMorphology radius="2" operator="erode" in="SourceAlpha" result="shadowSpreadInner1"></feMorphology>
|
||||
<feGaussianBlur stdDeviation="3" in="shadowSpreadInner1" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 0.0261281366 0 0 0 0 0.0922953427 0 0 0 0 0.77753349 0 0 0 1 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
<polygon id="path-3" points="120 0 120 8 112 0"></polygon>
|
||||
<filter x="-25.0%" y="-25.0%" width="150.0%" height="150.0%" filterUnits="objectBoundingBox" id="filter-4">
|
||||
<feMorphology radius="1" operator="erode" in="SourceAlpha" result="shadowSpreadInner1"></feMorphology>
|
||||
<feGaussianBlur stdDeviation="1.5" in="shadowSpreadInner1" result="shadowBlurInner1"></feGaussianBlur>
|
||||
<feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
|
||||
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
|
||||
<feColorMatrix values="0 0 0 0 0.0505411679 0 0 0 0 0.17474998 0 0 0 0 0.820295693 0 0 0 1 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
|
||||
</filter>
|
||||
</defs>
|
||||
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="编组-3">
|
||||
<g id="矩形">
|
||||
<use fill-opacity="0.3" fill="#000972" fill-rule="evenodd" xlink:href="#path-1"></use>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#path-1"></use>
|
||||
<path stroke="#4C7BFF" stroke-width="0.5" d="M101.896447,0.25 L119.75,18.1035534 L119.75,31.75 L0.25,31.75 L0.25,0.25 L101.896447,0.25 Z" stroke-linejoin="square"></path>
|
||||
</g>
|
||||
<g id="形状结合">
|
||||
<use fill-opacity="0.2" fill="#0017AA" fill-rule="evenodd" xlink:href="#path-3"></use>
|
||||
<use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-3"></use>
|
||||
<path stroke="#4C7BFF" stroke-width="0.5" d="M119.75,0.25 L119.75,7.39644661 L112.603553,0.25 L119.75,0.25 Z" stroke-linejoin="square"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.9 KiB |
62
project/dvui/layout/AiDvWrapper/rightTopBorder.vue
Normal file
62
project/dvui/layout/AiDvWrapper/rightTopBorder.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<section class="rightTopBorder">
|
||||
<div class="corner" v-for="item in border" :key="item" :class="item"/>
|
||||
<slot/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "rightTopBorder",
|
||||
data() {
|
||||
return {
|
||||
border: ['left-top', 'right-top', 'left-bottom', 'right-bottom']
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.rightTopBorder {
|
||||
position: relative;
|
||||
height: 32px;
|
||||
min-width: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0 0 4px 2px #1745DE inset;
|
||||
background: rgba(#000972, .3) no-repeat center;
|
||||
|
||||
.corner {
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
position: absolute;
|
||||
display: block;
|
||||
background-image: url("assets/corner.svg");
|
||||
background-repeat: no-repeat;
|
||||
|
||||
&.left-top {
|
||||
left: -6px;
|
||||
top: -6px;
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
&.right-top {
|
||||
right: -6px;
|
||||
top: -6px;
|
||||
}
|
||||
|
||||
&.left-bottom {
|
||||
left: -6px;
|
||||
bottom: -6px;
|
||||
transform: rotateX(180deg) rotateY(180deg);
|
||||
}
|
||||
|
||||
&.right-bottom {
|
||||
right: -6px;
|
||||
bottom: -6px;
|
||||
transform: rotateX(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user