diff --git a/web/html/login.html b/web/html/login.html
index 554fb318..5138f15e 100644
--- a/web/html/login.html
+++ b/web/html/login.html
@@ -26,6 +26,12 @@
         padding-left: 50px;
     }
 
+    .selectLang{
+        display: flex;
+        text-align: center;
+        justify-content: center;
+    }
+
 </style>
 <body>
 <a-layout id="app" v-cloak>
@@ -53,6 +59,29 @@
                         </a-form-item>
                         <a-form-item>
                             <a-button block @click="login" :loading="loading">{{ i18n "login" }}</a-button>
+                        </a-form-item>
+                        <a-form-item>
+
+                            <a-row justify="center" class="selectLang">
+                                <a-col :span="4"><span>Language : </span></a-col>
+
+                                <a-col :span="6">
+                                    <a-select
+                                            ref="selectLang"
+                                            v-model="lang"
+                                            @change="setLang(lang)"
+                                    >
+                                        <a-select-option  :value="l.value" label="China" v-for="l in supportLangs" >
+                                            <span role="img" aria-label="l.name" v-text="l.icon"></span>
+                                            &nbsp;&nbsp;<span v-text="l.name"></span>
+                                        </a-select-option>
+                                    </a-select>
+                                </a-col>
+
+                            </a-row>
+
+
+
                         </a-form-item>
                     </a-form>
                 </a-col>
@@ -73,6 +102,10 @@
         data: {
             loading: false,
             user: new User(),
+            lang : ""
+        },
+        created(){
+          this.lang = getLang();
         },
         methods: {
             async login() {
