Parcourir la source

Merge pull request #72 from flipped-aurora/gin-vue-admin_v2_dev

Gin vue admin v2 dev
rainyan il y a 4 ans
Parent
commit
76ccbcc229

+ 16 - 21
server/Dockerfile

@@ -1,26 +1,21 @@
-FROM centos:7.6.1810
+FROM golang:alpine as builder
+RUN apk add --update --no-cache yarn make g++
 
-# 设置go mod proxy 国内代理
-# 设置golang path
-ENV GOPROXY=https://goproxy.io GOPATH=/gopath PATH="${PATH}:/usr/local/go/bin"
-# 定义使用的Golang 版本
-ARG GO_VERSION=1.13.3
+ENV GOPROXY=https://goproxy.cn,https://goproxy.io,direct \
+    GO111MODULE=on \
+    CGO_ENABLED=1
+WORKDIR /go/src/gin-vue-admin
+RUN go env -w GOPROXY=https://goproxy.cn,https://goproxy.io,direct
+COPY . .
+RUN go env && go list && go build -v -a -ldflags "-extldflags \"-static\" " -o gvadmin .
 
-# 安装 golang 1.13.3
-RUN yum install -y wget && \
-    yum install -y wqy-microhei-fonts wqy-zenhei-fonts && \
-    wget "https://dl.google.com/go/go$GO_VERSION.linux-amd64.tar.gz" && \
-    rm -rf /usr/local/go && \
-    tar -C /usr/local -xzf "go$GO_VERSION.linux-amd64.tar.gz" && \
-    rm -rf *.tar.gz && \
-    go version && go env;
-
-
-WORKDIR $GOPATH
-COPY . gin-vue
-
-RUN cd gin-vue && go build -o app;
+WORKDIR /app
+COPY --from=builder /go/src/gin-vue-admin/gvadmin .
+COPY --from=builder /go/src/gin-vue-admin/db.db .
+COPY --from=builder /go/src/gin-vue-admin/config.yaml .
+COPY --from=builder /go/src/gin-vue-admin/resource ./resource
 
 EXPOSE 8888
 
-CMD ["gin-vue/app"]
+CMD ["gvadmin/app"]
+

+ 2 - 3
server/api/v1/exa_file_upload_download.go

@@ -27,7 +27,7 @@ func UploadFile(c *gin.Context) {
 		response.FailWithMessage(fmt.Sprintf("上传文件失败,%v", err), c)
 	} else {
 		//文件上传后拿到文件路径
-		err, filePath, key := utils.Upload(header, USER_HEADER_BUCKET, USER_HEADER_IMG_PATH)
+		err, filePath, key := utils.Upload(header)
 		if err != nil {
 			response.FailWithMessage(fmt.Sprintf("接收返回值失败,%v", err), c)
 		} else {
@@ -45,7 +45,6 @@ func UploadFile(c *gin.Context) {
 				response.FailWithMessage(fmt.Sprintf("修改数据库链接失败,%v", err), c)
 			} else {
 				response.OkDetailed(resp.ExaFileResponse{File: file}, "上传成功", c)
-
 			}
 		}
 	}
@@ -65,7 +64,7 @@ func DeleteFile(c *gin.Context) {
 	if err != nil {
 		response.FailWithMessage(fmt.Sprintf("删除失败,%v", err), c)
 	} else {
-		err = utils.DeleteFile(USER_HEADER_BUCKET, f.Key)
+		err = utils.DeleteFile(f.Key)
 		if err != nil {
 			response.FailWithMessage(fmt.Sprintf("删除失败,%v", err), c)
 

+ 1 - 6
server/api/v1/sys_user.go

@@ -18,11 +18,6 @@ import (
 	"time"
 )
 
-const (
-	USER_HEADER_IMG_PATH string = "http://qmplusimg.henrongyi.top"
-	USER_HEADER_BUCKET   string = "qm-plus-img"
-)
-
 // @Tags Base
 // @Summary 用户注册账号
 // @Produce  application/json
@@ -172,7 +167,7 @@ func UploadHeaderImg(c *gin.Context) {
 		response.FailWithMessage(fmt.Sprintf("上传文件失败,%v", err), c)
 	} else {
 		//文件上传后拿到文件路径
-		err, filePath, _ := utils.Upload(header, USER_HEADER_BUCKET, USER_HEADER_IMG_PATH)
+		err, filePath, _ := utils.Upload(header)
 		if err != nil {
 			response.FailWithMessage(fmt.Sprintf("接收返回值失败,%v", err), c)
 		} else {

+ 5 - 2
server/config.yaml

@@ -17,17 +17,20 @@ mysql:
     config: 'charset=utf8&parseTime=True&loc=Local'
     max-idle-conns: 10
     max-open-conns: 10
-    log-mode: true
+    log-mode: false
+
 #sqlite 配置
 sqlite:
     path: db.db
     log-mode: true
     config: 'loc=Asia/Shanghai'
+
 # oss configuration
 qiniu:
     access-key: '25j8dYBZ2wuiy0yhwShytjZDTX662b8xiFguwxzZ'
     secret-key: 'pgdbqEsf7ooZh7W3xokP833h3dZ_VecFXPDeG5JY'
-
+    bucket: 'qm-plus-img'
+    img-path: 'http://qmplusimg.henrongyi.top'
 # redis configuration
 redis:
     addr: '127.0.0.1:6379'

+ 2 - 0
server/config/config.go

@@ -46,6 +46,8 @@ type Redis struct {
 type Qiniu struct {
 	AccessKey string `mapstructure:"access-key" json:"accessKey" yaml:"access-key"`
 	SecretKey string `mapstructure:"secret-key" json:"secretKey" yaml:"secret-key"`
+	Bucket string `mapstructure:"bucket" json:"bucket" yaml:"bucket"`
+	ImgPath string `mapstructure:"img-path" json:"imgPath" yaml:"img-path"`
 }
 
 type Captcha struct {

+ 3 - 1
server/initialize/mysql.go

@@ -4,13 +4,15 @@ import (
 	"gin-vue-admin/global"
 	"github.com/jinzhu/gorm"
 	_ "github.com/jinzhu/gorm/dialects/mysql"
+	"os"
 )
 
 //初始化数据库并产生数据库全局变量
 func Mysql() {
 	admin := global.GVA_CONFIG.Mysql
 	if db, err := gorm.Open("mysql", admin.Username+":"+admin.Password+"@("+admin.Path+")/"+admin.Dbname+"?"+admin.Config); err != nil {
-		global.GVA_LOG.Error("DEFAULTDB数据库启动异常", err)
+		global.GVA_LOG.Error("MySQL启动异常", err)
+		os.Exit(0)
 	} else {
 		global.GVA_DB = db
 		global.GVA_DB.DB().SetMaxIdleConns(admin.MaxIdleConns)

+ 8 - 12
server/utils/upload.go

@@ -10,15 +10,12 @@ import (
 	"time"
 )
 
-var accessKey string = global.GVA_CONFIG.Qiniu.AccessKey // 你在七牛云的accessKey  这里是我个人测试号的key 仅供测试使用 恳请大家不要乱传东西
-var secretKey string = global.GVA_CONFIG.Qiniu.SecretKey // 你在七牛云的secretKey  这里是我个人测试号的key 仅供测试使用 恳请大家不要乱传东西
-
 // 接收两个参数 一个文件流 一个 bucket 你的七牛云标准空间的名字
-func Upload(file *multipart.FileHeader, bucket string, urlPath string) (err error, path string, key string) {
+func Upload(file *multipart.FileHeader) (err error, path string, key string) {
 	putPolicy := storage.PutPolicy{
-		Scope: bucket,
+		Scope: global.GVA_CONFIG.Qiniu.Bucket,
 	}
-	mac := qbox.NewMac(accessKey, secretKey)
+	mac := qbox.NewMac(global.GVA_CONFIG.Qiniu.AccessKey, global.GVA_CONFIG.Qiniu.SecretKey)
 	upToken := putPolicy.UploadToken(mac)
 	cfg := storage.Config{}
 	// 空间对应的机房
@@ -43,16 +40,15 @@ func Upload(file *multipart.FileHeader, bucket string, urlPath string) (err erro
 	fileKey := fmt.Sprintf("%d%s", time.Now().Unix(), file.Filename) // 文件名格式 自己可以改 建议保证唯一性
 	err = formUploader.Put(context.Background(), &ret, upToken, fileKey, f, dataLen, &putExtra)
 	if err != nil {
-		fmt.Println(err)
-		//qmlog.QMLog.Info(err)
+		global.GVA_LOG.Error("upload file fail:", err)
 		return err, "", ""
 	}
-	return err, urlPath + "/" + ret.Key, ret.Key
+	return err, global.GVA_CONFIG.Qiniu.ImgPath + "/" + ret.Key, ret.Key
 }
 
-func DeleteFile(bucket string, key string) error {
+func DeleteFile(key string) error {
 
-	mac := qbox.NewMac(accessKey, secretKey)
+	mac := qbox.NewMac(global.GVA_CONFIG.Qiniu.AccessKey, global.GVA_CONFIG.Qiniu.SecretKey)
 	cfg := storage.Config{
 		// 是否使用https域名进行资源管理
 		UseHTTPS: false,
@@ -61,7 +57,7 @@ func DeleteFile(bucket string, key string) error {
 	// 如果没有特殊需求,默认不需要指定
 	//cfg.Zone=&storage.ZoneHuabei
 	bucketManager := storage.NewBucketManager(mac, &cfg)
-	err := bucketManager.Delete(bucket, key)
+	err := bucketManager.Delete(global.GVA_CONFIG.Qiniu.Bucket, key)
 	if err != nil {
 		fmt.Println(err)
 		return err

+ 128 - 106
web/src/view/example/upload/upload.vue

@@ -1,153 +1,175 @@
 <template>
   <div v-loading.fullscreen.lock="fullscreenLoading">
     <div class="upload">
-    <el-upload
-      :action="`${path}/fileUploadAndDownload/upload`"
-      :before-upload="checkFile"
-      :headers="{'x-token':token}"
-      :on-error="uploadError"
-      :on-success="uploadSuccess"
-      :show-file-list="false"
-    >
-      <el-button size="small" type="primary">点击上传</el-button>
-      <div class="el-upload__tip" slot="tip">只能上传jpg/png文件,且不超过500kb</div>
-    </el-upload>
-    <el-table :data="tableData" border stripe>
-      <el-table-column label="预览" width="100">
-        <template slot-scope="scope">
-          <img :alt="scope.row.alt" :src="scope.row.url" height="80" width="80" />
-        </template>
-      </el-table-column>
-      <el-table-column label="日期" prop="UpdatedAt" width="180">
-        <template slot-scope="scope">
-          <div>{{scope.row.UpdatedAt|formatDate}}</div>
-        </template>
-      </el-table-column>
-      <el-table-column label="文件名" prop="name" width="180"></el-table-column>
-      <el-table-column label="链接" prop="url"></el-table-column>
-      <el-table-column label="标签" prop="tag" width="100">
-        <template slot-scope="scope">
-          <el-tag
-            :type="scope.row.tag === 'jpg' ? 'primary' : 'success'"
-            disable-transitions
-          >{{scope.row.tag}}</el-tag>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" width="100">
-        <template slot-scope="scope">
-          <el-button @click="downloadFile(scope.row)" size="small" type="text">下载</el-button>
-          <el-button @click="deleteFile(scope.row)" size="small" type="text">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-pagination
-      :current-page="page"
-      :page-size="pageSize"
-      :page-sizes="[10, 30, 50, 100]"
-      :style="{float:'right',padding:'20px'}"
-      :total="total"
-      @current-change="handleCurrentChange"
-      @size-change="handleSizeChange"
-      layout="total, sizes, prev, pager, next, jumper"
-    ></el-pagination>
+      <el-upload
+        :action="`${path}/fileUploadAndDownload/upload`"
+        :before-upload="checkFile"
+        :headers="{ 'x-token': token }"
+        :on-error="uploadError"
+        :on-success="uploadSuccess"
+        :show-file-list="false"
+      >
+        <el-button size="small" type="primary">点击上传</el-button>
+        <div class="el-upload__tip" slot="tip">
+          只能上传jpg/png文件,且不超过500kb
+        </div>
+      </el-upload>
+      <el-table :data="tableData" border stripe>
+        <el-table-column label="预览" width="100">
+          <template slot-scope="scope">
+            <img
+              :alt="scope.row.alt"
+              :src="scope.row.url"
+              height="80"
+              width="80"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column label="日期" prop="UpdatedAt" width="180">
+          <template slot-scope="scope">
+            <div>{{ scope.row.UpdatedAt | formatDate }}</div>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="文件名"
+          prop="name"
+          width="180"
+        ></el-table-column>
+        <el-table-column label="链接" prop="url"></el-table-column>
+        <el-table-column label="标签" prop="tag" width="100">
+          <template slot-scope="scope">
+            <el-tag
+              :type="scope.row.tag === 'jpg' ? 'primary' : 'success'"
+              disable-transitions
+              >{{ scope.row.tag }}</el-tag
+            >
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="100">
+          <template slot-scope="scope">
+            <el-button @click="downloadFile(scope.row)" size="small" type="text"
+              >下载</el-button
+            >
+            <el-button @click="deleteFile(scope.row)" size="small" type="text"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        :current-page="page"
+        :page-size="pageSize"
+        :page-sizes="[10, 30, 50, 100]"
+        :style="{ float: 'right', padding: '20px' }"
+        :total="total"
+        @current-change="handleCurrentChange"
+        @size-change="handleSizeChange"
+        layout="total, sizes, prev, pager, next, jumper"
+      ></el-pagination>
     </div>
   </div>
 </template>
-   
+
 <script>
-const path = process.env.VUE_APP_BASE_API
-import { mapGetters } from 'vuex'
-import infoList from '@/components/mixins/infoList'
-import { getFileList, deleteFile } from '@/api/fileUploadAndDownload'
-import { downloadImage } from '@/utils/downloadImg'
-import { formatTimeToStr } from '@/utils/data'
+const path = process.env.VUE_APP_BASE_API;
+import { mapGetters } from "vuex";
+import infoList from "@/components/mixins/infoList";
+import { getFileList, deleteFile } from "@/api/fileUploadAndDownload";
+import { downloadImage } from "@/utils/downloadImg";
+import { formatTimeToStr } from "@/utils/data";
 export default {
-  name: 'Upload',
+  name: "Upload",
   mixins: [infoList],
   data() {
     return {
-      fullscreenLoading:false,
+      fullscreenLoading: false,
       listApi: getFileList,
       path: path,
-      tableData: []
-    }
+      tableData: [],
+    };
   },
   computed: {
-    ...mapGetters('user', ['userInfo', 'token'])
+    ...mapGetters("user", ["userInfo", "token"]),
   },
   filters: {
     formatDate: function(time) {
-      if (time != null && time != '') {
-        var date = new Date(time)
-        return formatTimeToStr(date, 'yyyy-MM-dd hh:mm:ss')
+      if (time != null && time != "") {
+        var date = new Date(time);
+        return formatTimeToStr(date, "yyyy-MM-dd hh:mm:ss");
       } else {
-        return ''
+        return "";
       }
-    }
+    },
   },
   methods: {
     async deleteFile(row) {
-      this.$confirm('此操作将永久文件, 是否继续?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
+      this.$confirm("此操作将永久文件, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
       })
         .then(async () => {
-          const res = await deleteFile(row)
+          const res = await deleteFile(row);
           if (res.code == 0) {
             this.$message({
-              type: 'success',
-              message: '删除成功!'
-            })
-            this.getTableData()
+              type: "success",
+              message: "删除成功!",
+            });
+            this.getTableData();
           }
         })
         .catch(() => {
           this.$message({
-            type: 'info',
-            message: '已取消删除'
-          })
-        })
+            type: "info",
+            message: "已取消删除",
+          });
+        });
     },
     checkFile(file) {
-      this.fullscreenLoading = true
-      const isJPG = file.type === 'image/jpeg'
-      const isPng = file.type === 'image/png'
-      const isLt2M = file.size / 1024 / 1024 < 2
+      this.fullscreenLoading = true;
+      const isJPG = file.type === "image/jpeg";
+      const isPng = file.type === "image/png";
+      const isLt2M = file.size / 1024 / 1024 < 2;
       if (!isJPG && !isPng) {
-        this.$message.error('上传头像图片只能是 JPG或png 格式!')
-        this.fullscreenLoading = false
+        this.$message.error("上传头像图片只能是 JPG或png 格式!");
+        this.fullscreenLoading = false;
       }
       if (!isLt2M) {
-        this.$message.error('上传头像图片大小不能超过 2MB!')
-        this.fullscreenLoading = false
+        this.$message.error("上传头像图片大小不能超过 2MB!");
+        this.fullscreenLoading = false;
       }
-      return (isPng || isJPG) && isLt2M
+      return (isPng || isJPG) && isLt2M;
     },
     uploadSuccess(res) {
-      this.$message({
-        type: 'success',
-        message: '上传成功'
-      })
+      this.fullscreenLoading = false;
       if (res.code == 0) {
-        this.getTableData()
+        this.$message({
+          type: "success",
+          message: "上传成功",
+        });
+        if (res.code == 0) {
+          this.getTableData();
+        }
+      } else {
+        this.$message({
+          type: "warning",
+          message: res.msg,
+        });
       }
-        this.fullscreenLoading = false
     },
     uploadError() {
       this.$message({
-        type: 'error',
-        message: '上传失败'
-      })
-        this.fullscreenLoading = false
-
+        type: "error",
+        message: "上传失败",
+      });
+      this.fullscreenLoading = false;
     },
     downloadFile(row) {
-      downloadImage(row.url, row.name)
-    }
+      downloadImage(row.url, row.name);
+    },
+  },
+  created() {
+    this.getTableData();
   },
-  created(){
-    this.getTableData()
-  }
-}
-</script>
+};
+</script>

+ 70 - 52
web/src/view/login/login.vue

@@ -3,19 +3,31 @@
     <vue-particle-line></vue-particle-line>
     <el-main class="login-box">
       <h1 class="title-1">
-        <img class="logo" :src="require('@/assets/logo.png')" alt="" srcset="">
+        <img
+          class="logo"
+          :src="require('@/assets/logo.png')"
+          alt=""
+          srcset=""
+        />
       </h1>
-      <el-form :model="loginForm" :rules="rules" ref="loginForm">
+      <el-form :model="loginForm" :rules="rules" ref="loginForm" @keyup.enter.native="submitForm">
         <el-form-item prop="username">
-          <el-input placeholder="请输入用户名" v-model="loginForm.username"></el-input>
+          <el-input
+            placeholder="请输入用户名"
+            v-model="loginForm.username"
+          ></el-input>
         </el-form-item>
         <el-form-item prop="password">
           <el-input
-            :type="lock==='lock'?'password':'text'"
+            :type="lock === 'lock' ? 'password' : 'text'"
             placeholder="请输入密码"
             v-model="loginForm.password"
           >
-            <i :class="'el-input__icon el-icon-' + lock" @click="changeLock" slot="suffix"></i>
+            <i
+              :class="'el-input__icon el-icon-' + lock"
+              @click="changeLock"
+              slot="suffix"
+            ></i>
           </el-input>
         </el-form-item>
         <el-form-item style="position:relative">
@@ -25,7 +37,13 @@
             placeholder="请输入验证码"
             maxlength="10"
           />
-          <img v-if="picPath" :src="path + picPath" alt="请输入验证码" @click="loginVefify()" class="vPic">
+          <img
+            v-if="picPath"
+            :src="path + picPath"
+            alt="请输入验证码"
+            @click="loginVefify()"
+            class="vPic"
+          />
         </el-form-item>
         <el-form-item>
           <el-button @click="submitForm" style="width:100%">登 录</el-button>
@@ -37,79 +55,79 @@
 </template>
 
 <script>
-import { mapActions } from 'vuex'
-import { captcha } from '@/api/user'
-const path = process.env.VUE_APP_BASE_API
+import { mapActions } from "vuex";
+import { captcha } from "@/api/user";
+const path = process.env.VUE_APP_BASE_API;
 export default {
-  name: 'Login',
+  name: "Login",
   data() {
     const checkUsername = (rule, value, callback) => {
       if (value.length < 5 || value.length > 12) {
-        return callback(new Error('请输入正确的用户名'))
+        return callback(new Error("请输入正确的用户名"));
       } else {
-        callback()
+        callback();
       }
-    }
+    };
     const checkPassword = (rule, value, callback) => {
       if (value.length < 6 || value.length > 12) {
-        return callback(new Error('请输入正确的密码'))
+        return callback(new Error("请输入正确的密码"));
       } else {
-        callback()
+        callback();
       }
-    }
+    };
 
     return {
-      lock: 'lock',
+      lock: "lock",
       loginForm: {
-        username: '',
-        password: '',
-        captcha:'',
-        captchaId: '',
+        username: "",
+        password: "",
+        captcha: "",
+        captchaId: "",
       },
       rules: {
-        username: [{ validator: checkUsername, trigger: 'blur' }],
-        password: [{ validator: checkPassword, trigger: 'blur' }]
+        username: [{ validator: checkUsername, trigger: "blur" }],
+        password: [{ validator: checkPassword, trigger: "blur" }],
       },
-      path:path,
-      logVerify:'',
-      picPath:''
-    }
+      path: path,
+      logVerify: "",
+      picPath: "",
+    };
   },
   created() {
-    this.loginVefify()
+    this.loginVefify();
   },
   methods: {
-    ...mapActions('user', ['LoginIn']),
+    ...mapActions("user", ["LoginIn"]),
     async login() {
-      await this.LoginIn(this.loginForm)
+      await this.LoginIn(this.loginForm);
     },
     async submitForm() {
-      this.$refs.loginForm.validate(async v => {
+      this.$refs.loginForm.validate(async (v) => {
         if (v) {
-          this.login()
-          this.loginVefify()
+          this.login();
+          this.loginVefify();
         } else {
           this.$message({
-            type: 'error',
-            message: '请正确填写登录信息',
-            showClose: true
-          })
-          this.loginVefify()
-          return false
+            type: "error",
+            message: "请正确填写登录信息",
+            showClose: true,
+          });
+          this.loginVefify();
+          return false;
         }
-      })
+      });
     },
     changeLock() {
-      this.lock === 'lock' ? (this.lock = 'unlock') : (this.lock = 'lock')
+      this.lock === "lock" ? (this.lock = "unlock") : (this.lock = "lock");
     },
     loginVefify() {
-      captcha({}).then(ele=>{
-        this.picPath = ele.data.picPath
-        this.loginForm.captchaId = ele.data.captchaId
-      })
-    }
-  }
-}
+      captcha({}).then((ele) => {
+        this.picPath = ele.data.picPath;
+        this.loginForm.captchaId = ele.data.captchaId;
+      });
+    },
+  },
+};
 </script>
 
 <style scoped lang="scss">
@@ -121,16 +139,16 @@ export default {
     position: absolute;
     left: 50%;
     margin-left: -22vw;
-    top:5vh;
-    .logo{
+    top: 5vh;
+    .logo {
       height: 35vh;
       width: 35vh;
     }
   }
-  .vPic{
+  .vPic {
     position: absolute;
     right: 10px;
-    bottom: 0px;   // 适配ie
+    bottom: 0px; // 适配ie
   }
 }
 </style>