Skip to content

G
gin-vue-admin

jobily / gin-vue-admin
与 Fork 源项目一致

Fork自 FLIPPED-AURORA / gin-vue-admin

通知 1
Star 0
Fork 0
G
gin-vue-admin

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

提交 7c02634a 编写于 作者: P piexlMax
浏览文件
操作

增加自动化代码图片功能

上级 69daa8c8
隐藏空白更改
内联 并排
Showing with 323 addition and 57 deletion
server/resource/autocode_template/server/model.go.tpl
浏览文件 @ 7c02634a
......@@ -13,6 +13,8 @@ type {{.StructName}} struct {
{{.FieldName}} string `json:"{{.FieldJson}}" form:"{{.FieldJson}}" gorm:"column:{{.ColumnName}};type:enum({{.DataTypeLong}});comment:{{.Comment}};"`
{{- else if ne .FieldType "string" }}
{{.FieldName}} *{{.FieldType}} `json:"{{.FieldJson}}" form:"{{.FieldJson}}" gorm:"column:{{.ColumnName}};comment:{{.Comment}};{{- if .DataTypeLong -}}size:{{.DataTypeLong}};{{- end -}}"`
{{- else if qe .FieldType "picture" }}
{{.FieldName}} string `json:"{{.FieldJson}}" form:"{{.FieldJson}}" gorm:"column:{{.ColumnName}};comment:{{.Comment}};{{- if .DataTypeLong -}}size:{{.DataTypeLong}};{{- end -}}"`
{{- else }}
{{.FieldName}} {{.FieldType}} `json:"{{.FieldJson}}" form:"{{.FieldJson}}" gorm:"column:{{.ColumnName}};comment:{{.Comment}};{{- if .DataTypeLong -}}size:{{.DataTypeLong}};{{- end -}}"`
{{- end }} {{- end }}
......
server/resource/autocode_template/web/form.vue.tpl
浏览文件 @ 7c02634a
......@@ -30,7 +30,10 @@
<el-option v-for="item in [{{ .DataTypeLong }}]" :key="item" :label="item" :value="item" />
</el-select>
{{- end }}
</el-form-item>
{{- if eq .FieldType "picture" }}
<SelectImage v-model="formData.{{ .FieldJson }}" />
{{- end }}
</el-form-item>
{{- end }}
<el-form-item>
<el-button type="primary" @click="save">保存</el-button>
......@@ -59,6 +62,9 @@ import { getDictFunc } from '@/utils/format'
import { useRoute, useRouter } from "vue-router"
import { ElMessage } from 'element-plus'
import { ref, reactive } from 'vue'
{{- if eq .FieldType "picture" }}
import SelectImage from '@/components/selectImage/selectImage.vue'
{{- end }}
const route = useRoute()
const router = useRouter()
......
server/resource/autocode_template/web/table.vue.tpl
浏览文件 @ 7c02634a
......@@ -109,6 +109,12 @@
<el-table-column {{- if .Sort}} sortable{{- end}} align="left" label="{{.FieldDesc}}" width="180">
<template #default="scope">{{"{{"}} formatDate(scope.row.{{.FieldJson}}) {{"}}"}}</template>
</el-table-column>
{{- else if eq .FieldType "picture" }}
<el-table-column label="{{.FieldDesc}}" width="200">
<template #default="scope">
<el-image style="width: 100px; height: 100px" :src="scope.row.{{.FieldJson}}" fit="cover"/>
</template>
</el-table-column>
{{- else }}
<el-table-column {{- if .Sort}} sortable{{- end}} align="left" label="{{.FieldDesc}}" prop="{{.FieldJson}}" width="120" />
{{- end }}
......@@ -161,6 +167,9 @@
<el-select v-model="formData.{{ .FieldJson }}" placeholder="请选择" style="width:100%" :clearable="{{.Clearable}}" >
<el-option v-for="item in [{{.DataTypeLong}}]" :key="item" :label="item" :value="item" />
</el-select>
{{- end }}
{{- if eq .FieldType "picture" }}
<SelectImage v-model="formData.{{ .FieldJson }}" />
{{- end }}
</el-form-item>
{{- end }}
......@@ -191,6 +200,11 @@ import {
get{{.StructName}}List
} from '@/api/{{.PackageName}}'
{{- if eq .FieldType "picture" }}
// 图片选择组件
import SelectImage from '@/components/selectImage/selectImage.vue'
{{- end }}
// 全量引入格式化工具 请按需保留
import { getDictFunc, formatDate, formatBoolean, filterDict } from '@/utils/format'
import { ElMessage, ElMessageBox } from 'element-plus'
......
web/src/components/chooseImg/index.vue
浏览文件 @ 7c02634a
......@@ -31,7 +31,7 @@
<div class="header-img-box-list">
<el-image
:key="key"
:src="(item.url && item.url.slice(0, 4) !== 'http')?path+item.url:item.url"
:src="getUrl(item.url)"
@click="chooseImg(item.url,target,targetKey)"
>
<template #error>
......@@ -59,6 +59,7 @@
</template>
<script setup>
import { getUrl } from '@/utils/image'
import { ref } from 'vue'
import { getFileList, editFileName } from '@/api/fileUploadAndDownload'
import UploadImage from '@/components/upload/image.vue'
......@@ -99,7 +100,6 @@ defineProps({
const drawer = ref(false)
const picList = ref([])
const path = ref(import.meta.env.VITE_BASE_API + '/')
const chooseImg = (url, target, targetKey) => {
if (target && targetKey) {
......
web/src/components/selectImage/selectImage.vue 0 → 100644
浏览文件 @ 7c02634a
<template>
<div
class="update-image"
:style="{
'background-image': `url(${getUrl(modelValue)})`,
}"
>
<span class="update" @click="openChooseImg">
<el-icon>
<edit />
</el-icon>
重新上传</span>
</div>
<el-drawer v-model="drawer" title="媒体库" size="650px">
<warning-bar
title="点击“文件名/备注”可以编辑文件名或者备注内容。"
/>
<div class="gva-btn-list">
<upload-common
v-model:imageCommon="imageCommon"
class="upload-btn-media-library"
@on-success="open"
/>
<upload-image
v-model:imageUrl="imageUrl"
:file-size="512"
:max-w-h="1080"
class="upload-btn-media-library"
@on-success="open"
/>
<el-form ref="searchForm" :inline="true" :model="search">
<el-form-item label="">
<el-input v-model="search.keyword" class="keyword" placeholder="请输入文件名或备注" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="search" @click="open">查询</el-button>
</el-form-item>
</el-form>
</div>
<div class="media">
<div v-for="(item,key) in picList" :key="key" class="media-box">
<div class="header-img-box-list">
<el-image
:key="key"
:src="getUrl(item.url)"
@click="chooseImg(item.url)"
>
<template #error>
<div class="header-img-box-list">
<el-icon>
<picture />
</el-icon>
</div>
</template>
</el-image>
</div>
<div class="img-title" @click="editFileNameFunc(item)">{{ item.name }}</div>
</div>
</div>
<el-pagination
:current-page="page"
:page-size="pageSize"
:total="total"
:style="{'justify-content':'center'}"
layout="total, prev, pager, next, jumper"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
/>
</el-drawer>
</template>
<script setup>
import { getUrl } from '@/utils/image'
import { ref } from 'vue'
import { getFileList, editFileName } from '@/api/fileUploadAndDownload'
import UploadImage from '@/components/upload/image.vue'
import UploadCommon from '@/components/upload/common.vue'
import WarningBar from '@/components/warningBar/warningBar.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
const imageUrl = ref('')
const imageCommon = ref('')
const search = ref({})
const page = ref(1)
const total = ref(0)
const pageSize = ref(20)
const props = defineProps({
modelValue: {
type: String,
default: ''
},
})
console.log(props)
const emits = defineEmits(['update:modelValue'])
// 分页
const handleSizeChange = (val) => {
pageSize.value = val
openChooseImg()
}
const handleCurrentChange = (val) => {
page.value = val
openChooseImg()
}
const editFileNameFunc = async(row) => {
ElMessageBox.prompt('请输入文件名或者备注', '编辑', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputPattern: /\S/,
inputErrorMessage: '不能为空',
inputValue: row.name
}).then(async({ value }) => {
row.name = value
// console.log(row)
const res = await editFileName(row)
if (res.code === 0) {
ElMessage({
type: 'success',
message: '编辑成功!',
})
openChooseImg()
}
}).catch(() => {
ElMessage({
type: 'info',
message: '取消修改'
})
})
}
const drawer = ref(false)
const picList = ref([])
const chooseImg = (url) => {
emits('update:modelValue', url)
drawer.value = false
}
const openChooseImg = async() => {
const res = await getFileList({ page: page.value, pageSize: pageSize.value, ...search.value })
if (res.code === 0) {
picList.value = res.data.list
total.value = res.data.total
page.value = res.data.page
pageSize.value = res.data.pageSize
drawer.value = true
}
}
</script>
<style scoped lang="scss">
.update-image {
width: 120px;
height: 120px;
line-height: 120px;
margin: 0 auto;
display: flex;
justify-content: center;
border-radius: 20px;
background-repeat: no-repeat;
background-size: cover;
&:hover {
color: #fff;
background: linear-gradient(
to bottom,
rgba(255, 255, 255, 0.15) 0%,
rgba(0, 0, 0, 0.15) 100%
),
radial-gradient(
at top center,
rgba(255, 255, 255, 0.4) 0%,
rgba(0, 0, 0, 0.4) 120%
)
#989898;
background-blend-mode: multiply, multiply;
background-size: cover;
.update {
color: #fff;
}
}
.update {
height: 120px;
width: 120px;
text-align: center;
color: transparent;
}
}
.upload-btn-media-library {
margin-left: 20px;
}
.media {
display: flex;
flex-wrap: wrap;
.media-box {
width: 120px;
margin-left: 20px;
.img-title {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: 36px;
text-align: center;
cursor: pointer;
}
.header-img-box-list {
width: 120px;
height: 120px;
border: 1px dashed #ccc;
border-radius: 8px;
text-align: center;
line-height: 120px;
cursor: pointer;
overflow: hidden;
.el-image__inner {
max-width: 120px;
max-height: 120px;
vertical-align: middle;
width: unset;
height: unset;
}
}
}
}
</style>
web/src/utils/image.js
浏览文件 @ 7c02634a
......@@ -90,3 +90,6 @@ export default class ImageCompress {
return new Blob([ab], { type: mimeString, lastModifiedDate: new Date() })
}
}
const path = import.meta.env.VITE_BASE_API + '/'
export const getUrl = (url) => url && url.slice(0, 4) !== 'http' ? path + url : url
web/src/view/person/person.vue
浏览文件 @ 7c02634a
......@@ -4,25 +4,7 @@
<el-col :span="6">
<div class="fl-left avatar-box">
<div class="user-card">
<div
class="user-headpic-update"
:style="{
'background-image': `url(${
userStore.userInfo.headerImg &&
userStore.userInfo.headerImg.slice(0, 4) !== 'http'
? path + userStore.userInfo.headerImg
: userStore.userInfo.headerImg
})`,
'background-repeat': 'no-repeat',
'background-size': 'cover',
}"
>
<span class="update" @click="openChooseImg">
<el-icon>
<edit />
</el-icon>
重新上传</span>
</div>
<SelectImage v-model="userStore.userInfo.headerImg" />
<div class="user-personality">
<p v-if="!editFlag" class="nickName">
{{ userStore.userInfo.nickName }}
......@@ -129,8 +111,6 @@
</el-col>
</el-row>
<ChooseImg ref="chooseImgRef" @enter-img="enterImg" />
<el-dialog
v-model="showPassword"
title="修改密码"
......@@ -231,13 +211,12 @@ export default {
</script>
<script setup>
import ChooseImg from '@/components/chooseImg/index.vue'
import { setSelfInfo, changePassword } from '@/api/user.js'
import { reactive, ref } from 'vue'
import { reactive, ref, watch } from 'vue'
import { ElMessage } from 'element-plus'
import { useUserStore } from '@/pinia/modules/user'
import SelectImage from '@/components/selectImage/selectImage.vue'
const path = ref(import.meta.env.VITE_BASE_API + '/')
const activeName = ref('second')
const rules = reactive({
password: [
......@@ -297,21 +276,16 @@ const clearPassword = () => {
modifyPwdForm.value.clearValidate()
}
const chooseImgRef = ref(null)
const openChooseImg = () => {
chooseImgRef.value.open()
}
const enterImg = async(url) => {
const res = await setSelfInfo({ headerImg: url })
watch(() => userStore.userInfo.headerImg, async(val) => {
const res = await setSelfInfo({ headerImg: val })
if (res.code === 0) {
userStore.ResetUserInfo({ headerImg: url })
userStore.ResetUserInfo({ headerImg: val })
ElMessage({
type: 'success',
message: '设置成功',
})
}
}
})
const openEdit = () => {
nickName.value = userStore.userInfo.nickName
......
web/src/view/systemTools/autoCode/component/fieldDialog.vue
浏览文件 @ 7c02634a
......@@ -9,16 +9,16 @@
:rules="rules"
class="grid-form"
>
<el-form-item label="Field名称" prop="fieldName">
<el-form-item label="字段名称" prop="fieldName">
<el-input v-model="middleDate.fieldName" autocomplete="off" style="width:80%" />
<el-button style="width:18%;margin-left:2%" @click="autoFill">
<span style="font-size: 12px">自动填充</span>
</el-button>
</el-form-item>
<el-form-item label="Field中文名" prop="fieldDesc">
<el-form-item label="字段中文名" prop="fieldDesc">
<el-input v-model="middleDate.fieldDesc" autocomplete="off" />
</el-form-item>
<el-form-item label="FieldJSON" prop="fieldJson">
<el-form-item label="字段JSON" prop="fieldJson">
<el-input v-model="middleDate.fieldJson" autocomplete="off" />
</el-form-item>
<el-form-item label="数据库字段名" prop="columnName">
......@@ -27,11 +27,11 @@
<el-form-item label="数据库字段描述" prop="comment">
<el-input v-model="middleDate.comment" autocomplete="off" />
</el-form-item>
<el-form-item label="Field数据类型" prop="fieldType">
<el-form-item label="字段类型" prop="fieldType">
<el-select
v-model="middleDate.fieldType"
style="width:100%"
placeholder="请选择field数据类型"
placeholder="请选择字段类型"
clearable
@change="clearOther"
>
......@@ -40,17 +40,18 @@
:key="item.value"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
/>
</el-select>
</el-form-item>
<el-form-item :label="middleDate.fieldType === 'enum' ? '枚举值' : '类型长度'" prop="dataTypeLong">
<el-input v-model="middleDate.dataTypeLong" :placeholder="middleDate.fieldType === 'enum'?`例:'北京','天津'`:'数据库类型长度'" />
</el-form-item>
<el-form-item label="Field查询条件" prop="fieldSearchType">
<el-form-item label="字段查询条件" prop="fieldSearchType">
<el-select
v-model="middleDate.fieldSearchType"
style="width:100%"
placeholder="请选择Field查询条件"
placeholder="请选择字段查询条件"
clearable
>
<el-option
......@@ -58,10 +59,7 @@
:key="item.value"
:label="item.label"
:value="item.value"
:disabled="
(middleDate.fieldType!=='string'&&item.value==='LIKE')||
((middleDate.fieldType!=='int'&&middleDate.fieldType!=='time.Time'&&middleDate.fieldType!=='float64')&&(item.value==='BETWEEN' || item.value==='NOT BETWEEN'))
"
:disabled="canSelect(item.value)"
/>
</el-select>
</el-form-item>
......@@ -169,23 +167,42 @@ const typeOptions = ref([
{
label: '枚举',
value: 'enum'
},
{
label: '单图片（字符串）',
value: 'picture',
},
{
label: '多图片（开发中）',
value: 'pictures',
disabled: true
},
{
label: '文件（开发中）',
value: 'file',
disabled: true
},
{
label: '多文件（开发中）',
value: 'files',
disabled: true
}
])
const rules = ref({
fieldName: [
{ required: true, message: '请输入field英文名', trigger: 'blur' }
{ required: true, message: '请输入字段英文名', trigger: 'blur' }
],
fieldDesc: [
{ required: true, message: '请输入field中文名', trigger: 'blur' }
{ required: true, message: '请输入字段中文名', trigger: 'blur' }
],
fieldJson: [
{ required: true, message: '请输入field格式化json', trigger: 'blur' }
{ required: true, message: '请输入字段格式化json', trigger: 'blur' }
],
columnName: [
{ required: true, message: '请输入数据库字段', trigger: 'blur' }
],
fieldType: [
{ required: true, message: '请选择field数据类型', trigger: 'blur' }
{ required: true, message: '请选择字段类型', trigger: 'blur' }
]
})
......@@ -205,6 +222,18 @@ const autoFill = () => {
middleDate.value.columnName = toSQLLine(middleDate.value.fieldJson)
}
const canSelect = (item) => {
const fieldType = middleDate.value.fieldType
if (fieldType !== 'string' && item === 'LIKE') {
return true
}
if ((fieldType !== 'int' && fieldType !== 'time.Time' && fieldType !== 'float64') && (item === 'BETWEEN' || item === 'NOT BETWEEN')) {
return true
}
return false
}
const clearOther = () => {
middleDate.value.fieldSearchType = ''
middleDate.value.dictType = ''
......
web/src/view/systemTools/autoCode/index.vue
浏览文件 @ 7c02634a
......@@ -146,11 +146,11 @@
<!-- 组件列表 -->
<div class="gva-table-box">
<div class="gva-btn-list">
<el-button type="primary" @click="editAndAddField()">新增Field</el-button>
<el-button type="primary" @click="editAndAddField()">新增字段</el-button>
</div>
<el-table :data="form.fields">
<el-table-column align="left" type="index" label="序列" width="60" />
<el-table-column align="left" prop="fieldName" label="Field名" width="160">
<el-table-column align="left" prop="fieldName" label="字段名称" width="160">
<template #default="{row}">
<el-input v-model="row.fieldName" />
</template>
......@@ -166,17 +166,17 @@
<el-table-column align="left" prop="sort" label="排序">
<template #default="{row}"> <el-checkbox v-model="row.sort" /> </template>
</el-table-column>
<el-table-column align="left" prop="fieldJson" width="160px" label="FieldJson">
<el-table-column align="left" prop="fieldJson" width="160px" label="字段Json">
<template #default="{row}">
<el-input v-model="row.fieldJson" />
</template>
</el-table-column>
<el-table-column align="left" prop="fieldType" label="Field数据类型" width="160">
<el-table-column align="left" prop="fieldType" label="字段类型" width="160">
<template #default="{row}">
<el-select
v-model="row.fieldType"
style="width:100%"
placeholder="请选择field数据类型"
placeholder="请选择字段类型"
clearable
>
<el-option
......@@ -208,7 +208,7 @@
<el-select
v-model="row.fieldSearchType"
style="width:100%"
placeholder="请选择Field查询条件"
placeholder="请选择字段查询条件"
clearable
>
<el-option
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或