Skip to content

G
gin-vue-admin

祺技世界 / gin-vue-admin
与 Fork 源项目一致

Fork自 FLIPPED-AURORA / gin-vue-admin

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

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

未验证 提交 446d4fb4 编写于 作者: Mr.奇淼（'s avatar Mr.奇淼（ 提交者： GitHub
浏览文件
操作

Merge pull request #100 from DaiZero/master 

field列表添加上移和下移的功能
上级 fc82be83 a40a6d2b
隐藏空白更改
内联 并排
Showing with 180 addition and 181 deletion
web/src/view/systemTools/autoCode/index.vue
浏览文件 @ 446d4fb4
<template> <template>
<div> <div>
<!-- 初始版本自动化代码工具 --> <!-- 初始版本自动化代码工具 -->
<el-form ref="autoCodeForm" :rules="rules" :model="form" label-width="120px" :inline="true"> <el-form ref="autoCodeForm" :rules="rules" :model="form" label-width="120px" :inline="true">
<el-form-item label="Struct名称" prop="structName"> <el-form-item label="Struct名称" prop="structName">
<el-input v-model="form.structName" placeholder="首字母自动转换大写"></el-input> <el-input v-model="form.structName" placeholder="首字母自动转换大写"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="Struct简称" prop="abbreviation"> <el-form-item label="Struct简称" prop="abbreviation">
<el-input v-model="form.abbreviation" placeholder="简称会作为入参对象名和路由group"></el-input> <el-input v-model="form.abbreviation" placeholder="简称会作为入参对象名和路由group"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="文件名称" prop="packageName"> <el-form-item label="文件名称" prop="packageName">
<el-input v-model="form.packageName"></el-input> <el-input v-model="form.packageName"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-checkbox v-model="form.autoCreateApiToSql">自动创建api</el-checkbox> <el-checkbox v-model="form.autoCreateApiToSql">自动创建api</el-checkbox>
</el-form-item> </el-form-item>
</el-form> </el-form>
<!-- 组件列表 --> <!-- 组件列表 -->
<div class="button-box clearflex"> <div class="button-box clearflex">
<el-button @click="editAndAddField()" type="primary">新增Field</el-button> <el-button @click="editAndAddField()" type="primary">新增Field</el-button>
</div> </div>
<el-table <el-table :data="form.fields" border stripe>
:data="form.fields" <el-table-column type="index" label="序列" width="100">
border stripe> </el-table-column>
<el-table-column <el-table-column prop="fieldName" label="Field名">
type="index" </el-table-column>
label="序列" <el-table-column prop="fieldDesc" label="中文名">
width="280"> </el-table-column>
</el-table-column> <el-table-column prop="fieldJson" label="FieldJson">
<el-table-column </el-table-column>
prop="fieldName" <el-table-column prop="fieldType" label="Field数据类型" width="130">
label="Field名" </el-table-column>
width="280"> <el-table-column label="操作" width="250">
</el-table-column> <template slot-scope="scope">
<el-table-column <el-button type="primary" @click="editAndAddField(scope.row)">编辑</el-button>
prop="fieldDesc" <el-button type="success" :disabled="scope.$index == 0" @click="moveUpField(scope.$index)">上移</el-button>
label="中文名" <el-button type="warning" :disabled="(scope.$index + 1) == form.fields.length" @click="moveDownField(scope.$index)">下移</el-button>
width="280"> <el-popover placement="top" v-model="scope.row.visible">
</el-table-column> <p>确定删除吗？</p>
<el-table-column <div style="text-align: right; margin: 0">
prop="fieldJson" <el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
label="FieldJson" <el-button type="primary" size="mini" @click="deleteField(scope.$index)">确定</el-button>
width="280"> </div>
</el-table-column> <el-button type="danger" slot="reference">删除</el-button>
<el-table-column </el-popover>
prop="fieldType" </template>
label="Field数据类型" </el-table-column>
width="280"> </el-table>
</el-table-column> <!-- 组件列表 -->
<el-table-column <div class="button-box clearflex">
label="操作"> <el-button @click="enterForm" type="primary">生成代码包</el-button>
<template slot-scope="scope">
<el-button type="primary" @click="editAndAddField(scope.row)">编辑</el-button>
<el-popover
placement="top"
width="280"
v-model="scope.row.visible">
<p>这是一段内容这是一段内容确定删除吗？</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
<el-button type="primary" size="mini" @click="deleteField(scope.$index)">确定</el-button>
</div>
<el-button type="danger" slot="reference">删除</el-button>
</el-popover>
</template>
</el-table-column>
</el-table>
<!-- 组件列表 -->
<div class="button-box clearflex">
<el-button @click="enterForm" type="primary">生成代码包</el-button>
</div>
<!-- 组件弹窗 -->
<el-dialog title="组件内容" :visible.sync="dialogFlag">
<FieldDialog :dialogMiddle="dialogMiddle" ref="fieldDialog"/>
<div slot="footer" class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
</el-dialog>
</div> </div>
<!-- 组件弹窗 -->
<el-dialog title="组件内容" :visible.sync="dialogFlag">
<FieldDialog :dialogMiddle="dialogMiddle" ref="fieldDialog" />
<div slot="footer" class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
</el-dialog>
</div>
</template> </template>
<script> <script>
const fieldTemplate={ const fieldTemplate = {
fieldName:"", fieldName: '',
fieldDesc:"", fieldDesc: '',
fieldType:"", fieldType: '',
fieldJson:"", fieldJson: '',
columnName:"", columnName: '',
} }
import FieldDialog from "@/view/systemTools/autoCode/component/fieldDialog.vue" import FieldDialog from '@/view/systemTools/autoCode/component/fieldDialog.vue'
import {toUpperCase} from "@/utils/stringFun.js" import { toUpperCase } from '@/utils/stringFun.js'
import {createTemp} from "@/api/autoCode.js" import { createTemp } from '@/api/autoCode.js'
export default { export default {
name:"autoCode", name: 'autoCode',
data(){ data() {
return{ return {
addFlag:"", addFlag: '',
form:{ form: {
structName:"", structName: '',
packageName:"", packageName: '',
abbreviation:"", abbreviation: '',
autoCreateApiToSql:false, autoCreateApiToSql: false,
fields:[] fields: [],
}, },
rules:{ rules: {
structName:[{required: true, message: '请输入结构体名称', trigger: 'blur'}], structName: [{ required: true, message: '请输入结构体名称', trigger: 'blur' }],
abbreviation:[{required: true, message: '请输入结构体简称', trigger: 'blur'}], abbreviation: [{ required: true, message: '请输入结构体简称', trigger: 'blur' }],
packageName:[{required: true, message: '请输入包名称', trigger: 'blur'}] packageName: [{ required: true, message: '请输入包名称', trigger: 'blur' }],
}, },
dialogMiddle:{}, dialogMiddle: {},
bk:{}, bk: {},
dialogFlag:false dialogFlag: false,
}
},
components: {
FieldDialog,
},
methods: {
editAndAddField(item) {
this.dialogFlag = true
if (item) {
this.addFlag = 'edit'
this.bk = JSON.parse(JSON.stringify(item))
this.dialogMiddle = item
} else {
this.addFlag = 'add'
this.dialogMiddle = JSON.parse(JSON.stringify(fieldTemplate))
}
},
moveUpField(index) {
if (index == 0) {
return
}
const oldUpField = this.form.fields[index - 1]
this.form.fields.splice(index - 1, 1)
this.form.fields.splice(index, 0, oldUpField)
},
moveDownField(index) {
const fCount = this.form.fields.length
if (index == fCount - 1) {
return
}
const oldDownField = this.form.fields[index + 1]
this.form.fields.splice(index + 1, 1)
this.form.fields.splice(index, 0, oldDownField)
},
enterDialog() {
this.$refs.fieldDialog.$refs.fieldDialogFrom.validate((valid) => {
if (valid) {
this.dialogMiddle.fieldName = toUpperCase(this.dialogMiddle.fieldName)
if (this.addFlag == 'add') {
this.form.fields.push(this.dialogMiddle)
}
this.dialogFlag = false
} else {
return false
} }
})
}, },
components:{ closeDialog() {
FieldDialog if (this.addFlag == 'edit') {
this.dialogMiddle = this.bk
}
this.dialogFlag = false
}, },
methods:{ deleteField(index) {
editAndAddField(item){ this.form.fields.splice(index, 1)
this.dialogFlag = true },
if(item){ async enterForm() {
this.addFlag="edit" if (this.form.fields.length <= 0) {
this.bk=JSON.parse(JSON.stringify(item)) this.$message({
this.dialogMiddle = item type: 'error',
}else{ message: '请填写至少一个field',
this.addFlag="add" })
this.dialogMiddle = JSON.parse(JSON.stringify(fieldTemplate)) return false
} }
}, this.$refs.autoCodeForm.validate(async (valid) => {
enterDialog(){ if (valid) {
this.$refs.fieldDialog.$refs.fieldDialogFrom.validate((valid) => { this.form.structName = toUpperCase(this.form.structName)
if (valid) { if (this.form.structName == this.form.abbreviation) {
this.dialogMiddle.fieldName = toUpperCase(this.dialogMiddle.fieldName) this.$message({
if(this.addFlag=="add"){ type: 'error',
this.form.fields.push(this.dialogMiddle) message: 'structName和struct简称不能相同',
} })
this.dialogFlag = false return false
} else {
return false;
} }
}); const data = await createTemp(this.form)
const blob = new Blob([data])
}, const fileName = 'ginvueadmin.zip'
closeDialog(){ if ('download' in document.createElement('a')) {
if(this.addFlag=="edit"){ // 不是IE浏览器
this.dialogMiddle = this.bk let url = window.URL.createObjectURL(blob)
} let link = document.createElement('a')
this.dialogFlag = false link.style.display = 'none'
}, link.href = url
deleteField(index){ link.setAttribute('download', fileName)
this.form.fields.splice(index,1) document.body.appendChild(link)
}, link.click()
async enterForm(){ document.body.removeChild(link) // 下载完成移除元素
if(this.form.fields.length<=0){ window.URL.revokeObjectURL(url) // 释放掉blob对象
this.$message({
type:"error",
message:"请填写至少一个field"
})
return false
}
this.$refs.autoCodeForm.validate(async (valid) => {
if (valid) {
this.form.structName = toUpperCase(this.form.structName)
if(this.form.structName == this.form.abbreviation){
this.$message({
type:"error",
message:"structName和struct简称不能相同"
})
return false
}
const data = await createTemp(this.form)
const blob = new Blob([data])
const fileName = 'ginvueadmin.zip'
if ('download' in document.createElement('a')) { // 不是IE浏览器
let url = window.URL.createObjectURL(blob)
let link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('download', fileName)
document.body.appendChild(link)
link.click()
document.body.removeChild(link) // 下载完成移除元素
window.URL.revokeObjectURL(url) // 释放掉blob对象
} else { // IE 10+
window.navigator.msSaveBlob(blob, fileName)
}
} else { } else {
return false; // IE 10+
window.navigator.msSaveBlob(blob, fileName)
} }
}); } else {
return false
} }
} })
},
},
} }
</script> </script>
<style scope lang="scss"> <style scope lang="scss">
...@@ -200,4 +199,4 @@ export default { ...@@ -200,4 +199,4 @@ export default {
float: right; float: right;
} }
} }
</style> </style>
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或