未验证 提交 dcb133a6 编写于 作者: Mr.奇淼('s avatar Mr.奇淼( 提交者: GitHub

集成tailwindcss 替换新的登陆页面和版权信息组件 (#1499)

* 集成tailwindcss

* fix: 修改登录,init 页面

* Update package.json

* 升级可升级的第三方库到新版本

* 细节调整

---------
Co-authored-by: Nbypanghu <bypanghu@163.com>
Co-authored-by: Ntask <121913992@qq.com>
上级 0e780805
......@@ -3,11 +3,11 @@
<img src="http://qmplusimg.henrongyi.top/gvalogo.jpg" width=300" height="300" />
</div>
<div align=center>
<img src="https://img.shields.io/badge/golang-1.16-blue"/>
<img src="https://img.shields.io/badge/gin-1.7.0-lightBlue"/>
<img src="https://img.shields.io/badge/vue-3.2.25-brightgreen"/>
<img src="https://img.shields.io/badge/element--plus-2.0.1-green"/>
<img src="https://img.shields.io/badge/gorm-1.22.5-red"/>
<img src="https://img.shields.io/badge/golang-1.18-blue"/>
<img src="https://img.shields.io/badge/gin-1.1.1-lightBlue"/>
<img src="https://img.shields.io/badge/vue-3.3.4-brightgreen"/>
<img src="https://img.shields.io/badge/element--plus-2.3.8-green"/>
<img src="https://img.shields.io/badge/gorm-1.25.2-red"/>
</div>
English | [简体中文](./README.md)
......
......@@ -3,11 +3,11 @@
<img src="http://qmplusimg.henrongyi.top/gvalogo.jpg" width=300" height="300" />
</div>
<div align=center>
<img src="https://img.shields.io/badge/golang-1.16-blue"/>
<img src="https://img.shields.io/badge/gin-1.7.0-lightBlue"/>
<img src="https://img.shields.io/badge/vue-3.2.25-brightgreen"/>
<img src="https://img.shields.io/badge/element--plus-2.0.1-green"/>
<img src="https://img.shields.io/badge/gorm-1.22.5-red"/>
<img src="https://img.shields.io/badge/golang-1.18-blue"/>
<img src="https://img.shields.io/badge/gin-1.1.1-lightBlue"/>
<img src="https://img.shields.io/badge/vue-3.3.4-brightgreen"/>
<img src="https://img.shields.io/badge/element--plus-2.3.8-green"/>
<img src="https://img.shields.io/badge/gorm-1.25.2-red"/>
</div>
[English](./README-en.md) | 简体中文
......
......@@ -13,7 +13,7 @@ import (
"github.com/flipped-aurora/gin-vue-admin/server/utils"
"github.com/gin-gonic/gin"
"github.com/go-redis/redis/v8"
"github.com/redis/go-redis/v9"
"go.uber.org/zap"
)
......
......@@ -12,7 +12,7 @@ import (
"github.com/flipped-aurora/gin-vue-admin/server/config"
"github.com/go-redis/redis/v8"
"github.com/redis/go-redis/v9"
"github.com/spf13/viper"
"gorm.io/gorm"
)
......
......@@ -3,60 +3,59 @@ module github.com/flipped-aurora/gin-vue-admin/server
go 1.18
require (
github.com/aliyun/aliyun-oss-go-sdk v2.1.6+incompatible
github.com/aws/aws-sdk-go v1.42.27
github.com/casbin/casbin/v2 v2.68.0
github.com/casbin/gorm-adapter/v3 v3.7.3
github.com/aliyun/aliyun-oss-go-sdk v2.2.7+incompatible
github.com/aws/aws-sdk-go v1.44.307
github.com/casbin/casbin/v2 v2.71.1
github.com/casbin/gorm-adapter/v3 v3.18.0
github.com/flipped-aurora/ws v1.0.2
github.com/fsnotify/fsnotify v1.4.9
github.com/fsnotify/fsnotify v1.6.0
github.com/fvbock/endless v0.0.0-20170109170031-447134032cb6
github.com/gin-gonic/gin v1.9.0
github.com/gin-gonic/gin v1.9.1
github.com/glebarez/sqlite v1.8.0
github.com/go-redis/redis/v8 v8.11.4
github.com/go-sql-driver/mysql v1.7.1
github.com/gofrs/uuid v4.0.0+incompatible
github.com/gofrs/uuid/v5 v5.0.0
github.com/golang-jwt/jwt/v4 v4.5.0
github.com/gookit/color v1.3.1
github.com/gookit/color v1.5.4
github.com/huaweicloud/huaweicloud-sdk-go-obs v3.21.8+incompatible
github.com/jordan-wright/email v0.0.0-20200824153738-3f5bafa1cd84
github.com/lestrrat-go/file-rotatelogs v2.4.0+incompatible
github.com/mojocn/base64Captcha v1.3.1
github.com/mojocn/base64Captcha v1.3.5
github.com/otiai10/copy v1.7.0
github.com/pkg/errors v0.9.1
github.com/qiniu/api.v7/v7 v7.4.1
github.com/redis/go-redis/v9 v9.0.5
github.com/robfig/cron/v3 v3.0.1
github.com/sashabaranov/go-openai v1.5.7
github.com/shirou/gopsutil/v3 v3.22.5
github.com/songzhibin97/gkit v1.2.7
github.com/spf13/viper v1.7.0
github.com/stretchr/testify v1.8.1
github.com/sashabaranov/go-openai v1.14.1
github.com/shirou/gopsutil/v3 v3.23.6
github.com/songzhibin97/gkit v1.2.11
github.com/spf13/viper v1.16.0
github.com/stretchr/testify v1.8.4
github.com/swaggo/gin-swagger v1.3.0
github.com/swaggo/swag v1.16.1
github.com/tencentyun/cos-go-sdk-v5 v0.7.19
github.com/unrolled/secure v1.0.7
go.uber.org/zap v1.16.0
golang.org/x/crypto v0.9.0
golang.org/x/sync v0.2.0
golang.org/x/text v0.9.0
gorm.io/datatypes v1.2.0
github.com/tencentyun/cos-go-sdk-v5 v0.7.42
github.com/unrolled/secure v1.13.0
go.uber.org/zap v1.24.0
golang.org/x/crypto v0.10.0
golang.org/x/sync v0.3.0
golang.org/x/text v0.11.0
gorm.io/driver/mysql v1.5.1
gorm.io/driver/postgres v1.5.2
gorm.io/driver/sqlserver v1.5.1
gorm.io/gorm v1.25.1
gorm.io/gorm v1.25.2
nhooyr.io/websocket v1.8.7
)
require (
github.com/BurntSushi/toml v1.2.1 // indirect
github.com/Knetic/govaluate v3.0.1-0.20171022003610-9aa49832a739+incompatible // indirect
github.com/KyleBanks/depth v1.2.1 // indirect
github.com/baiyubin/aliyun-sts-go-sdk v0.0.0-20180326062324-cfa1a18b161f // indirect
github.com/bytedance/sonic v1.8.0 // indirect
github.com/cespare/xxhash/v2 v2.1.2 // indirect
github.com/bytedance/sonic v1.9.1 // indirect
github.com/cespare/xxhash/v2 v2.2.0 // indirect
github.com/chenzhuoyu/base64x v0.0.0-20221115062448-fe3a3abad311 // indirect
github.com/clbanning/mxj v1.8.4 // indirect
github.com/davecgh/go-spew v1.1.1 // indirect
github.com/dgryski/go-rendezvous v0.0.0-20200823014737-9f7001d12a5f // indirect
github.com/dustin/go-humanize v1.0.1 // indirect
github.com/gabriel-vasile/mimetype v1.4.2 // indirect
github.com/gin-contrib/sse v0.1.0 // indirect
github.com/glebarez/go-sqlite v1.21.1 // indirect
github.com/go-ole/go-ole v1.2.6 // indirect
......@@ -66,8 +65,8 @@ require (
github.com/go-openapi/swag v0.22.3 // indirect
github.com/go-playground/locales v0.14.1 // indirect
github.com/go-playground/universal-translator v0.18.1 // indirect
github.com/go-playground/validator/v10 v10.11.2 // indirect
github.com/goccy/go-json v0.10.0 // indirect
github.com/go-playground/validator/v10 v10.14.0 // indirect
github.com/goccy/go-json v0.10.2 // indirect
github.com/golang-sql/civil v0.0.0-20220223132316-b832511892a9 // indirect
github.com/golang-sql/sqlexp v0.1.0 // indirect
github.com/golang/freetype v0.0.0-20170609003504-e2365dfdc4a0 // indirect
......@@ -80,48 +79,49 @@ require (
github.com/jinzhu/inflection v1.0.0 // indirect
github.com/jinzhu/now v1.1.5 // indirect
github.com/jmespath/go-jmespath v0.4.0 // indirect
github.com/jonboulle/clockwork v0.4.0 // indirect
github.com/josharian/intern v1.0.0 // indirect
github.com/json-iterator/go v1.1.12 // indirect
github.com/klauspost/compress v1.13.6 // indirect
github.com/klauspost/cpuid/v2 v2.2.3 // indirect
github.com/leodido/go-urn v1.2.1 // indirect
github.com/klauspost/cpuid/v2 v2.2.4 // indirect
github.com/leodido/go-urn v1.2.4 // indirect
github.com/lestrrat-go/strftime v1.0.6 // indirect
github.com/lufia/plan9stats v0.0.0-20211012122336-39d0f177ccd0 // indirect
github.com/magiconair/properties v1.8.1 // indirect
github.com/magiconair/properties v1.8.7 // indirect
github.com/mailru/easyjson v0.7.7 // indirect
github.com/mattn/go-isatty v0.0.19 // indirect
github.com/microsoft/go-mssqldb v1.1.0 // indirect
github.com/mitchellh/mapstructure v1.2.2 // indirect
github.com/mitchellh/mapstructure v1.5.0 // indirect
github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd // indirect
github.com/modern-go/reflect2 v1.0.2 // indirect
github.com/mozillazg/go-httpheader v0.2.1 // indirect
github.com/pelletier/go-toml v1.6.0 // indirect
github.com/pelletier/go-toml/v2 v2.0.6 // indirect
github.com/pelletier/go-toml/v2 v2.0.8 // indirect
github.com/pmezard/go-difflib v1.0.0 // indirect
github.com/power-devops/perfstat v0.0.0-20210106213030-5aafc221ea8c // indirect
github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec // indirect
github.com/spf13/afero v1.2.2 // indirect
github.com/spf13/cast v1.3.1 // indirect
github.com/rogpeppe/go-internal v1.11.0 // indirect
github.com/shoenig/go-m1cpu v0.1.6 // indirect
github.com/spf13/afero v1.9.5 // indirect
github.com/spf13/cast v1.5.1 // indirect
github.com/spf13/jwalterweatherman v1.1.0 // indirect
github.com/spf13/pflag v1.0.5 // indirect
github.com/subosito/gotenv v1.2.0 // indirect
github.com/tklauser/go-sysconf v0.3.10 // indirect
github.com/tklauser/numcpus v0.4.0 // indirect
github.com/subosito/gotenv v1.4.2 // indirect
github.com/tklauser/go-sysconf v0.3.11 // indirect
github.com/tklauser/numcpus v0.6.0 // indirect
github.com/twitchyliquid64/golang-asm v0.15.1 // indirect
github.com/ugorji/go/codec v1.2.9 // indirect
github.com/yusufpapurcu/wmi v1.2.2 // indirect
go.uber.org/atomic v1.6.0 // indirect
go.uber.org/multierr v1.5.0 // indirect
golang.org/x/arch v0.0.0-20210923205945-b76863e36670 // indirect
github.com/ugorji/go/codec v1.2.11 // indirect
github.com/xo/terminfo v0.0.0-20210125001918-ca9a967f8778 // indirect
github.com/yusufpapurcu/wmi v1.2.3 // indirect
go.uber.org/atomic v1.9.0 // indirect
go.uber.org/multierr v1.8.0 // indirect
golang.org/x/arch v0.3.0 // indirect
golang.org/x/image v0.5.0 // indirect
golang.org/x/lint v0.0.0-20210508222113-6edffad5e616 // indirect
golang.org/x/net v0.10.0 // indirect
golang.org/x/sys v0.8.0 // indirect
golang.org/x/time v0.0.0-20211116232009-f0f3c7e86c11 // indirect
golang.org/x/sys v0.10.0 // indirect
golang.org/x/time v0.1.0 // indirect
golang.org/x/tools v0.9.1 // indirect
google.golang.org/protobuf v1.28.1 // indirect
gopkg.in/ini.v1 v1.55.0 // indirect
gopkg.in/yaml.v2 v2.4.0 // indirect
google.golang.org/protobuf v1.30.0 // indirect
gopkg.in/ini.v1 v1.67.0 // indirect
gopkg.in/yaml.v3 v3.0.1 // indirect
gorm.io/plugin/dbresolver v1.4.1 // indirect
modernc.org/libc v1.24.1 // indirect
......
此差异已折叠。
......@@ -5,7 +5,7 @@ import (
"github.com/flipped-aurora/gin-vue-admin/server/global"
"github.com/go-redis/redis/v8"
"github.com/redis/go-redis/v9"
"go.uber.org/zap"
)
......
package request
import (
"github.com/gofrs/uuid"
"github.com/gofrs/uuid/v5"
jwt "github.com/golang-jwt/jwt/v4"
)
......
......@@ -2,7 +2,7 @@ package system
import (
"github.com/flipped-aurora/gin-vue-admin/server/global"
"github.com/gofrs/uuid"
"github.com/gofrs/uuid/v5"
)
type SysUser struct {
......
......@@ -13,7 +13,7 @@ import (
"github.com/flipped-aurora/gin-vue-admin/server/global"
"github.com/flipped-aurora/gin-vue-admin/server/model/system/request"
"github.com/gofrs/uuid"
"github.com/gofrs/uuid/v5"
"gorm.io/driver/mysql"
"gorm.io/gorm"
)
......
......@@ -13,7 +13,7 @@ import (
"github.com/flipped-aurora/gin-vue-admin/server/global"
"github.com/flipped-aurora/gin-vue-admin/server/model/system/request"
"github.com/gofrs/uuid"
"github.com/gofrs/uuid/v5"
"gorm.io/driver/postgres"
"gorm.io/gorm"
)
......
......@@ -8,7 +8,7 @@ import (
"github.com/flipped-aurora/gin-vue-admin/server/model/system/request"
"github.com/flipped-aurora/gin-vue-admin/server/utils"
"github.com/glebarez/sqlite"
"github.com/gofrs/uuid"
"github.com/gofrs/uuid/v5"
"github.com/gookit/color"
"gorm.io/gorm"
"path/filepath"
......
......@@ -9,7 +9,7 @@ import (
"github.com/flipped-aurora/gin-vue-admin/server/model/common/request"
"github.com/flipped-aurora/gin-vue-admin/server/model/system"
"github.com/flipped-aurora/gin-vue-admin/server/utils"
"github.com/gofrs/uuid"
"github.com/gofrs/uuid/v5"
"gorm.io/gorm"
)
......
......@@ -5,7 +5,7 @@ import (
sysModel "github.com/flipped-aurora/gin-vue-admin/server/model/system"
"github.com/flipped-aurora/gin-vue-admin/server/service/system"
"github.com/flipped-aurora/gin-vue-admin/server/utils"
"github.com/gofrs/uuid"
"github.com/gofrs/uuid/v5"
"github.com/pkg/errors"
"gorm.io/gorm"
)
......
......@@ -4,7 +4,7 @@ import (
"github.com/flipped-aurora/gin-vue-admin/server/global"
systemReq "github.com/flipped-aurora/gin-vue-admin/server/model/system/request"
"github.com/gin-gonic/gin"
"github.com/gofrs/uuid"
"github.com/gofrs/uuid/v5"
)
func GetClaims(c *gin.Context) (*systemReq.CustomClaims, error) {
......
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
],
'plugins': [
......
......@@ -11,44 +11,45 @@
},
"dependencies": {
"@element-plus/icons-vue": "^2.1.0",
"axios": "^0.19.2",
"core-js": "^3.6.5",
"echarts": "5.3.2",
"element-plus": "^2.3.4",
"axios": "^1.4.0",
"core-js": "^3.31.1",
"echarts": "5.4.3",
"element-plus": "^2.3.8",
"highlight.js": "^11.8.0",
"marked": "^5.1.0",
"mitt": "^3.0.0",
"tailwindcss": "^3.3.3",
"marked": "4.3.0",
"mitt": "^3.0.1",
"nprogress": "^0.2.0",
"path": "^0.12.7",
"pinia": "^2.0.9",
"qs": "^6.8.0",
"pinia": "^2.1.4",
"qs": "^6.11.2",
"quill": "^1.3.7",
"screenfull": "^5.0.2",
"spark-md5": "^3.0.1",
"vue": "^3.2.47",
"vue-router": "^4.0.0-0"
"screenfull": "^6.0.2",
"spark-md5": "^3.0.2",
"vue": "^3.3.4",
"vue-router": "^4.2.4"
},
"devDependencies": {
"@vitejs/plugin-legacy": "^4.0.2",
"@vitejs/plugin-vue": "^4.1.0",
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-plugin-router": "~4.5.0",
"@vue/cli-plugin-vuex": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"@vue/compiler-sfc": "^3.1.5",
"babel-eslint": "^10.1.0",
"babel-plugin-import": "^1.13.3",
"@vitejs/plugin-legacy": "^4.1.0",
"@vitejs/plugin-vue": "^4.2.3",
"@vue/cli-plugin-babel": "~5.0.8",
"@vue/cli-plugin-eslint": "~5.0.8",
"@vue/cli-plugin-router": "~5.0.8",
"@vue/cli-plugin-vuex": "~5.0.8",
"@vue/cli-service": "~5.0.8",
"@vue/compiler-sfc": "^3.3.4",
"@babel/eslint-parser": "^7.22.9",
"babel-plugin-import": "^1.13.6",
"chalk": "^4.1.2",
"dotenv": "^10.0.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^7.0.0",
"dotenv": "^16.3.1",
"eslint": "^8.45.0",
"eslint-plugin-vue": "^9.15.1",
"sass": "^1.54.0",
"terser": "^5.4.0",
"unplugin-auto-import": "^0.14.2",
"unplugin-vue-components": "^0.23.0",
"vite": "^4.3.1",
"vite-plugin-banner": "^0.1.3",
"terser": "^5.19.1",
"unplugin-auto-import": "^0.16.6",
"unplugin-vue-components": "^0.25.1",
"vite": "^4.4.6",
"vite-plugin-banner": "^0.7.0",
"vite-plugin-importer": "^0.2.5"
}
}
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}
......@@ -18,6 +18,9 @@ import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
// import zhCn from 'element-plus/lib/locale/lang/zh-cn'
</script>
<style lang="scss">
@tailwind base;
@tailwind components;
@tailwind utilities;
// 引入初始化样式
#app {
background: #eee;
......
<template>
<div class="init_page">
<div class="init_page_panel">
<div v-if="hello < 2" id="hello" :class="[hello < 1 ? 'slide-in-fwd-top' : 'slide-out-right']" class="hello">
<div>
<div class="hello_title">GIN-VUE-ADMIN</div>
<p class="in-two a-fadeinT">初始化须知</p>
<p class="init_p">1.您需有用一定的VUE和GOLANG基础</p>
<p class="init_p">2.请您确认是否已经阅读过官方文档</p>
<p class="init_p">3.请您确认是否了解后续的配置流程</p>
<p class="init_p">4.如果您使用mysql数据库,请确认数据库引擎为<span style="color: red">innoDB</span></p>
<p class="init_p">注:开发组不为文档中书写过的内容提供无偿服务</p>
<p class="init_btn">
<el-button type="primary" @click="goDoc">
<div class="rounded-lg flex items-center justify-evenly w-full h-full relative bg-white md:w-screen md:h-screen md:bg-[#194bfb] overflow-hidden">
<div class="rounded-md w-full h-full flex items-center justify-center overflow-hidden">
<div class="oblique h-[130%] w-3/5 bg-white transform -rotate-12 absolute -ml-80" />
<div v-if="!page.showForm" :class="[page.showReadme ?'slide-out-right' :'slide-in-fwd-top' ]">
<div class=" text-lg">
<div class="font-sans text-4xl font-bold text-center mb-4">GIN-VUE-ADMIN</div>
<p class="text-gray-600 mb-2">初始化须知</p>
<p class="text-gray-600 mb-2">1.您需有用一定的VUE和GOLANG基础</p>
<p class="text-gray-600 mb-2">2.请您确认是否已经阅读过<a class="text-blue-600 font-bold" href="https://www.gin-vue-admin.com">官方文档</a></p>
<p class="text-gray-600 mb-2">3.请您确认是否了解后续的配置流程</p>
<p class="text-gray-600 mb-2">4.如果您使用mysql数据库,请确认数据库引擎为<span class="text-red-600 font-bold text-3xl ml-2 ">innoDB</span></p>
<p class="text-gray-600 mb-2">注:开发组不为文档中书写过的内容提供无偿服务</p>
<p class="flex items-center justify-between mt-8">
<el-button type="primary" @click="goDoc" size="large">
阅读文档
</el-button>
<el-button type="primary" @click="showNext">
<el-button type="primary" @click="showNext" size="large">
我已确认
</el-button>
</p>
</div>
</div>
<div
v-if="hello > 0 "
:class="[(hello > 0 && !out)? 'slide-in-left' : '' , out ? 'slide-out-right' : '']"
class="form"
v-if="page.showForm "
:class="[ page.showForm ? 'slide-in-left' : 'slide-out-right' ]"
class="w-96"
>
<el-form ref="formRef" :model="form" label-width="100px">
<el-form ref="formRef" :model="form" label-width="100px" size="large">
<el-form-item label="数据库类型">
<el-select v-model="form.dbType" placeholder="请选择" @change="changeDB">
<el-select v-model="form.dbType" placeholder="请选择" @change="changeDB" class="w-full">
<el-option key="mysql" label="mysql" value="mysql" />
<el-option key="pgsql" label="pgsql" value="pgsql" />
<el-option key="oracle" label="oracle" value="oracle" />
<el-option key="mssql" label="mssql" value="mssql" />
<el-option key="sqlite" label="sqlite" value="sqlite"/>
<el-option key="sqlite" label="sqlite" value="sqlite" />
</el-select>
</el-form-item>
<el-form-item label="host" v-if="form.dbType !== 'sqlite'">
<el-form-item v-if="form.dbType !== 'sqlite'" label="host">
<el-input v-model="form.host" placeholder="请输入数据库链接" />
</el-form-item>
<el-form-item label="port" v-if="form.dbType !== 'sqlite'">
<el-form-item v-if="form.dbType !== 'sqlite'" label="port">
<el-input v-model="form.port" placeholder="请输入数据库端口" />
</el-form-item>
<el-form-item label="userName" v-if="form.dbType !== 'sqlite'">
<el-form-item v-if="form.dbType !== 'sqlite'" label="userName">
<el-input v-model="form.userName" placeholder="请输入数据库用户名" />
</el-form-item>
<el-form-item label="password" v-if="form.dbType !== 'sqlite'">
<el-form-item v-if="form.dbType !== 'sqlite'" label="password">
<el-input v-model="form.password" placeholder="请输入数据库密码(没有则为空)" />
</el-form-item>
<el-form-item label="dbName">
<el-input v-model="form.dbName" placeholder="请输入数据库名称" />
</el-form-item>
<el-form-item label="dbPath" v-if="form.dbType === 'sqlite'">
<el-input v-model="form.dbPath" placeholder="请输入sqlite数据库文件存放路径"></el-input>
<el-form-item v-if="form.dbType === 'sqlite'" label="dbPath">
<el-input v-model="form.dbPath" placeholder="请输入sqlite数据库文件存放路径" />
</el-form-item>
<el-form-item>
<div style="text-align: right">
......@@ -61,6 +62,12 @@
</el-form>
</div>
</div>
<div class="hidden md:block w-1/2 h-full float-right bg-[#194bfb]"><img
class="h-full"
src="@/assets/login_right_banner.jpg"
alt="banner"
></div>
</div>
</template>
......@@ -79,9 +86,16 @@ import { useRouter } from 'vue-router'
const router = useRouter()
const hello = ref(0)
const page = reactive({
showReadme: false,
showForm: false
})
const showNext = () => {
hello.value = hello.value + 1
page.showReadme = false
setTimeout(() => {
page.showForm = true
}, 20)
}
const goDoc = () => {
......@@ -194,61 +208,6 @@ const onSubmit = async() => {
</script>
<style lang="scss" scoped>
.init_page {
margin: 0;
padding: 0;
background-image: url('@/assets/login_background.jpg');
background-size: cover;
width: 100%;
height: 100%;
position: relative;
.init_page_panel {
position: absolute;
top: 3vh;
left: 2vw;
width: 96vw;
height: 94vh;
background-color: rgba(255, 255, 255, 0.8);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: space-evenly;
.hello {
position: absolute;
z-index: 2;
text-align: center;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
.hello_title {
font-size: 32px;
line-height: 98px;
}
.in-two {
font-size: 22px;
}
.init_p {
margin-top: 20px;
color: #777777;
}
.init_btn {
margin-top: 20px;
}
}
.form {
position: absolute;
z-index: 3;
margin-top: 60px;
width: 600px;
height: auto;
padding: 20px;
border-radius: 6px;
}
}
}
.slide-in-fwd-top {
-webkit-animation: slide-in-fwd-top 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94)
......
<!-- 此文件禁止修改!如果您没有购买授权,请联系wx:shouzi_1994购买授权,未授权状态只需保留此代码 不影响任何正常使用 -->
<template>
<div class="bottom-info">
<div>
<span>Powered by</span>
<span>
<a href="https://github.com/flipped-aurora/gin-vue-admin">{{ $GIN_VUE_ADMIN.appName }}</a>
</span>
<el-divider direction="vertical" />
<span>Copyright</span>
<span>
<a href="https://github.com/flipped-aurora">flipped-aurora团队</a>
</span>
</div>
<div class="flex gap-4 items-center text-sm text-gray-500 justify-center mb-4">
<span>Powered by</span>
<span>
<a class="text-gray-800 font-bold" href="https://github.com/flipped-aurora/gin-vue-admin">{{ $GIN_VUE_ADMIN.appName }}</a>
</span>
<slot />
<span>Copyright</span>
<span>
<a class="text-gray-800 font-bold" href="https://github.com/flipped-aurora">flipped-aurora团队</a>
</span>
</div>
</template>
......@@ -22,20 +22,12 @@ export default {
}
</script>
<style lang="scss">
.bottom-info {
color: #888;
height: 30px;
line-height: 12px;
a {
color: #888;
}
div {
display: flex;
justify-content: center;
span{
margin: 0 3px;
}
}
}
</style>
<script setup>
console.log(
`%c powered by %c flipped-aurorae %c`,
'background:#0081ff; padding: 1px; border-radius: 3px 0 0 3px; color: #fff',
'background:#354855; padding: 1px 5px; border-radius: 0 3px 3px 0; color: #fff; font-weight: bold;',
'background:transparent'
)
</script>
<template>
<div id="userLayout">
<div class="login_panel">
<div class="login_panel_form">
<div class="login_panel_form_title">
<img
class="login_panel_form_title_logo"
:src="$GIN_VUE_ADMIN.appLogo"
alt
>
<p class="login_panel_form_title_p">{{ $GIN_VUE_ADMIN.appName }}</p>
</div>
<el-form
ref="loginForm"
:model="loginFormData"
:rules="rules"
:validate-on-rule-change="false"
@keyup.enter="submitForm"
>
<el-form-item prop="username">
<el-input
v-model="loginFormData.username"
size="large"
placeholder="请输入用户名"
suffix-icon="user"
/>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="loginFormData.password"
show-password
size="large"
type="password"
placeholder="请输入密码"
/>
</el-form-item>
<el-form-item v-if="loginFormData.openCaptcha" prop="captcha">
<div class="vPicBox">
<el-input
v-model="loginFormData.captcha"
placeholder="请输入验证码"
size="large"
style="flex:1;padding-right: 20px;"
/>
<div class="vPic">
<img
v-if="picPath"
:src="picPath"
alt="请输入验证码"
@click="loginVerify()"
>
</div>
<div id="userLayout" class="w-full h-full relative">
<div
class="rounded-lg flex items-center justify-evenly w-full h-full bg-white md:w-screen md:h-screen md:bg-[#194bfb]"
>
<div class="md:w-3/5 w-10/12 h-full flex items-center justify-evenly">
<div class="oblique h-[130%] w-3/5 bg-white transform -rotate-12 absolute -ml-52" />
<!-- 分割斜块 -->
<div class="z-[999] pt-12 pb-10 md:w-96 w-full rounded-lg flex flex-col justify-between box-border">
<div>
<div class="flex items-center justify-center">
<img class="w-24" :src="$GIN_VUE_ADMIN.appLogo" alt>
</div>
</el-form-item>
<el-form-item>
<el-button
type="primary"
style="width: 46%"
size="large"
@click="checkInit"
>前往初始化</el-button>
<el-button
type="primary"
size="large"
style="width: 46%; margin-left: 8%"
@click="submitForm"
>登 录</el-button>
</el-form-item>
</el-form>
</div>
<div class="login_panel_right" />
<div class="login_panel_foot">
<div class="links">
<a href="http://doc.henrongyi.top/" target="_blank">
<img src="@/assets/docs.png" class="link-icon" alt="文档">
</a>
<a href="https://support.qq.com/product/371961" target="_blank">
<img src="@/assets/kefu.png" class="link-icon" alt="客服">
</a>
<a
href="https://github.com/flipped-aurora/gin-vue-admin"
target="_blank"
>
<img src="@/assets/github.png" class="link-icon" alt="github">
</a>
<a href="https://space.bilibili.com/322210472" target="_blank">
<img src="@/assets/video.png" class="link-icon" alt="视频站">
</a>
</div>
<div class="copyright">
<BottomInfo />
<div class="mb-9">
<p class="text-center text-4xl font-bold">{{ $GIN_VUE_ADMIN.appName }}</p>
<p class="text-center text-sm font-normal text-gray-500 mt-2.5">A management platform using Golang and Vue
</p>
</div>
<el-form
ref="loginForm"
:model="loginFormData"
:rules="rules"
:validate-on-rule-change="false"
@keyup.enter="submitForm"
>
<el-form-item prop="username" class="mb-6">
<el-input v-model="loginFormData.username" size="large" placeholder="请输入用户名" suffix-icon="user" />
</el-form-item>
<el-form-item prop="password" class="mb-6">
<el-input
v-model="loginFormData.password"
show-password
size="large"
type="password"
placeholder="请输入密码"
/>
</el-form-item>
<el-form-item v-if="loginFormData.openCaptcha" prop="captcha" class="mb-6">
<div class="flex w-full justify-between">
<el-input v-model="loginFormData.captcha" placeholder="请输入验证码" size="large" class="flex-1 mr-5" />
<div class="w-1/3 h-11 bg-[#c3d4f2] rounded">
<img v-if="picPath" class="w-full h-full" :src="picPath" alt="请输入验证码" @click="loginVerify()">
</div>
</div>
</el-form-item>
<el-form-item class="mb-6">
<el-button class="shadow shadow-blue-600 h-11 w-full" type="primary" size="large" @click="submitForm">
</el-button>
</el-form-item>
<el-form-item class="mb-6">
<el-button
class="shadow shadow-blue-600 h-11 w-full"
type="primary"
size="large"
@click="checkInit"
>前往初始化</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
<div class="hidden md:block w-1/2 h-full float-right bg-[#194bfb]"><img
class="h-full"
src="@/assets/login_right_banner.jpg"
alt="banner"
></div>
</div>
<BottomInfo class="left-0 right-0 absolute bottom-3 mx-auto w-full z-20">
<div class="links items-center justify-center gap-2 hidden md:flex">
<a href="http://doc.henrongyi.top/" target="_blank">
<img src="@/assets/docs.png" class="w-8 h-8" alt="文档">
</a>
<a href="https://support.qq.com/product/371961" target="_blank">
<img src="@/assets/kefu.png" class="w-8 h-8" alt="客服">
</a>
<a href="https://github.com/flipped-aurora/gin-vue-admin" target="_blank">
<img src="@/assets/github.png" class="w-8 h-8" alt="github">
</a>
<a href="https://space.bilibili.com/322210472" target="_blank">
<img src="@/assets/video.png" class="w-8 h-8" alt="视频站">
</a>
</div>
</BottomInfo>
</div>
</template>
......@@ -203,7 +194,3 @@ const checkInit = async() => {
}
</script>
<style lang="scss" scoped>
@import "@/style/newLogin.scss";
</style>
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
"./index.html",
"./src/**/*.{vue,js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
plugins: [],
corePlugins: {
preflight: false
}
}
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册