Browse Source

处置过程

wangqin
Joe 11 months ago
parent
commit
1272736ebe
  1. 47
      ruoyi-ui/src/views/JiHeExpressway/components/Popover/index.vue
  2. 2
      ruoyi-ui/src/views/JiHeExpressway/components/RadioGroup/RadioButton.vue
  3. 9
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/index.vue
  4. 11
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DisposalProcess/index.vue
  5. 54
      ruoyi-ui/src/views/JiHeExpressway/scss/el-reset.scss

47
ruoyi-ui/src/views/JiHeExpressway/components/Popover/index.vue

@ -1,47 +0,0 @@
<template>
<ElPopover class='Popover' v-bind="getBind" v-on="$listeners">
<slot />
<template #reference>
<slot name="reference" />
</template>
</ElPopover>
</template>
<script>
export default {
name: 'Popover',
computed: {
getBind() {
return {
trigger: 'hover',
placement: "left",
...this.$attrs,
popperClass: "Popover-Scope-Screen"
}
}
}
}
</script>
<style lang='scss'>
div.el-popper.Popover-Scope-Screen {
background: linear-gradient(180deg, #005C79 0%, #009BCC 100%);
border: 0;
color: #fff;
font-size: 14px;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #FFFFFF;
div.popper__arrow {
border-left-color: #00799f;
&::after {
border-left-color: #00799f;
}
}
}
</style>
<style lang='scss' scoped>
.Popover {}
</style>

2
ruoyi-ui/src/views/JiHeExpressway/components/RadioGroup/RadioButton.vue

@ -38,7 +38,7 @@ export default {
::v-deep { ::v-deep {
span.el-radio-button__inner { span.el-radio-button__inner {
background: linear-gradient(180deg, #005C79 0%, #009BCC 100%); background: linear-gradient(180deg, #005C79 0%, #009BCC 100%);
border-color: rgba(0, 0, 0, 0); // border-color: rgba(0, 0, 0, 0);
} }
} }
} }

9
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/index.vue

@ -6,13 +6,13 @@
<div class="right border"> <div class="right border">
<div :class="['item', { active: active === item.key }]" v-for="item in operation" :key="item.key" <div :class="['item', { active: active === item.key }]" v-for="item in operation" :key="item.key"
@click="handleClick(item)"> @click="handleClick(item)">
<Popover :disabled="item.key !== 'weather'"> <ElPopover :disabled="item.key !== 'weather'" trigger="hover" placement="left">
<div v-if="item.key === 'weather'"> <div v-if="item.key === 'weather'">
天气 能见度 风向西南 风力1 天气 能见度 风向西南 风力1
</div> </div>
<div class="label" slot="reference" <div class="label" slot="reference"
:style="{ backgroundImage: `url(${require(`./images/${item.key}${active === item.key ? '-active' : ''}.svg`)})` }" /> :style="{ backgroundImage: `url(${require(`./images/${item.key}${active === item.key ? '-active' : ''}.svg`)})` }" />
</Popover> </ElPopover>
</div> </div>
</div> </div>
</Card> </Card>
@ -21,13 +21,10 @@
<script> <script>
import Card from "./../../components/Card.vue"; import Card from "./../../components/Card.vue";
import Popover from "@screen/components/Popover/index.vue"
export default { export default {
name: 'CrowdnessIndicatorRankings', name: 'CrowdnessIndicatorRankings',
components: { components: {
Card, Card
Popover
}, },
data() { data() {
return { return {

11
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DisposalProcess/index.vue

@ -27,7 +27,9 @@
<TimeLine1 :data="timeLine1List" :filterDistance="filterDistance" /> <TimeLine1 :data="timeLine1List" :filterDistance="filterDistance" />
<TimeLine2 :data="timeLine2List" style="flex: 1;" /> <TimeLine2 :data="timeLine2List" style="flex: 1;" />
<div class="bottom"> <div class="bottom">
<FormSelect placeholder="请选择关键点" />
<RadioGroup :list="[{ key: 'input', label: '输入' }, { key: 'upload', label: '上传' }]" value="input" type="button" /> <RadioGroup :list="[{ key: 'input', label: '输入' }, { key: 'upload', label: '上传' }]" value="input" type="button" />
<FormInput placeholder="请输入调度指令" />
<ButtonGradient class="title-button special-button"> <ButtonGradient class="title-button special-button">
发送 发送
</ButtonGradient> </ButtonGradient>
@ -42,6 +44,8 @@
import Card from "./../../components/Card.vue"; import Card from "./../../components/Card.vue";
import ButtonGradient from '@screen/components/Buttons/ButtonGradient.vue'; import ButtonGradient from '@screen/components/Buttons/ButtonGradient.vue';
import RadioGroup from '@screen/components/RadioGroup/index.vue'; import RadioGroup from '@screen/components/RadioGroup/index.vue';
import FormSelect from '@screen/components/FormConfig/components/FormSelect.vue';
import FormInput from '@screen/components/FormConfig/components/FormInput.vue';
import TimeLine1 from "@screen/components/TimeLine/TimeLine1/index"; import TimeLine1 from "@screen/components/TimeLine/TimeLine1/index";
import TimeLine2 from "@screen/components/TimeLine/TimeLine2/index"; import TimeLine2 from "@screen/components/TimeLine/TimeLine2/index";
@ -56,7 +60,9 @@ export default {
ButtonGradient, ButtonGradient,
TimeLine1, TimeLine1,
TimeLine2, TimeLine2,
RadioGroup RadioGroup,
FormInput,
FormSelect
}, },
emit: ['fullHeight'], emit: ['fullHeight'],
data() { data() {
@ -107,7 +113,8 @@ export default {
} }
.bottom { .bottom {
display: flex; display: grid;
grid-template-columns: .5fr auto 1fr 90px 90px;
width: 100%; width: 100%;
gap: 6px; gap: 6px;
} }

54
ruoyi-ui/src/views/JiHeExpressway/scss/el-reset.scss

@ -1,29 +1,10 @@
div.el-popper { div.el-popper {
background: #123542; background: linear-gradient(180deg, #005c79 0%, #009bcc 100%);
box-shadow: 2px 2px 8px 0px rgba(82, 90, 102, 0.08), color: #fff;
1px 1px 2px 0px rgba(82, 90, 102, 0.04);
border-radius: 4px 4px 4px 4px;
opacity: 1;
border: 0;
.el-select-dropdown__list {
.el-select-dropdown__item {
font-size: 15px; font-size: 15px;
font-family: PingFang SC, PingFang SC; font-family: PingFang SC, PingFang SC;
font-weight: 500; font-weight: 500;
color: #ffffff; border: 0;
/**
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
*/
&:hover {
background: #0d5f79;
}
&.hover {
background: #0d5f79;
}
}
}
&[x-placement^="top"] { &[x-placement^="top"] {
div.popper__arrow { div.popper__arrow {
@ -61,6 +42,34 @@ div.el-popper {
} }
} }
} }
}
div.el-popper.el-select-dropdown {
background: #123542;
box-shadow: 2px 2px 8px 0px rgba(82, 90, 102, 0.08),
1px 1px 2px 0px rgba(82, 90, 102, 0.04);
border-radius: 4px;
.el-select-dropdown__list {
.el-select-dropdown__item {
font-size: 15px;
font-family: PingFang SC, PingFang SC;
color: #fff;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
/**
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
*/
&:hover {
background: #0d5f79;
}
&.hover {
background: #0d5f79;
}
}
}
&.el-select-dropdown { &.el-select-dropdown {
&[x-placement^="top"] { &[x-placement^="top"] {
div.popper__arrow { div.popper__arrow {
@ -100,7 +109,6 @@ div.el-popper {
} }
} }
} }
div.el-scrollbar { div.el-scrollbar {
.el-scrollbar__wrap { .el-scrollbar__wrap {
/** /**

Loading…
Cancel
Save