8 changed files with 904 additions and 220 deletions
@ -0,0 +1,243 @@ |
|||||||
|
@@master_page.html |
||||||
|
<div id="app"> |
||||||
|
<section class="app-container"> |
||||||
|
<form |
||||||
|
id="frmSubmit" |
||||||
|
class="form" |
||||||
|
> |
||||||
|
<section |
||||||
|
class="row" |
||||||
|
style="grid-area: a" |
||||||
|
> |
||||||
|
<label for="">本地</label> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
placeholder="表名" |
||||||
|
v-model="formData.SYSTEM_TABLE_NAME" |
||||||
|
/> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
placeholder="表注释" |
||||||
|
v-model="formData.SYSTEM_TABLE_CNNAME" |
||||||
|
/> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
placeholder="字段名" |
||||||
|
v-model="formData.SYSTEM_FIELD" |
||||||
|
/> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
placeholder="字段注释" |
||||||
|
required |
||||||
|
v-model="formData.SYSTEM_NAME" |
||||||
|
/> |
||||||
|
<select |
||||||
|
style="width: 100px" |
||||||
|
v-model="formData.SYSTEM_FIELD_TYPE" |
||||||
|
> |
||||||
|
<option |
||||||
|
v-for="(item,index) in dict.filedType" |
||||||
|
:key="index" |
||||||
|
:value="item.VALUE" |
||||||
|
> |
||||||
|
{{item.LABEL}} |
||||||
|
</option> |
||||||
|
</select> |
||||||
|
<input |
||||||
|
v-if="formData.SYSTEM_FIELD_TYPE == 'dict'" |
||||||
|
type="text" |
||||||
|
placeholder="字典名称" |
||||||
|
v-model="formData.SYSTEM_DICT_NAME" |
||||||
|
/> |
||||||
|
</section> |
||||||
|
<section |
||||||
|
class="row" |
||||||
|
style="grid-area: b" |
||||||
|
> |
||||||
|
<label for="">三方</label> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
placeholder="表名" |
||||||
|
v-model="formData.OBJECT_TABLE_NAME" |
||||||
|
/> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
placeholder="表注释" |
||||||
|
v-model="formData.OBJECT_TABLE_CNNAME" |
||||||
|
/> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
placeholder="字段名" |
||||||
|
v-model="formData.INTERFACE_FIELD" |
||||||
|
/> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
placeholder="字段注释" |
||||||
|
required |
||||||
|
v-model="formData.INTERFACE_NAME" |
||||||
|
/> |
||||||
|
<select |
||||||
|
style="width: 100px" |
||||||
|
title="字段类型" |
||||||
|
v-model="formData.OBJECT_FIELD_TYPE" |
||||||
|
> |
||||||
|
<option |
||||||
|
v-for="(item,index) in dict.filedType" |
||||||
|
:key="index" |
||||||
|
:value="item.VALUE" |
||||||
|
> |
||||||
|
{{item.LABEL}} |
||||||
|
</option> |
||||||
|
</select> |
||||||
|
<input |
||||||
|
v-if="formData.OBJECT_FIELD_TYPE == 'dict'" |
||||||
|
type="text" |
||||||
|
placeholder="字典名称" |
||||||
|
v-model="formData.OBJECT_DICT_NAME" |
||||||
|
/> |
||||||
|
</section> |
||||||
|
<section |
||||||
|
class="domain" |
||||||
|
style="grid-area: c" |
||||||
|
> |
||||||
|
<button |
||||||
|
type="button" |
||||||
|
@click="save" |
||||||
|
> |
||||||
|
保存 |
||||||
|
</button> |
||||||
|
<button>清空</button> |
||||||
|
</section> |
||||||
|
</form> |
||||||
|
|
||||||
|
<section class="list"> |
||||||
|
<section |
||||||
|
v-for="item in data.Data" |
||||||
|
:key="item.id" |
||||||
|
> |
||||||
|
{{item.ID}} |
||||||
|
</section> |
||||||
|
</section> |
||||||
|
|
||||||
|
@@page_control.html |
||||||
|
</section> |
||||||
|
</div> |
||||||
|
|
||||||
|
<script> |
||||||
|
new Vue({ |
||||||
|
el: '#app', |
||||||
|
data() { |
||||||
|
return { |
||||||
|
count: 1, |
||||||
|
data: null, |
||||||
|
error: null, |
||||||
|
dict: { |
||||||
|
filedType: [], |
||||||
|
}, |
||||||
|
formData: { |
||||||
|
ID: '', |
||||||
|
SYSTEM_NAME: '', |
||||||
|
SYSTEM_FIELD: '', |
||||||
|
INTERFACE_NAME: '', |
||||||
|
INTERFACE_FIELD: '', |
||||||
|
OBJECT_TABLE_NAME: '', |
||||||
|
OBJECT_TABLE_CNNAME: '', |
||||||
|
SYSTEM_TABLE_CNNAME: '', |
||||||
|
SYSTEM_TABLE_NAME: '', |
||||||
|
SYSTEM_FIELD_TYPE: 'value', |
||||||
|
SYSTEM_DICT_NAME: '', |
||||||
|
OBJECT_FIELD_TYPE: 'value', |
||||||
|
OBJECT_DICT_NAME: '', |
||||||
|
}, |
||||||
|
} |
||||||
|
}, |
||||||
|
created() { |
||||||
|
this.getDictOption() |
||||||
|
this.fetchData('') |
||||||
|
}, |
||||||
|
mounted() {}, |
||||||
|
methods: { |
||||||
|
getDictOption() { |
||||||
|
axios |
||||||
|
.get('/dict_data/simpleList?type=std_filed_type', jwHeader) |
||||||
|
.then(res => { |
||||||
|
this.dict.filedType = res.data |
||||||
|
}) |
||||||
|
}, |
||||||
|
fetchData(append) { |
||||||
|
var url = '/std_filed/list?' + append |
||||||
|
axios |
||||||
|
.get(url, jwHeader) |
||||||
|
.then(response => { |
||||||
|
this.data = response.data |
||||||
|
this.error = null |
||||||
|
}) |
||||||
|
.catch(error => { |
||||||
|
this.error = error.message |
||||||
|
this.data = null |
||||||
|
}) |
||||||
|
}, |
||||||
|
save() { |
||||||
|
const data = this.formData |
||||||
|
const url = data.ID ? '/std_filed/update' : '/std_filed/create' |
||||||
|
axios |
||||||
|
.post(url, data, jwHeader) |
||||||
|
.then(response => { |
||||||
|
console.log(response.data) |
||||||
|
this.fetchData('') |
||||||
|
}) |
||||||
|
.catch(error => {}) |
||||||
|
}, |
||||||
|
}, |
||||||
|
}) |
||||||
|
</script> |
||||||
|
|
||||||
|
<style> |
||||||
|
.app-container { |
||||||
|
box-sizing: border-box; |
||||||
|
padding: 10px; |
||||||
|
background-color: #fff; |
||||||
|
} |
||||||
|
.form { |
||||||
|
padding: 10px; |
||||||
|
display: grid; |
||||||
|
grid-template-rows: repeat(2, 1fr); |
||||||
|
grid-template-columns: auto auto; |
||||||
|
grid-template-areas: 'a c' 'b c'; |
||||||
|
gap: 5px; |
||||||
|
} |
||||||
|
|
||||||
|
.form .row { |
||||||
|
display: flex; |
||||||
|
flex-flow: row nowrap; |
||||||
|
gap: 5px; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
|
||||||
|
.form .domain { |
||||||
|
display: flex; |
||||||
|
flex-flow: row nowrap; |
||||||
|
align-items: end; |
||||||
|
gap: 10px; |
||||||
|
} |
||||||
|
.domain button { |
||||||
|
border: 0; |
||||||
|
padding: 5px 10px; |
||||||
|
background-color: #0029be; |
||||||
|
border-radius: 4px; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
.row label { |
||||||
|
margin-bottom: 0; |
||||||
|
font-weight: normal; |
||||||
|
} |
||||||
|
.row input, |
||||||
|
.row select { |
||||||
|
outline: none; |
||||||
|
border: 0; |
||||||
|
padding: 5px 10px; |
||||||
|
background-color: #cccccc88; |
||||||
|
border-radius: 4px; |
||||||
|
color: #000; |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue