|
|
<template>
|
|
|
<div style="padding-bottom: 10px;">
|
|
|
<LxHeader
|
|
|
icon="md-apps"
|
|
|
:text="$route.meta.title"
|
|
|
style="margin-bottom: 10px; border: 0px; margin-top: 15px"
|
|
|
text="调度指令"
|
|
|
>
|
|
|
</LxHeader>
|
|
|
|
|
|
<div class="weather panel">
|
|
|
<div class="title">动态</div>
|
|
|
|
|
|
<template>
|
|
|
<div class="weather-container">
|
|
|
<Card class="weather-container__card" :class="'card'+(index+1)" v-for="(item,key,index) in weatherKv" :style="{ 'background': item.color || '#fff','color': '#fff','border-radius': '14px' }">
|
|
|
<template #title>
|
|
|
<div style="display: flex;align-items: center;">
|
|
|
<div style="padding: 0 14px 0 10px;" v-html="item.icon"></div>
|
|
|
<span style="font-weight: 600;font-size: 17px;">{{ item.label }}</span>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template>
|
|
|
<template>
|
|
|
<div class="text" v-html="splitSpan(weather ? weather[key] : '')"></div>
|
|
|
</template>
|
|
|
</template>
|
|
|
</Card>
|
|
|
</div>
|
|
|
</template>
|
|
|
</div>
|
|
|
|
|
|
<div class="point panel">
|
|
|
<div style="display: flex;justify-content: space-between;align-items: center;">
|
|
|
<div class="title">
|
|
|
<span>创建调令</span>
|
|
|
<Button type="primary" size="small" style="margin-left: 10px;" @click="$emit('quickCreate')">紧急调令</Button>
|
|
|
</div>
|
|
|
<Button size="small" type="primary" @click="isShowCreate = !isShowCreate">{{ isShowCreate ? '收起' : '展开'}}<i class="el-icon-arrow-down el-icon--right"></i></Button>
|
|
|
</div>
|
|
|
|
|
|
<transition name="create">
|
|
|
<div class="point-container" v-show="isShowCreate">
|
|
|
<Card class="point-container__card">
|
|
|
<createDispatch ref="createDispatch" @createdTransfer="isShowCreate = false"></createDispatch>
|
|
|
</Card>
|
|
|
</div>
|
|
|
</transition>
|
|
|
</div>
|
|
|
|
|
|
<div class="dispatch panel">
|
|
|
<div class="title">已创建待下发调令</div>
|
|
|
|
|
|
<div class="point-container">
|
|
|
<Card class="point-container__card">
|
|
|
<dispatchList @cloneTransfers="cloneTransfers"></dispatchList>
|
|
|
</Card>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { weather, info } from "@/api/other";
|
|
|
import { index, save } from "@/api/system/baseForm";
|
|
|
import { uuid } from "@/utils";
|
|
|
|
|
|
import LxHeader from "@/components/LxHeader/index.vue";
|
|
|
// import step1 from "@/views/order/component/step1.vue";
|
|
|
// import step2 from "@/views/order/component/step2.vue";
|
|
|
// import step3 from "@/views/order/component/step3.vue";
|
|
|
import createDispatch from "@/views/order/component/createDispatch.vue";
|
|
|
import dispatchList from "@/views/order/component/dispatchList.vue";
|
|
|
import axios from "axios";
|
|
|
export default {
|
|
|
components: {
|
|
|
LxHeader,
|
|
|
createDispatch,
|
|
|
dispatchList
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
isShowCreate: true,
|
|
|
currentStep: 0,
|
|
|
|
|
|
data: [],
|
|
|
weather: {},
|
|
|
weatherKv: {
|
|
|
weather: {
|
|
|
label: '今日天气',
|
|
|
icon: `<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
|
|
<path d="M281.583167 161.025417c3.1569 7.773034 10.643408 12.485359 18.545378 12.485359 2.5071 0 5.057179-0.473791 7.522324-1.475608 10.239202-4.157693 15.167444-15.829524 11.009751-26.067702l-26.532283-65.327868c-4.158716-10.240225-15.83157-15.167444-26.067702-11.009751-10.239202 4.157693-15.167444 15.829524-11.009751 26.067702L281.583167 161.025417z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M78.55103 290.170752l64.954361 27.431769c2.541893 1.073448 5.179976 1.582031 7.776104 1.582031 7.801686 0 15.21554-4.590552 18.441001-12.229532 4.299933-10.17985-0.467651-21.918195-10.647501-26.217105l-64.954361-27.431769c-10.17985-4.298909-21.919219 0.466628-26.217105 10.647501C63.603597 274.134521 68.37118 285.871843 78.55103 290.170752z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M157.393703 524.045337c10.239202-4.157693 15.167444-15.827477 11.009751-26.066679-4.158716-10.239202-15.829524-15.172561-26.067702-11.008728L77.007885 513.502213c-10.239202 4.157693-15.167444 15.827477-11.009751 26.066679 3.1569 7.773034 10.643408 12.486382 18.545378 12.486382 2.5071 0 5.056156-0.474814 7.522324-1.477654L157.393703 524.045337z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M651.359978 321.847196c2.5071 0 5.056156-0.473791 7.522324-1.475608l63.406099-25.7515c10.239202-4.157693 15.167444-15.829524 11.009751-26.067702-4.157693-10.240225-15.829524-15.167444-26.067702-11.009751l-63.406099 25.7515c-10.239202 4.157693-15.167444 15.829524-11.009751 26.067702C635.971499 317.134871 643.458007 321.847196 651.359978 321.847196z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M496.752738 174.136016c2.541893 1.073448 5.179976 1.582031 7.776104 1.582031 7.801686 0 15.21554-4.590552 18.441001-12.229532l27.432793-64.955384c4.299933-10.17985-0.466628-21.918195-10.647501-26.217105-10.18292-4.298909-21.919219 0.466628-26.217105 10.647501l-27.432793 64.955384C481.805304 158.098761 486.572888 169.837106 496.752738 174.136016z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M916.674623 693.742251c-23.938202-24.434505-54.67525-40.053228-88.025822-45.029566-7.003508-122.552174-106.647949-220.695425-229.836619-225.421053 0.496304-5.762237 0.76134-11.552104 0.76134-17.34504 0-110.179378-89.63753-199.815885-199.816908-199.815885s-199.815885 89.636506-199.815885 199.815885c0 56.262398 22.967084 108.316961 62.911842 145.645125-33.985022 18.200524-57.157791 54.05922-57.157791 95.231945 0 1.676176 0.038886 3.355421 0.118704 5.031597-66.419735 18.162662-114.362654 79.391165-114.362654 149.851936 0 85.653799 69.745481 155.338904 155.475004 155.338904l559.184649 0c40.85243 0 79.537498-16.07921 108.927875-45.278229 29.590945-29.39754 45.889143-68.352761 45.889143-109.687168C960.928522 761.346975 945.212586 722.872708 916.674623 693.742251zM239.959164 405.945569c0-88.112804 71.685669-159.797449 159.797449-159.797449 88.113827 0 159.798473 71.685669 159.798473 159.797449 0 6.4192-0.394996 12.830213-1.152243 19.176758-79.591733 10.394744-148.917658 60.171428-184.14088 132.332934-17.669428-12.011568-38.671765-18.584264-60.618613-18.584264-0.850367 0-1.696642 0.01228-2.541893 0.032746C266.426979 509.139859 239.959164 459.962833 239.959164 405.945569zM886.835014 883.378286c-21.841447 21.699208-50.510394 33.649378-80.723509 33.649378L246.926856 917.027663c-63.662949 0-115.456568-51.732222-115.456568-115.320469 0-57.346079 42.756803-106.451474 99.455129-114.224508 5.609765-0.76748 10.631128-3.87833 13.818727-8.558933 3.187599-4.679579 4.242627-10.490935 2.905166-15.993253-1.284249-5.279237-1.935072-10.69969-1.935072-16.10684 0-34.076096 25.218358-62.36335 57.969273-67.197448 1.010003 0.155543 2.025123 0.2415 3.036149 0.2415 2.081405 0 4.146437-0.327458 6.119371-0.958838 0.26913-0.00307 0.535189-0.020466 0.805342-0.020466 20.523429 0 39.736003 9.135054 52.710502 25.063839 4.588505 5.633301 11.875468 8.337899 19.026332 7.061836 7.154957-1.276063 13.054317-6.329149 15.413038-13.202697 27.64871-80.566944 103.490026-134.698818 188.720176-134.698818 110.010533 0 199.509916 89.456405 199.509916 199.409632 0 0.838088 0.019443 1.656733 0.040932 2.472308 0.013303 0.545422 0.034792 1.088798 0.023536 1.647523-0.224104 10.997472 8.470929 20.114107 19.465331 20.409842 30.166043 0.812505 58.411341 13.135158 79.533404 34.697243 21.166065 21.605064 32.82357 50.133817 32.82357 80.332606C920.91111 832.67551 908.809491 861.548094 886.835014 883.378286z"
|
|
|
fill="#fff"></path>
|
|
|
</svg>`,
|
|
|
color: 'linear-gradient(150deg, #879afe, #5164f6)'
|
|
|
},
|
|
|
water: {
|
|
|
label: '水情',
|
|
|
icon: `<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
|
|
<path fill="#fff"
|
|
|
d="M448.184 101.451c-0.903-7.267-12.85-7.267-13.754 0-29.928 241.246-182.938 290.943-182.938 458.589 0 103.601 86.891 187.578 189.835 187.578 102.904 0 189.796-83.978 189.796-187.578 0-167.646-153.011-217.343-182.939-458.589z m32.331 602.066c-10.778 0-19.46-8.704-19.46-19.461 0-10.756 8.723-19.46 19.46-19.46 26.809 0 48.61-21.719 48.61-48.465 0-10.757 8.702-19.46 19.46-19.46a19.46 19.46 0 0 1 17.94 11.823 19.285 19.285 0 0 1 1.56 7.637c0 48.198-39.29 87.386-87.57 87.386zM686.584 182.662c-0.321-2.58-4.563-2.58-4.883 0-10.626 85.654-64.952 103.298-64.952 162.82 0 36.783 30.85 66.599 67.4 66.599 36.536 0 67.386-29.816 67.386-66.599 0.001-59.522-54.325-77.167-64.951-162.82z m11.479 213.761a6.9 6.9 0 0 1-6.909-6.91 6.91 6.91 0 0 1 6.909-6.909c9.518 0 17.259-7.711 17.259-17.207a6.905 6.905 0 0 1 6.909-6.909 6.91 6.91 0 0 1 6.924 6.909c-0.001 17.112-13.95 31.026-31.092 31.026zM898.247 790.223c-14.688-6.216-31.634 0.65-37.851 15.338-16.46 38.884-54.66 64.682-97.613 64.682-43.511 0-82.097-26.461-98.17-66.073-5.997-14.781-22.839-21.9-37.617-15.904a28.722 28.722 0 0 0-13.197 10.808c-1.543 1.969-2.939 4.084-3.961 6.499-16.431 38.872-54.623 64.67-97.579 64.67-42.487 0-80.132-25.316-96.867-63.382-2.331-8.356-8.277-15.607-16.947-19.091-14.799-5.948-31.616 1.228-37.563 16.027-16.003 39.822-54.682 66.446-98.336 66.446-43.969 0-82.882-27.032-98.647-67.278-5.817-14.851-22.572-22.175-37.422-16.358-14.851 5.817-22.174 22.572-16.357 37.423C134.486 886.228 194.612 928 262.546 928c49.3 0 94.436-22.055 124.844-57.923C417.801 905.954 462.959 928 512.259 928c49.482 0 94.866-22.185 125.287-58.364C667.953 905.774 713.283 928 762.783 928c66.355 0 125.377-39.86 150.801-99.926 6.217-14.687-0.65-31.634-15.337-37.851z"></path>
|
|
|
</svg>`,
|
|
|
color: 'linear-gradient(150deg, #bf8bf8, #a251f8)'
|
|
|
},
|
|
|
rain: {
|
|
|
label: '降水',
|
|
|
icon: `<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
|
|
<path d="M377.0368 281.531733L369.629867 341.333333H273.066667a170.666667 170.666667 0 0 0 0 341.333334h477.866666a170.666667 170.666667 0 0 0 72.942934-325.0176l-37.341867-17.681067-1.672533-41.301333a204.8 204.8 0 0 0-407.790934-17.134934zM34.133333 512a238.933333 238.933333 0 0 1 238.933334-238.933333h36.2496a273.1008 273.1008 0 0 1 543.744 22.869333A238.933333 238.933333 0 0 1 750.933333 750.933333H273.1008a238.933333 238.933333 0 0 1-238.933333-238.933333z m267.332267 343.210667a34.133333 34.133333 0 0 0-56.797867-37.888l-68.266666 102.4a34.133333 34.133333 0 0 0 56.797866 37.888l68.266667-102.4z m238.933333 0a34.133333 34.133333 0 0 0-56.797866-37.888l-68.266667 102.4a34.133333 34.133333 0 0 0 56.797867 37.888l68.266666-102.4z m238.933334 0a34.133333 34.133333 0 0 0-56.797867-37.888l-68.266667 102.4a34.133333 34.133333 0 0 0 56.797867 37.888l68.266667-102.4z"
|
|
|
fill="#fff"></path>
|
|
|
</svg>`,
|
|
|
color: 'linear-gradient(150deg, #ffa797, #ff755b)'
|
|
|
},
|
|
|
prevent: {
|
|
|
label: '预警',
|
|
|
icon: `<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
|
|
<path d="M919.04 958.72H95.232c-16.896 0-30.72-13.824-30.72-30.72s13.824-30.72 30.72-30.72H919.04c16.896 0 30.72 13.824 30.72 30.72s-13.824 30.72-30.72 30.72z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M199.936 956.16c-16.896 0-30.72-13.824-30.72-30.72V567.808c0-186.368 151.552-337.92 337.92-337.92s337.92 151.552 337.92 337.92V921.6c0 16.896-13.824 30.72-30.72 30.72s-30.72-13.824-30.72-30.72V567.808c0-152.576-123.904-276.48-276.48-276.48s-276.48 123.904-276.48 276.48v357.632c0 16.896-13.824 30.72-30.72 30.72z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M465.152 801.024c-7.936 0-15.616-3.072-21.76-8.96-12.032-12.032-12.032-31.488-0.256-43.52l94.72-95.232-125.696-40.192c-9.216-2.816-16.384-9.984-19.456-18.944-3.072-8.96-2.048-19.2 3.328-27.136l87.296-133.12c9.216-14.08 28.416-18.176 42.496-8.704 14.08 9.216 18.176 28.416 8.704 42.496l-65.28 99.328 134.912 43.264c10.24 3.328 17.92 11.52 20.48 22.016s-0.512 21.248-7.936 28.928l-130.048 130.816c-5.632 6.144-13.568 8.96-21.504 8.96zM503.808 212.48c-16.896 0-30.72-13.824-30.72-30.72V74.24c0-16.896 13.824-30.72 30.72-30.72s30.72 13.824 30.72 30.72v107.52c0 16.896-13.824 30.72-30.72 30.72zM712.96 259.328c-5.888 0-12.032-1.792-17.408-5.376-14.08-9.728-17.664-28.672-7.936-42.752l60.672-88.576c9.728-14.08 28.672-17.664 42.752-7.936 14.08 9.728 17.664 28.672 7.936 42.752l-60.672 88.576c-5.888 8.448-15.36 13.312-25.344 13.312zM854.784 411.648c-8.96 0-17.92-3.84-24.064-11.52-10.496-13.312-8.448-32.512 4.864-43.264l83.712-67.072c13.312-10.496 32.512-8.448 43.264 4.864 10.496 13.312 8.448 32.512-4.864 43.264l-83.712 67.072c-5.632 4.352-12.288 6.656-19.2 6.656zM297.472 263.168c-9.728 0-19.456-4.608-25.344-13.312L211.2 161.28c-9.728-14.08-6.144-33.024 7.936-42.752 14.08-9.472 33.024-6.144 42.752 7.936L322.56 215.04c9.728 14.08 6.144 33.024-7.936 42.752-5.12 3.584-11.264 5.376-17.152 5.376zM155.648 415.488c-6.656 0-13.568-2.304-19.2-6.656l-83.712-67.072c-13.312-10.496-15.36-29.952-4.864-43.264 10.496-13.312 29.952-15.36 43.264-4.864l83.712 67.072c13.312 10.496 15.36 29.952 4.864 43.264-6.144 7.424-15.104 11.52-24.064 11.52z"
|
|
|
fill="#fff"></path>
|
|
|
</svg>`,
|
|
|
color: 'linear-gradient(150deg, #89c3f7, #4497fd)'
|
|
|
},
|
|
|
early_warning: {
|
|
|
label: '工情',
|
|
|
icon: `<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="20" height="20">
|
|
|
<path d="M345.2 664.2c0-42.9 8.4-84.5 25-123.7 16-37.9 38.9-71.8 68.1-101s63.1-52.1 101-68.1c39.2-16.6 80.8-25 123.7-25s84.5 8.4 123.7 25c12.1 5.1 23.7 10.9 35 17.4v-264c0-13.7-11.1-24.8-24.8-24.8H559.3c0.5 2.3 0.7 4.6 0.7 7v133.2c0 19.2-15.6 34.8-34.8 34.8H395.1c-19.2 0-34.8-15.6-34.8-34.8V107.1c0-2.4 0.2-4.7 0.7-7H123.4c-13.7 0-24.8 11.1-24.8 24.8v676.6c0 13.7 11.1 24.8 24.8 24.8h266.2c-7.3-12.3-13.8-25.1-19.4-38.3-16.6-39.3-25-80.9-25-123.8z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M663 406.4c-142.4 0-257.8 115.4-257.8 257.8S520.6 922 663 922s257.8-115.4 257.8-257.8S805.4 406.4 663 406.4z m112.2 293.4c-29 29-70.9 37.4-107.3 25.2l-68.5 68.5c-18.1 18.1-47.6 18.1-65.7 0s-18.1-47.6 0-65.7l68.5-68.5C590 622.9 598.3 581 627.4 552c31.3-31.3 77.4-38.6 115.6-22l-67.1 67.1 10.9 42.9 43.3 11.3 67.1-67.1c16.6 38.3 9.2 84.4-22 115.6z"
|
|
|
fill="#fff"></path>
|
|
|
<path d="M576 751.2m-20.9 0a20.9 20.9 0 1 0 41.8 0 20.9 20.9 0 1 0-41.8 0Z"
|
|
|
fill="#fff"></path>
|
|
|
</svg>`,
|
|
|
color: 'linear-gradient(150deg, #6bc8cf, #3db9c5)'
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
cloneTransfers (transfers) {
|
|
|
this.$refs['createDispatch'].handleClone(transfers);
|
|
|
},
|
|
|
|
|
|
async getWeatherInfo () {
|
|
|
let infoObj = {
|
|
|
weather: '',
|
|
|
water: '',
|
|
|
rain: '',
|
|
|
prevent: '',
|
|
|
early_warning: ''
|
|
|
}
|
|
|
const weatherInfo = await weather()
|
|
|
infoObj.weather = `${weatherInfo.weather},${weatherInfo.wD}${weatherInfo.wS},${weatherInfo.sendibleTemp}-${weatherInfo.temp}°C`
|
|
|
const infos = (await info({
|
|
|
date: this.$moment().format('YYYY-MM-DD')
|
|
|
}))[0]
|
|
|
infoObj.water = `${infos?.daily_water?.map(i => i.range + i.stnm + i.s_value + 'm,')?.toString()}`
|
|
|
infoObj.rain = `${infos?.daily_rain?.map(i => i.type + (typeof i.rain_value === "number" ? i.rain_value.toFixed(2) : parseFloat(i.rain_value).toFixed(2)) + 'mm,')?.toString()}`
|
|
|
|
|
|
this.weather = infoObj
|
|
|
|
|
|
await save({
|
|
|
table_name: 'waters',
|
|
|
date: this.$moment().format('YYYY-MM-DD'),
|
|
|
...infoObj
|
|
|
},false)
|
|
|
},
|
|
|
|
|
|
async getWeather () {
|
|
|
const res = (await index({
|
|
|
table_name: 'waters',
|
|
|
filter: [
|
|
|
{
|
|
|
key: 'date',
|
|
|
op: 'eq',
|
|
|
value: this.$moment().format('YYYY-MM-DD')
|
|
|
}
|
|
|
]
|
|
|
},false)).data[0]
|
|
|
|
|
|
if (!res) {
|
|
|
await this.getWeatherInfo()
|
|
|
} else {
|
|
|
this.weather = res
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
splitSpan () {
|
|
|
return function (text) {
|
|
|
if (!text) return '暂无信息'
|
|
|
let html = '';
|
|
|
let spit = text?.split(/，|；|。|,|\n/)
|
|
|
spit?.forEach((i,index) => {
|
|
|
html += ((index ? '<br>' : '') + '<span>' + i + '</span>')
|
|
|
})
|
|
|
|
|
|
return html || '暂无信息';
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.getWeather()
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
::v-deep .ivu-steps .ivu-steps-title,::v-deep .ivu-steps .ivu-steps-head {
|
|
|
background: #0000;
|
|
|
}
|
|
|
.panel {
|
|
|
.title {
|
|
|
font-weight: 600;
|
|
|
font-size: 16px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
|
|
|
padding: 10px 20px;
|
|
|
position: relative;
|
|
|
|
|
|
&::before {
|
|
|
content: '';
|
|
|
width: 12px;
|
|
|
height: 12px;
|
|
|
border-radius: 100%;
|
|
|
transform: translateY(-50%);
|
|
|
background: radial-gradient(50% 50% at 50% 50%,$primaryColor 0,$primaryColor 60%,#0000 60%,#0000 80%,$primaryColor 80%,$primaryColor 100%);
|
|
|
|
|
|
position: absolute;
|
|
|
left: 0;
|
|
|
top: 50%;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
& + & {
|
|
|
margin-top: 20px;
|
|
|
}
|
|
|
}
|
|
|
.weather {
|
|
|
|
|
|
&-container {
|
|
|
display: grid;
|
|
|
grid-gap: 14px;
|
|
|
grid-template-areas:
|
|
|
"weather weather weather weather"
|
|
|
"card2 card3 card4 card5";
|
|
|
|
|
|
@for $index from 1 through 5 {
|
|
|
.card#{$index} {
|
|
|
@if $index == 1{
|
|
|
grid-area: weather;
|
|
|
} @else {
|
|
|
grid-area: card#{$index};
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
&__card {
|
|
|
//flex: 0;
|
|
|
//flex-basis: 19%;
|
|
|
|
|
|
.text {
|
|
|
max-height: 140px;
|
|
|
text-align: center;
|
|
|
overflow-y: scroll;
|
|
|
//font-size: 13px;
|
|
|
//display: -webkit-box;
|
|
|
//-webkit-box-orient: vertical;
|
|
|
//-webkit-line-clamp: 3;
|
|
|
//overflow: hidden;
|
|
|
&::-webkit-scrollbar-thumb {
|
|
|
background: #0000;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.step {
|
|
|
width: 80%;
|
|
|
|
|
|
margin: 0 auto;
|
|
|
}
|
|
|
|
|
|
.complete {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
|
|
|
|
padding-bottom: 20px;
|
|
|
&__icon {
|
|
|
color: green;
|
|
|
font-size: 66px;
|
|
|
}
|
|
|
|
|
|
& > p {
|
|
|
font-weight: 600;
|
|
|
color: #333;
|
|
|
font-size: 20px;
|
|
|
|
|
|
padding: 20px 0;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.create {
|
|
|
transition: all 1s;
|
|
|
}
|
|
|
.create-enter-active {
|
|
|
opacity: 1;
|
|
|
}
|
|
|
.create-leave-active {
|
|
|
opacity: 0;
|
|
|
}
|
|
|
</style>
|
