取消弹窗，添加测试车间

src/assets/scss/testShop.scss

@@ -0,0 +1,142 @@
+#index {
+  color: #d3d6dd;
+  width: 1920px;
+  height: 1080px;
+  position:fixed;
+  left:0;
+  top:0;
+  bottom:0;
+  right:0;
+  
+  .bg {
+    width: 100%;
+    height: 100%;
+    padding: 16px 16px 0 16px;
+    background-image: url("../../assets/pageBg.png");
+    background-size: cover;
+    background-position: center center;
+  }
+
+  .host-body {
+    .dv-dec-10,
+    .dv-dec-10-s {
+      width: 33.3%;
+      height: 5px;
+    }
+    .dv-dec-10-s {
+      transform: rotateY(180deg);
+    }
+    .dv-dec-8 {
+      width: 200px;
+      height: 50px;
+    }
+    .title {
+      position: relative;
+      width: 500px;
+      text-align: center;
+      background-size: cover;
+      background-repeat: no-repeat;
+
+      .title-text {
+        font-size: 26px;
+        position: absolute;
+        bottom: 0;
+        left: 50%;
+        transform: translate(-50%);
+      }
+
+      .dv-dec-6 {
+        position: absolute;
+        bottom: -30px;
+        left: 50%;
+        width: 250px;
+        height: 8px;
+        transform: translate(-50%);
+      }
+    }
+
+    // 第二行
+    .aside-width {
+      width: 40%;
+    }
+    .react-r-s,
+    .react-l-s {
+      background-color: #0f1325;
+    }
+
+    // 平行四边形
+    .react-right {
+      &.react-l-s {
+        text-align: right;
+        width: 500px;
+      }
+      font-size: 18px;
+      width: 300px;
+      line-height: 50px;
+      text-align: center;
+      transform: skewX(-45deg);
+
+      .react-after {
+        position: absolute;
+        right: -25px;
+        top: 0;
+        height: 50px;
+        width: 50px;
+        background-color: #0f1325;
+        transform: skewX(45deg);
+      }
+
+      .text {
+        display: inline-block;
+        transform: skewX(45deg);
+      }
+    }
+
+    .react-left {
+      &.react-l-s {
+        width: 500px;
+        text-align: left;
+      }
+      font-size: 20px;
+      width: 300px;
+      height: 50px;
+      line-height: 50px;
+      text-align: center;
+      transform: skewX(45deg);
+      background-color: #0f1325;
+
+      .react-left {
+        position: absolute;
+        left: -25px;
+        top: 0;
+        height: 50px;
+        width: 50px;
+        background-color: #1a5cd7;
+        transform: skewX(-45deg);
+      }
+
+      .text {
+        display: inline-block;
+        transform: skewX(-45deg);
+      }
+    }
+
+    .body-box {
+      margin-top: 16px;
+      display: flex;
+      flex-direction: column;
+
+      //下方区域的布局
+      .content-box {
+        display: grid;
+        grid-template-columns: 3fr 3fr 4fr 5fr;
+      }
+
+      // 底部数据
+      .bottom-box {
+        display: grid;
+        grid-template-columns: 3fr 3fr;
+      }
+    }
+  }
+}

src/router/index.js

@@ -82,6 +82,14 @@ const routes = [{
     title: "SMTTEST",
     requireAuth: true // 标识该路由是否需要登录
   }
+},{
+  path: '/testShop',
+  name: 'testShop',
+  component: () => import('../views/testShop/index.vue'),
+  meta: {
+    title: "TESTSHOP",
+    requireAuth: true // 标识该路由是否需要登录
+  }
 }]
 const router = new VueRouter({
   routes

src/views/assembly/index.vue

@@ -52,6 +52,7 @@
                </span>
                 <el-dropdown-menu slot="dropdown">
                   <el-dropdown-item ><router-link to="package"> 包装车间 </router-link></el-dropdown-item>
+                  <el-dropdown-item ><router-link to="testShop"> 测试车间 </router-link></el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
 
@@ -171,11 +172,6 @@ export default {
         }
       }, 4000);*/
     })
-    this.$message({
-      showClose: true,
-      message: `当前屏幕分辨率，宽:${window.innerWidth},高:${window.innerHeight}`,
-      type:'warning'
-    });
     this.currentLine = this.$cookie.get("AS_LI_CODE")
     this.isChange = sessionStorage.getItem('isChange') == '1' ? true : false
     // 添加全屏状态变化监听

src/views/login.vue

@@ -5,31 +5,24 @@
                 UAS-MES可视化平台
             </h3>
             <el-form-item prop="sob">
-                <el-select v-model="loginForm.sob"  placeholder="请选择账套" style="width:100%">
-                    <el-option
-                            v-for="item in options"
-                            :key="item.value"
-                            :label="item.label"
-                            :value="item.value">
+                <el-select v-model="loginForm.sob" placeholder="请选择账套" style="width:100%">
+                    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                     </el-option>
                 </el-select>
             </el-form-item>
             <el-form-item prop="workshop">
-                <el-select v-model="loginForm.workshop"  placeholder="请选择车间" style="width:100%">
-                    <el-option
-                            v-for="item in workshopoptions"
-                            :key="item.value"
-                            :label="item.label"
-                            :value="item.value">
+                <el-select v-model="loginForm.workshop" placeholder="请选择车间" style="width:100%">
+                    <el-option v-for="item in workshopoptions" :key="item.value" :label="item.label"
+                        :value="item.value">
                     </el-option>
                 </el-select>
             </el-form-item>
             <el-form-item prop="username">
-                <el-input type="text" v-model="loginForm.username" placeholder="请输入用户名" >
+                <el-input type="text" v-model="loginForm.username" placeholder="请输入用户名">
                 </el-input>
             </el-form-item>
             <el-form-item prop="password">
-                <el-input type="password" v-model="loginForm.password" placeholder="请输入密码" >
+                <el-input type="password" v-model="loginForm.password" placeholder="请输入密码">
                 </el-input>
             </el-form-item>
             <el-checkbox v-model="checked" class="loginRemember">记住我</el-checkbox>
@@ -39,217 +32,225 @@
 </template>
 
 <script>
-    import CryptoJS from "crypto-js";
+import CryptoJS from "crypto-js";
 
-    export default {
-        name: "Login",
-        data(){
-            return{
-                captchaUrl: "",
-                loginForm:{
-                    sob:"",
-                    username:"",
-                    password:"",
-                    workshop:"SMT"
-                },
-                checked: true,
-                rules:{
-                    sob :[{required:true,message:"请选择账套",trigger:"blur"}],
-                    username:[{required:true,message:"请输入用户名",trigger:"blur"}/*,{ min: 5, max: 14, message: '长度在 5 到 14 个字符', trigger: 'blur' }*/],
-                    password:[{required:true,message:"请输入密码",trigger:"blur"} /*,{ min: 6,  message: '密码长度要大于6', trigger: 'blur' }*/],
-                    workshop:[{required:true,message:"请选择车间",trigger:"blur"}]
-                },
-                options: [],
-                workshopoptions:[
-                  {label: '组装', value: '组装'},
-                  {label: '包装', value: '包装'},
-                ]
-            }
-        },
-        created() {
-            //默认数据
-            this.getCookies();
-            //获取账套信息
-            this.getMasters();
-            //获取工作中心数据
-            // this.getWorkCenter();
-        },
-        mounted() {
-            //监听enter键
-            this.$refs.loginForm.$el.addEventListener('keydown',this.handleEnter);
+export default {
+    name: "Login",
+    data() {
+        return {
+            captchaUrl: "",
+            loginForm: {
+                sob: "",
+                username: "",
+                password: "",
+                workshop: "SMT"
+            },
+            checked: true,
+            rules: {
+                sob: [{ required: true, message: "请选择账套", trigger: "blur" }],
+                username: [{ required: true, message: "请输入用户名", trigger: "blur" }/*,{ min: 5, max: 14, message: '长度在 5 到 14 个字符', trigger: 'blur' }*/],
+                password: [{ required: true, message: "请输入密码", trigger: "blur" } /*,{ min: 6,  message: '密码长度要大于6', trigger: 'blur' }*/],
+                workshop: [{ required: true, message: "请选择车间", trigger: "blur" }]
+            },
+            options: [],
+            workshopoptions: [
+                { label: '组装', value: '组装' },
+                { label: '包装', value: '包装' },
+                { label: '测试', value: '测试' },
+            ]
+        }
+    },
+    created() {
+        //默认数据
+        this.getCookies();
+        //获取账套信息
+        this.getMasters();
+        //获取工作中心数据
+        // this.getWorkCenter();
+    },
+    mounted() {
+        //监听enter键
+        this.$refs.loginForm.$el.addEventListener('keydown', this.handleEnter);
+    },
+    beforeDestroy() {
+        this.$refs.loginForm.$el.removeEventListener('keydown', this.handleEnter);
+    },
+    methods: {
+        //获取账套
+        getMasters() {
+            this.$http.get("kanban/getAllMasters.action").then(
+                (result) => {
+                    var res = JSON.parse(JSON.stringify(result.data.masters));
+                    for (let i = 0; i < res.length; i++) {
+                        this.options.push({ label: res[i].ma_function, value: res[i].ma_user });
+                    }
+                    //设置默认值
+                    if ("" == this.loginForm.sob || !result.data.masters.some(item => item.ma_function === this.loginForm.sob)) {
+                        this.loginForm.sob = res[0].ma_user;
+                    }
+                }, (result) => {
+                    console.error(result)
+                });
         },
-        beforeDestroy(){
-            this.$refs.loginForm.$el.removeEventListener('keydown',this.handleEnter);
+        //获取工作中心
+        getWorkCenter() {
+            this.$http.get("kanban/getAllWorkCenter.action").then(
+                (result) => {
+                    var res = JSON.parse(JSON.stringify(result.data.workCenter));
+                    for (let i = 0; i < res.length; i++) {
+                        this.workshopoptions.push({ label: res[i].wc_code, value: res[i].wc_name });
+                    }
+                    //设置默认值
+                    if ("" == this.loginForm.workshop || !result.data.workCenter.some(item => item.ma_function === this.loginForm.workshop)) {
+                        this.loginForm.workshop = res[0].ma_user;
+                    }
+                }, (result) => {
+                    console.error(result)
+                });
         },
-        methods:{
-            //获取账套
-            getMasters(){
-                this.$http.get("kanban/getAllMasters.action").then(
-                    (result)=>{
-                        var res = JSON.parse(JSON.stringify(result.data.masters));
-                        for (let i = 0; i < res.length; i++) {
-                            this.options.push({label: res[i].ma_function, value: res[i].ma_user});
-                        }
-                        //设置默认值
-                        if("" == this.loginForm.sob || !result.data.masters.some(item => item.ma_function === this.loginForm.sob) ){
-                            this.loginForm.sob = res[0].ma_user;
-                        }
-                    },(result)=>{
-                        console.error(result)
-                    });
-            },
-            //获取工作中心
-            getWorkCenter(){
-                this.$http.get("kanban/getAllWorkCenter.action").then(
-                    (result)=>{
-                        var res = JSON.parse(JSON.stringify(result.data.workCenter));
-                        for (let i = 0; i < res.length; i++) {
-                            this.workshopoptions.push({label: res[i].wc_code, value: res[i].wc_name});
-                        }
-                        //设置默认值
-                        if("" == this.loginForm.workshop || !result.data.workCenter.some(item => item.ma_function === this.loginForm.workshop) ){
-                            this.loginForm.workshop = res[0].ma_user;
+        //登录操作
+        submitLogin() {
+            this.$refs.loginForm.validate((valid) => {
+                if (valid) {
+                    // console.log('登录',this.loginForm);
+                    //?username=zhongyl&password=asd&sob=N_MES_TEST
+                    this.$http.get("kanban/login.action", {
+                        params: {
+                            username: this.loginForm.username,
+                            password: this.loginForm.password,
+                            sob: this.loginForm.sob,
+                            wccode: this.loginForm.workshop
                         }
-                    },(result)=>{
-                        console.error(result)
-                    });
-            },
-            //登录操作
-            submitLogin(){
-                this.$refs.loginForm.validate((valid) => {
-                    if (valid) {
-                       // console.log('登录',this.loginForm);
-                        //?username=zhongyl&password=asd&sob=N_MES_TEST
-                        this.$http.get("kanban/login.action",{
-                                params:{
-                                    username:this.loginForm.username,
-                                    password:this.loginForm.password,
-                                    sob:this.loginForm.sob,
-                                    wccode:this.loginForm.workshop
-                                }}).then(
-                            (result)=>{
-                                var res = result.data;
-                                if(res.success || "检测到您已登录本系统,请不要重复登录、打开空白页!" == res.reason) {
-                                    //登录成功返回session
-                                    sessionStorage.setItem('x-access-token', res.token);
-                                    sessionStorage.setItem('user',res);
-                                    this.$store.commit('setUser',res);
-                                    this.setCookieData();
-
-                                   if(this.loginForm.workshop =='组装'){
-                                        this.$router.push({path: this.redirect || '/assembly'});
+                    }).then(
+                        (result) => {
+                            var res = result.data;
+                            if (res.success || "检测到您已登录本系统,请不要重复登录、打开空白页!" == res.reason) {
+                                //登录成功返回session
+                                sessionStorage.setItem('x-access-token', res.token);
+                                sessionStorage.setItem('user', res);
+                                this.$store.commit('setUser', res);
+                                this.setCookieData();
 
-                                    }
-                                  if(this.loginForm.workshop =='包装'){
-                                    this.$router.push({path: this.redirect || '/package'});
-                                  }
+                                if (this.loginForm.workshop == '组装') {
+                                    this.$router.push({ path: this.redirect || '/assembly' });
 
-
-                                }else{
-                                    this.$message.error(res.reason);
                                 }
-                            },(result)=>{
-                                console.error(result)
-                            });
+                                if (this.loginForm.workshop == '包装') {
+                                    this.$router.push({ path: this.redirect || '/package' });
+                                }
+                                if (this.loginForm.workshop == '测试') {
+                                    this.$router.push({ path: this.redirect || '/testShop' });
+                                }
 
-                        /*this.$store.dispatch('kanban/login.action',this.form).then(() => {
-                            this.$router.push({ path: this.redirect || '/' })
-                        }).catch(() => {
-                            this.loading = false;
-                        })*/
-                    } else {
-                        this.$message.error('登录出错请重新输入');
-                        return false;
-                    }
-                });
 
+                            } else {
+                                this.$message.error(res.reason);
+                            }
+                        }, (result) => {
+                            console.error(result)
+                        });
 
-            },
-            handleEnter(event){
-                if(event.key === 'Enter'){
-                    //处理回车键按下时间
-                    this.submitLogin();
-                }
-            },
-            setCookieData(){
-                if (this.checked) {
-                    this.$cookie.set(
-                        "password",
-                        CryptoJS.AES.encrypt(this.loginForm.password, "123456"),
-                        {
-                            expires: 30
-                        }
-                    );
+                    /*this.$store.dispatch('kanban/login.action',this.form).then(() => {
+                        this.$router.push({ path: this.redirect || '/' })
+                    }).catch(() => {
+                        this.loading = false;
+                    })*/
                 } else {
-                    this.$cookie.remove("password");
+                    this.$message.error('登录出错请重新输入');
+                    return false;
                 }
-                this.$cookie.set("username", this.loginForm.username, {
-                    expires: 30,
-                });
-                this.$cookie.set("sob", this.loginForm.sob, {
-                    expires: 30,
-                });
-                this.$cookie.set("workshop", this.loginForm.workshop, {
-                    expires: 30,
-                });
-                this.$cookie.set("checked", this.checked, {
-                    expires: 30,
-                });
-            },
-            getCookies(){
-                if(this.$cookie.get("sob")) {
-                    this.loginForm.sob = this.$cookie.get("sob");
-                }
-                this.loginForm.username = this.$cookie.get("username");
-                if (this.$cookie.get("password")) {
-                    this.loginForm.password = CryptoJS.AES.decrypt(
-                        this.$cookie.get("password"),
-                        "123456"
-                    ).toString(CryptoJS.enc.Utf8);
-                }
-                if(this.$cookie.get("workshop")) {
-                    this.loginForm.workshop = this.$cookie.get("workshop");
-                }
-                if(this.$cookie.get("checked")) {
-                    if(this.$cookie.get("checked") == 'false') {
-                        this.checked = false;
+            });
+
+
+        },
+        handleEnter(event) {
+            if (event.key === 'Enter') {
+                //处理回车键按下时间
+                this.submitLogin();
+            }
+        },
+        setCookieData() {
+            if (this.checked) {
+                this.$cookie.set(
+                    "password",
+                    CryptoJS.AES.encrypt(this.loginForm.password, "123456"),
+                    {
+                        expires: 30
                     }
-                }
+                );
+            } else {
+                this.$cookie.remove("password");
             }
+            this.$cookie.set("username", this.loginForm.username, {
+                expires: 30,
+            });
+            this.$cookie.set("sob", this.loginForm.sob, {
+                expires: 30,
+            });
+            this.$cookie.set("workshop", this.loginForm.workshop, {
+                expires: 30,
+            });
+            this.$cookie.set("checked", this.checked, {
+                expires: 30,
+            });
         },
-    };
+        getCookies() {
+            if (this.$cookie.get("sob")) {
+                this.loginForm.sob = this.$cookie.get("sob");
+            }
+            this.loginForm.username = this.$cookie.get("username");
+            if (this.$cookie.get("password")) {
+                this.loginForm.password = CryptoJS.AES.decrypt(
+                    this.$cookie.get("password"),
+                    "123456"
+                ).toString(CryptoJS.enc.Utf8);
+            }
+            if (this.$cookie.get("workshop")) {
+                this.loginForm.workshop = this.$cookie.get("workshop");
+            }
+            if (this.$cookie.get("checked")) {
+                if (this.$cookie.get("checked") == 'false') {
+                    this.checked = false;
+                }
+            }
+        }
+    },
+};
 </script>
 
 <style lang="less" scoped>
-    .loginContainer{
-        border-radius: 15px;
-        background-clip: padding-box;
-        margin: 180px auto;
-        width: 350px;
-        padding: 15px 35px 15px 35px;
-        background: aliceblue;
-        border:1px solid blueviolet;
-        box-shadow: 0 0 25px #f885ff;
-    }
-    .loginTitle{
-        margin: 0px auto 35px auto;
-        text-align: center;
-        font-size: 24px;
-    }
-    .loginRemember{
-        text-align: left;
-        margin: 0px 0px 15px 0px;
-    }
-    .bg {
-        width: 100%;
-        height: 100%;
-        background-image: url("../assets/pageBg.png");
-        background-size: cover;
-        background-position: center center;
-    }
-    /*body{
+.loginContainer {
+    border-radius: 15px;
+    background-clip: padding-box;
+    margin: 180px auto;
+    width: 350px;
+    padding: 15px 35px 15px 35px;
+    background: aliceblue;
+    border: 1px solid blueviolet;
+    box-shadow: 0 0 25px #f885ff;
+}
+
+.loginTitle {
+    margin: 0px auto 35px auto;
+    text-align: center;
+    font-size: 24px;
+}
+
+.loginRemember {
+    text-align: left;
+    margin: 0px 0px 15px 0px;
+}
+
+.bg {
+    width: 100%;
+    height: 100%;
+    background-image: url("../assets/pageBg.png");
+    background-size: cover;
+    background-position: center center;
+}
+
+/*body{
         background-image: url("../assets/pageBg.png");
         background-size:100%;
     }*/
 </style>
-

src/views/package/index.vue

@@ -49,6 +49,7 @@
                 </span>
                   <el-dropdown-menu slot="dropdown">
                     <el-dropdown-item ><router-link to="assembly"> 组装车间 </router-link></el-dropdown-item>
+                    <el-dropdown-item ><router-link to="testShop"> 测试车间 </router-link></el-dropdown-item>
                   </el-dropdown-menu>
             </el-dropdown>
               <el-select v-model="linecode" class="dropdown" @change ="handleBlur" style="width: 150px">
@@ -158,13 +159,8 @@ export default {
     this.timeFn()
     this.cancelLoading()
     this.$nextTick(() => {
-        this.autoFullScreen()
+      this.autoFullScreen()
     })
-    this.$message({
-        showClose: true,
-        message: `当前屏幕分辨率，宽:${window.innerWidth},高:${window.innerHeight}`,
-        type: 'warning'
-    });
   },
   beforeDestroy () {
     clearInterval(this.timing)

src/views/testShop/index.vue

@@ -0,0 +1,162 @@
+<template>
+  <div id="index" ref="appRef">
+    <div class="bg">
+      <dv-loading v-if="loading">Loading...</dv-loading>
+      <div v-else class="host-body">
+        <div class="d-flex jc-center">
+          <dv-decoration-10 class="dv-dec-10" />
+          <div class="d-flex jc-center">
+            <dv-decoration-8 class="dv-dec-8" :color="decorationColor" />
+            <div class="title">
+              <span class="title-text">UAS-MES可视化平台</span>
+              <dv-decoration-6 class="dv-dec-6" :reverse="true" :color="['#50e3c2', '#67a1e5']" />
+            </div>
+            <dv-decoration-8 class="dv-dec-8" :reverse="true" :color="decorationColor" />
+          </div>
+          <dv-decoration-10 class="dv-dec-10-s" />
+        </div>
+
+        <!-- 第二行 -->
+        <div class="d-flex jc-between px-2">
+          <div class="d-flex aside-width">
+            <div class="react-left ml-4 react-l-s bg-color-blue">
+              <span class="react-left"></span>
+              <span class="text fw-b" style="font-size:24px;">普耐尔MES数据看板</span>
+            </div>
+            <div class="react-left ml-3">
+              <span class="text">生产实况分析</span>
+            </div>
+          </div>
+          <div class="d-flex aside-width">
+            <div class="react-right bg-color-r mr-3">
+              <!-- <span class="text ">设备运行分析</span>-->
+              <span class="text" @click="fullScreen" ref="fullScreen">全屏</span>
+              <span class="text" @click="exitFullScreen" ref="exitFullScreen" style="display: none">退出全屏</span>
+            </div>
+            <div class="react-right mr-4 react-l-s" style="width: 900px">
+              <span class="react-after"></span>
+              <el-dropdown class="dropdown">
+                <span class="el-dropdown-link" ref="echarType">
+                  测试车间<i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>&nbsp;&nbsp;&nbsp;&nbsp;
+                </span>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item><router-link to="assembly"> 组装车间 </router-link></el-dropdown-item>
+                  <el-dropdown-item><router-link to="package"> 包装车间 </router-link></el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+              <span class="text">&nbsp;&nbsp;&nbsp;&nbsp;</span>
+              <span class="text">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
+            </div>
+          </div>
+        </div>
+
+        <div class="body-box">
+
+
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import drawMixin from "../../utils/drawMixin";
+import { formatTime } from '../../utils/index.js'
+
+export default {
+  mixins: [drawMixin],
+  data() {
+    return {
+      timing: null,
+      loading: true,
+      dateDay: null,
+      dateYear: null,
+      dateWeek: null,
+      weekday: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
+      decorationColor: ['#568aea', '#000000'],
+      isFullScreen: false,
+    }
+  },
+  components: {
+
+  },
+  mounted() {
+    this.timeFn()
+    this.cancelLoading()
+    this.$nextTick(() => {
+      this.autoFullScreen()
+    })
+  },
+  beforeDestroy() {
+    clearInterval(this.timing)
+  },
+  methods: {
+    timeFn() {
+      this.timing = setInterval(() => {
+        this.dateDay = formatTime(new Date(), 'HH: mm: ss')
+        this.dateYear = formatTime(new Date(), 'yyyy-MM-dd')
+        this.dateWeek = this.weekday[new Date().getDay()]
+      }, 1000)
+    },
+    cancelLoading() {
+      setTimeout(() => {
+        this.loading = false
+      }, 5000)
+    },
+    handleBlur(val) {
+      sessionStorage.setItem('li_code', val);
+      this.$cookie.set("PC_LI_CODE", val, {
+        expires: 30,
+      });
+      location.reload();
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+@import '../../assets/scss/testShop.scss';
+.dropdown {
+  font-size: 18px;
+  color: #568aea;
+  transform: skewX(45deg);
+
+  ::v-deep .el-select-dropdown {
+    border: 1px solid #0f1325;
+    background: #04308D !important;
+  }
+
+  ::v-deep .el-input__inner {
+    background-color: #0f1325;
+    color: #fff;
+    border: 1px solid #0f1325;
+  }
+
+  .el-select-dropdown__item {
+    color: #fff;
+    background-color: #0f1325;
+  }
+
+  ::v-deep .el-select-dropdown {
+    background-color: transparent;
+    border: 1px solid #0f1325;
+  }
+
+  ::v-deep.el-select-dropdown__list {
+    padding: 0;
+  }
+
+  ::v-deep.el-popper[x-placement^="bottom"] {
+    margin-top: 0px;
+  }
+
+  ::v-deep.el-popper .popper__arrow,
+  ::v-deep.el-popper .popper__arrow::after {
+    display: none;
+  }
+
+  .el-select-dropdown__item:hover {
+    background-color: rgba(0, 225, 219, 0.690196078431373);
+  }
+}
+</style>