|
|
@@ -20,3 +20,65 @@
|
|
|
type="password"
|
|
|
id="password"
|
|
|
placeholder="请输入密码"
|
|
|
+ class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="mb-4 flex items-center justify-between">
|
|
|
+ <label class="flex items-center">
|
|
|
+ <input
|
|
|
+ v-model="form.remember"
|
|
|
+ type="checkbox"
|
|
|
+ class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500"
|
|
|
+ />
|
|
|
+ <span class="ml-2 text-sm text-gray-600">记住我</span>
|
|
|
+ </label>
|
|
|
+ <a href="#" class="text-sm text-blue-600 hover:text-blue-700">忘记密码?</a>
|
|
|
+ </div>
|
|
|
+ <div class="mb-4">
|
|
|
+ <label for="language" class="block text-sm font-medium text-gray-700 mb-1">语言选择</label>
|
|
|
+ <select
|
|
|
+ v-model="form.language"
|
|
|
+ id="language"
|
|
|
+ class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
|
|
|
+ >
|
|
|
+ <option value="zh">中文</option>
|
|
|
+ <option value="en">英文</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <button
|
|
|
+ type="submit"
|
|
|
+ class="w-full bg-blue-600 text-white py-2 px-4 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
|
|
|
+ >
|
|
|
+ 登录
|
|
|
+ </button>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref } from 'vue'
|
|
|
+import { useRouter } from 'vue-router'
|
|
|
+import { AlertCircle } from 'lucide-vue-next'
|
|
|
+
|
|
|
+const router = useRouter()
|
|
|
+
|
|
|
+const form = ref({
|
|
|
+ username: '',
|
|
|
+ password: '',
|
|
|
+ remember: false,
|
|
|
+ language: 'zh'
|
|
|
+})
|
|
|
+
|
|
|
+const handleSubmit = () => {
|
|
|
+ if (form.value.username === 'admin' && form.value.password === 'admin') {
|
|
|
+ router.push('/dashboard')
|
|
|
+ } else {
|
|
|
+ alert('用户名或密码错误')
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+/* Add any additional custom styles here if needed */
|
|
|
+</style>
|
genlitex