mengff
/
jihe-hs
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'develop' of http://39.106.31.193:9211/mengff/jihe-hs into develop

wangqin
刘朋 1 year ago
parent
bf358d31fe 846d776ccc
commit
336d895eef
7 changed files with 218 additions and 176 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      ruoyi-ui/src/views/JiHeExpressway/components/InputSearch/index.vue
  2. 34
      ruoyi-ui/src/views/JiHeExpressway/components/Pagination.vue
  3. 2
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/firstResponders/index.vue
  4. 12
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dailyDisposal/assets/charts.js
  5. 119
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dailyDisposal/index.vue
  6. 6
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/assets/charts.js
  7. 183
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/index.vue

2
ruoyi-ui/src/views/JiHeExpressway/components/InputSearch/index.vue
View File

@ -105,7 +105,7 @@ export default {
return { return {
visible: false, visible: false,
types: this.type, types: this.type,
value: this.valueData, value: "",
width: null, width: null,
popperOptions: { popperOptions: {
popHideCallBack: () => { popHideCallBack: () => {

34
ruoyi-ui/src/views/JiHeExpressway/components/Pagination.vue
View File

@ -1,37 +1,43 @@
<template> <template>
<ElPagination v-on="$listeners" v-bind="getProps" ref="ElPaginationRef" class="Pagination" /> <ElPagination
v-on="$listeners"
v-bind="getProps"
ref="ElPaginationRef"
class="Pagination"
/>
</template> </template>
<script> <script>
export default { export default {
name: 'Pagination', name: "Pagination",
computed: { computed: {
getProps() { getProps() {
return { return {
// total // total
layout: "prev, pager, next, sizes, jumper", layout: "prev, pager, next, sizes, jumper,total",
...this.$attrs, ...this.$attrs,
small: true, small: true,
} };
} },
}, },
mounted() { mounted() {
if (!this.$refs.ElPaginationRef) return; if (!this.$refs.ElPaginationRef) return;
const jumpPageDom = this.$refs.ElPaginationRef.$el.querySelector(".el-pagination__jump"); const jumpPageDom = this.$refs.ElPaginationRef.$el.querySelector(
".el-pagination__jump"
);
if (jumpPageDom?.childNodes?.[0]?.nodeValue) if (jumpPageDom?.childNodes?.[0]?.nodeValue)
jumpPageDom.childNodes[0].nodeValue = "跳至"; jumpPageDom.childNodes[0].nodeValue = "跳至";
} },
} };
</script> </script>
<style lang='scss' scoped> <style lang="scss" scoped>
.Pagination { .Pagination {
// color: #fff; // color: #fff;
::v-deep { ::v-deep {
> button, > button,
> ul li { > ul li {
background: #064258; background: #064258;
@ -42,20 +48,20 @@ export default {
> button { > button {
padding: 0 3px; padding: 0 3px;
border: 1px solid #00B3CC; border: 1px solid #00b3cc;
} }
> ul li { > ul li {
background: linear-gradient(180deg, #004960 0%, #004B62 100%); background: linear-gradient(180deg, #004960 0%, #004b62 100%);
margin: 0 1.5px; margin: 0 1.5px;
&.active { &.active {
background: linear-gradient(180deg, #005C79 0%, #009BCC 100%); background: linear-gradient(180deg, #005c79 0%, #009bcc 100%);
} }
} }
.el-pagination__total { .el-pagination__total {
color: #FFF; color: #fff;
} }
.el-pagination__sizes { .el-pagination__sizes {

2
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/firstResponders/index.vue
View File

@ -28,9 +28,7 @@
:formConfigOptions="{ labelWidth: '72px' }" :formConfigOptions="{ labelWidth: '72px' }"
placeholder="请输入姓名、电话，回车搜索" placeholder="请输入姓名、电话，回车搜索"
type="input" type="input"
:valueData="valueData"
:params="params" :params="params"
:queryParams="queryParams"
@handleSearch="handleSearch" @handleSearch="handleSearch"
/> />
</div> </div>

12
ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dailyDisposal/assets/charts.js
View File

@ -4,7 +4,7 @@ window.echartsData = [
{ value: 35, name: "已处理" }, { value: 35, name: "已处理" },
]; ];
window.colorList = ["#FFee0B", "#61D8FF", "#6AE0BC"]; window.colorList = ["#FFee0B", "#61D8FF", "#6AE0BC", "#1DA7FF"];
window.count = 0; window.count = 0;
echartsData.forEach((it) => { echartsData.forEach((it) => {
@ -66,10 +66,10 @@ var options = {
{ {
name: "", name: "",
type: "pie", type: "pie",
radius: "60px", radius: "70%",
width: "200px", // width: "200px",
center: ["130px", "50%"], center: ["130px", "50%"],
roseType: "radius", // roseType: "radius",
label: { label: {
show: false, show: false,
position: "outside", position: "outside",
@ -111,11 +111,11 @@ var options = {
{ {
name: "", name: "",
type: "pie", type: "pie",
radius: "70px", radius: "80%",
hoverAnimation: false, hoverAnimation: false,
emphasis: { scale: false }, emphasis: { scale: false },
center: ["130px", "50%"], center: ["130px", "50%"],
roseType: "radius", // roseType: "radius",
label: { label: {
show: false, show: false,
position: "outside", position: "outside",

119
ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/dailyDisposal/index.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class='congestion'> <div class="congestion">
<WgtTitle :title="'日事件处置情况占比'"></WgtTitle> <WgtTitle :title="'日事件处置情况占比'"></WgtTitle>
<div class="board"> <div class="board">
<div class="charts keep-ratio" id="dailyDisposal"></div> <div class="charts keep-ratio" id="dailyDisposal"></div>
@ -8,51 +8,56 @@
</template> </template>
<script> <script>
import WgtTitle from "../../../widgets/title";
import WgtTitle from '../../../widgets/title'
import * as echarts from "echarts"; import * as echarts from "echarts";
import chartsStatistics from "./assets/charts"; import chartsStatistics from "./assets/charts";
import { getWarningStateDay } from '../../../../../../../api/event/perceiveEvent'; import { getWarningStateDay } from "../../../../../../../api/event/perceiveEvent";
const drawRoundRect = (ctx, x, y, width, height, radius, gr) => { const drawRoundRect = (ctx, x, y, width, height, radius, gr) => {
// ctx, 矩形距离x坐标位置, 矩形距离y坐标的位置, 矩形的宽, 矩形的长,圆角角度 // ctx, 矩形距离x坐标位置, 矩形距离y坐标的位置, 矩形的宽, 矩形的长,圆角角度
ctx.beginPath(); ctx.beginPath();
ctx.fillStyle = gr; ctx.fillStyle = gr;
ctx.arc(x + radius, y + radius, radius, Math.PI, Math.PI * 3 / 2); ctx.arc(x + radius, y + radius, radius, Math.PI, (Math.PI * 3) / 2);
ctx.lineTo(width - radius + x, y); ctx.lineTo(width - radius + x, y);
ctx.arc(width - radius + x, radius + y, radius, Math.PI * 3 / 2, Math.PI * 2); ctx.arc(
width - radius + x,
radius + y,
radius,
(Math.PI * 3) / 2,
Math.PI * 2
);
ctx.lineTo(width + x, height + y - radius); ctx.lineTo(width + x, height + y - radius);
ctx.arc(width - radius + x, height - radius + y, radius, 0, Math.PI * 1 / 2); ctx.arc(
width - radius + x,
height - radius + y,
radius,
0,
(Math.PI * 1) / 2
);
ctx.lineTo(radius + x, height + y); ctx.lineTo(radius + x, height + y);
ctx.arc(radius + x, height - radius + y, radius, Math.PI * 1 / 2, Math.PI); ctx.arc(radius + x, height - radius + y, radius, (Math.PI * 1) / 2, Math.PI);
ctx.closePath(); ctx.closePath();
//ctx.stroke(); //ctx.stroke();
ctx.fill() ctx.fill();
} };
export default { export default {
name: 'dailyDisposal', name: "dailyDisposal",
components: { components: {
WgtTitle WgtTitle,
}, },
data() { data() {
return { return {};
}
}, },
created() { created() {},
methods: {},
},
methods: {
},
mounted() { mounted() {
setTimeout(() => { setTimeout(() => {
this.$nextTick(() => { this.$nextTick(() => {
var myChart = echarts.init(document.getElementById('dailyDisposal')); var myChart = echarts.init(document.getElementById("dailyDisposal"));
getWarningStateDay().then(res => { getWarningStateDay().then((res) => {
if (res.code == 200) { if (res.code == 200) {
let data = res.data; let data = res.data;
if (data.length > 0) { if (data.length > 0) {
@ -69,90 +74,85 @@ export default {
// it.number = 86; // it.number = 86;
echartsData.push({ echartsData.push({
name: "上报", name: "上报",
value: it.number value: it.number,
}); });
} }
if (it.warningState == 2) { if (it.warningState == 2) {
echartsData.push({ echartsData.push({
name: "已完成", name: "已完成",
value: it.number value: it.number,
}); });
} }
if (it.warningState == 3) { if (it.warningState == 3) {
echartsData.push({ echartsData.push({
name: "已终止", name: "已终止",
value: it.number value: it.number,
}); });
} }
if (it.warningState == 4) { if (it.warningState == 4) {
echartsData.push({ echartsData.push({
name: "自动结束", name: "自动结束",
value: it.number value: it.number,
}); });
} }
} }
chartsStatistics.legend.data = window.echartsData?.map(x => x); chartsStatistics.legend.data = window.echartsData?.map((x) => x);
chartsStatistics.series[0].data = echartsData.map((item, index) => { chartsStatistics.series[0].data = echartsData.map(
(item, index) => {
return { return {
...item, ...item,
label: { label: {
color: colorList[index] color: colorList[index],
} },
};
} }
}) );
chartsStatistics.series[1].data = echartsData.map((item, index) => { chartsStatistics.series[1].data = echartsData.map(
(item, index) => {
return { return {
...item, ...item,
label: { label: {
color: colorList[index] color: colorList[index],
} },
};
} }
}) );
} }
} }
myChart.setOption(chartsStatistics); myChart.setOption(chartsStatistics);
}); });
const domMap = document.getElementById("dailyDisposal"); const domMap = document.getElementById("dailyDisposal");
let parentDiv = domMap.firstChild; let parentDiv = domMap.firstChild;
// 创建canvas // 创建canvas
let canvas = document.createElement('canvas'); let canvas = document.createElement("canvas");
canvas.width = parentDiv.offsetWidth; canvas.width = parentDiv.offsetWidth;
canvas.height = parentDiv.offsetHeight; canvas.height = parentDiv.offsetHeight;
parentDiv.appendChild(canvas); parentDiv.appendChild(canvas);
const context = canvas.getContext('2d'); const context = canvas.getContext("2d");
// 填充渐变颜色 // 填充渐变颜色
var gr = context.createLinearGradient(230, 0, 360, 0); var gr = context.createLinearGradient(230, 0, 360, 0);
// 颜色断点 // 颜色断点
gr.addColorStop(1, 'rgba(92,197,255,0)'); gr.addColorStop(1, "rgba(92,197,255,0)");
gr.addColorStop(0, 'rgba(92,197,255,0.5)'); gr.addColorStop(0, "rgba(92,197,255,0.5)");
context.lineWidth = 1; // 设置线段宽度 context.lineWidth = 1; // 设置线段宽度
// 绘制圆角矩形 // 绘制圆角矩形
drawRoundRect(context, 230, 36, 180, 24, 12, gr) drawRoundRect(context, 230, 36, 180, 24, 12, gr);
drawRoundRect(context, 230, 63, 180, 24, 12, gr) drawRoundRect(context, 230, 63, 180, 24, 12, gr);
drawRoundRect(context, 230, 90, 180, 24, 12, gr) drawRoundRect(context, 230, 90, 180, 24, 12, gr);
drawRoundRect(context, 230, 117, 180, 24, 12, gr) drawRoundRect(context, 230, 117, 180, 24, 12, gr);
}); });
}); });
}, },
} };
</script> </script>
<style lang='scss' scoped> <style lang="scss" scoped>
.congestion { .congestion {
width: 100%; width: 100%;
@ -164,11 +164,15 @@ export default {
border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px;
opacity: 1; opacity: 1;
border: 1px solid; border: 1px solid;
border-image: linear-gradient(360deg, rgba(55, 231, 255, 0.3), rgba(55, 231, 255, 0)) 1 1; border-image: linear-gradient(
360deg,
rgba(55, 231, 255, 0.3),
rgba(55, 231, 255, 0)
)
1 1;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
} }
@ -177,4 +181,3 @@ export default {
width: 100%; width: 100%;
} }
</style> </style>

6
ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/assets/charts.js
View File

@ -125,16 +125,18 @@ var options = {
data: lengData, data: lengData,
formatter: function (name) { formatter: function (name) {
let target = 0; let target = 0;
let percent = 0;
if (!mainData) return ""; if (!mainData) return "";
for (let i = 0; i < window.mainData.length; i++) { for (let i = 0; i < window.mainData.length; i++) {
if (window.mainData[i].name === name) { if (window.mainData[i].name === name) {
target = window.mainData[i].value; target = window.mainData[i].value;
percent = window.mainData[i].percent;
} }
} }
console.log('starget',target) console.log("starget", target);
var arr = [ var arr = [
"{ast|" + name + "}", "{ast|" + name + "}",
"{bst|" + Math.round((target * 100).toFixed(0)) + "% }", "{bst|" + Math.round((percent * 100).toFixed(0)) + "% }",
"{cst|" + Math.round(target) + "起}", "{cst|" + Math.round(target) + "起}",
]; ];
return arr.join(" "); return arr.join(" ");

183
ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventSource/index.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div @resize="changeReisze" class='congestion'> <div @resize="changeReisze" class="congestion">
<WgtTitle :title="'感知事件源分析'"></WgtTitle> <WgtTitle :title="'感知事件源分析'"></WgtTitle>
<div class="board"> <div class="board">
<div class="charts keep-ratio" id="eventSource"></div> <div class="charts keep-ratio" id="eventSource"></div>
@ -8,42 +8,49 @@
</template> </template>
<script> <script>
import WgtTitle from "../../../widgets/title";
import WgtTitle from '../../../widgets/title'
import * as echarts from "echarts"; import * as echarts from "echarts";
import chartsStatistics from "./assets/charts"; import chartsStatistics from "./assets/charts";
import { getWarningSourceGroup } from '../../../../../../../api/event/perceiveEvent'; import { getWarningSourceGroup } from "../../../../../../../api/event/perceiveEvent";
const drawRoundRect = (ctx, x, y, width, height, radius, gr) => { const drawRoundRect = (ctx, x, y, width, height, radius, gr) => {
// ctx, 矩形距离x坐标位置, 矩形距离y坐标的位置, 矩形的宽, 矩形的长,圆角角度 // ctx, 矩形距离x坐标位置, 矩形距离y坐标的位置, 矩形的宽, 矩形的长,圆角角度
ctx.beginPath(); ctx.beginPath();
ctx.fillStyle = gr; ctx.fillStyle = gr;
ctx.arc(x + radius, y + radius, radius, Math.PI, Math.PI * 3 / 2); ctx.arc(x + radius, y + radius, radius, Math.PI, (Math.PI * 3) / 2);
ctx.lineTo(width - radius + x, y); ctx.lineTo(width - radius + x, y);
ctx.arc(width - radius + x, radius + y, radius, Math.PI * 3 / 2, Math.PI * 2); ctx.arc(
width - radius + x,
radius + y,
radius,
(Math.PI * 3) / 2,
Math.PI * 2
);
ctx.lineTo(width + x, height + y - radius); ctx.lineTo(width + x, height + y - radius);
ctx.arc(width - radius + x, height - radius + y, radius, 0, Math.PI * 1 / 2); ctx.arc(
width - radius + x,
height - radius + y,
radius,
0,
(Math.PI * 1) / 2
);
ctx.lineTo(radius + x, height + y); ctx.lineTo(radius + x, height + y);
ctx.arc(radius + x, height - radius + y, radius, Math.PI * 1 / 2, Math.PI); ctx.arc(radius + x, height - radius + y, radius, (Math.PI * 1) / 2, Math.PI);
ctx.closePath(); ctx.closePath();
//ctx.stroke(); //ctx.stroke();
ctx.fill() ctx.fill();
} };
export default { export default {
name: 'EventSource', name: "EventSource",
components: { components: {
WgtTitle WgtTitle,
}, },
data() { data() {
return { return {};
}
}, },
created() { created() {},
},
methods: { methods: {
changeReisze() { changeReisze() {
this.myChart.resize(); this.myChart.resize();
@ -52,7 +59,7 @@ export default {
mounted() { mounted() {
setTimeout(() => { setTimeout(() => {
this.$nextTick(() => { this.$nextTick(() => {
var myChart = echarts.init(document.getElementById('eventSource')); var myChart = echarts.init(document.getElementById("eventSource"));
getWarningSourceGroup().then((res) => { getWarningSourceGroup().then((res) => {
if (res.code == 200) { if (res.code == 200) {
@ -63,32 +70,36 @@ export default {
let chartData = [ let chartData = [
{ {
average: 0, average: 0,
name: '视频AI', name: "视频AI",
percent: 0.3 percent: 0.3,
}, },
{ {
average: 0, average: 0,
name: '雷达识别', name: "雷达识别",
percent: 0.2 percent: 0.2,
}, { },
{
average: 0, average: 0,
name: '锥桶', name: "锥桶",
percent: 0.1 percent: 0.1,
}, { },
{
average: 0, average: 0,
name: '护栏碰撞', name: "护栏碰撞",
percent: 0.2 percent: 0.2,
}, { },
{
average: 0, average: 0,
name: '扫码报警', name: "扫码报警",
percent: 0.1 percent: 0.1,
}, { },
{
average: 0, average: 0,
name: '非机预警', name: "非机预警",
percent: 0.1 percent: 0.1,
}, },
] ];
data.forEach(it => { data.forEach((it) => {
if (it.warningSource == 1) { if (it.warningSource == 1) {
chartData[0].average += it.number; chartData[0].average += it.number;
} }
@ -109,9 +120,16 @@ export default {
} }
// total ++; // total ++;
// drawRoundRect(context, 231, 37 + (index * 27), 138, 20, 12, gr); // drawRoundRect(context, 231, 37 + (index * 27), 138, 20, 12, gr);
}) });
// console.log('data',chartData) // console.log('data',chartData)
let colorList = ['#006EDF', '#00FF00', '#FFC30D', '#FF8400', '#1DA7FF', '#2967EA']; let colorList = [
"#006EDF",
"#00FF00",
"#FFC30D",
"#FF8400",
"#1DA7FF",
"#2967EA",
];
let lengData = []; let lengData = [];
let mainData = []; let mainData = [];
@ -126,55 +144,70 @@ export default {
name: it.name, name: it.name,
color: colorList[i], color: colorList[i],
value: it.average, value: it.average,
percent: (it.average / total) || 0 percent: it.average / total || 0,
}) });
} }
window.mainData = mainData; window.mainData = mainData;
// console.log('mainData', mainData) console.log("mainData", mainData);
chartsStatistics.title.text = `{tb|${total}}`; chartsStatistics.title.text = `{tb|${total}}`;
chartsStatistics.title.subtext = "{zb|总数}"; chartsStatistics.title.subtext = "{zb|总数}";
chartsStatistics.legend.data = lengData; chartsStatistics.legend.data = lengData;
chartsStatistics.series[0].data = mainData; chartsStatistics.series[0].data = mainData;
// chartsStatistics.legend.formatter = (name) => {
myChart.on('mouseover', (params) => { // let target = 0;
// console.log('params',params) // if (!mainData) return "";
if (params.componentType == 'graphic') { // for (let i = 0; i < window.mainData.length; i++) {
return // if (window.mainData[i].name === name) {
} // target = window.mainData[i].value;
chartsStatistics.title.text = `{tb|${params.percent}%}`; // }
chartsStatistics.title.subtext = `{zb|${params.data.name}}`; // }
// chartsStatistics.title.left = "22%"; // console.log("starget", target);
myChart.setOption(chartsStatistics); // var arr = [
}) // "{ast|" + name + "}",
// "{bst|" + Math.round((target * 100).toFixed(0)) + "% }",
// 用户鼠标移出时，重新开始自动切换 // "{cst|" + Math.round(target) + "起}",
myChart.on('mouseout', (params) => { // ];
chartsStatistics.title.text = `{tb|${total}}`; // return arr.join(" ");
chartsStatistics.title.subtext = "{zb|总数}"; // };
// chartsStatistics.title.left = "25%";
myChart.setOption(chartsStatistics); // myChart.on("mouseover", (params) => {
}) // // console.log('params',params)
// if (params.componentType == "graphic") {
// return;
// }
// chartsStatistics.title.text = `{tb|${params.percent}%}`;
// chartsStatistics.title.subtext = `{zb|${params.data.name}}`;
// // chartsStatistics.title.left = "22%";
// myChart.setOption(chartsStatistics);
// });
// // 用户鼠标移出时，重新开始自动切换
// myChart.on("mouseout", (params) => {
// chartsStatistics.title.text = `{tb|${total}}`;
// chartsStatistics.title.subtext = "{zb|总数}";
// // chartsStatistics.title.left = "25%";
// myChart.setOption(chartsStatistics);
// });
// } // }
} }
myChart.setOption(chartsStatistics); myChart.setOption(chartsStatistics);
}) });
const domMap = document.getElementById("eventSource"); const domMap = document.getElementById("eventSource");
let parentDiv = domMap.firstChild; let parentDiv = domMap.firstChild;
// 创建canvas // 创建canvas
let canvas = document.createElement('canvas'); let canvas = document.createElement("canvas");
canvas.width = parentDiv.offsetWidth; canvas.width = parentDiv.offsetWidth;
canvas.height = parentDiv.offsetHeight; canvas.height = parentDiv.offsetHeight;
parentDiv.appendChild(canvas); parentDiv.appendChild(canvas);
const context = canvas.getContext('2d'); const context = canvas.getContext("2d");
// 填充渐变颜色 // 填充渐变颜色
let gr = context.createLinearGradient(230, 0, 360, 0); let gr = context.createLinearGradient(230, 0, 360, 0);
gr.addColorStop(1, 'rgba(92,197,255,0)'); gr.addColorStop(1, "rgba(92,197,255,0)");
gr.addColorStop(0, 'rgba(92,197,255,0.3)'); gr.addColorStop(0, "rgba(92,197,255,0.3)");
drawRoundRect(context, 214, 15, 134, 21, 12, gr); drawRoundRect(context, 214, 15, 134, 21, 12, gr);
drawRoundRect(context, 214, 42, 134, 21, 12, gr); drawRoundRect(context, 214, 42, 134, 21, 12, gr);
drawRoundRect(context, 214, 69, 134, 21, 12, gr); drawRoundRect(context, 214, 69, 134, 21, 12, gr);
@ -184,17 +217,14 @@ export default {
context.lineWidth = 1; // 设置线段宽度 context.lineWidth = 1; // 设置线段宽度
this.myChart = myChart; this.myChart = myChart;
}); });
}); });
}, },
} };
</script> </script>
<style lang='scss' scoped> <style lang="scss" scoped>
.congestion { .congestion {
width: 100%; width: 100%;
@ -206,11 +236,15 @@ export default {
border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px;
opacity: 1; opacity: 1;
border: 1px solid; border: 1px solid;
border-image: linear-gradient(360deg, rgba(55, 231, 255, 0.3), rgba(55, 231, 255, 0)) 1 1; border-image: linear-gradient(
360deg,
rgba(55, 231, 255, 0.3),
rgba(55, 231, 255, 0)
)
1 1;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
} }
@ -219,4 +253,3 @@ export default {
width: 100%; width: 100%;
} }
</style> </style>
Write Preview
Loading…
Cancel
Save