Commit 5a70ba20 by 温丽香

参数模板修改完成

1 parent 092017ee
Pipeline #4936 passed
in 2 minutes 14 seconds
......@@ -98,7 +98,7 @@ export default {
content: '',
isBase64: false,
loadingStatus: false,
totalColumns: 0,
totalColumns: Number(this.$route.query.columns),
typeOptions: [{
value: 'base64',
label: 'base64'
......@@ -142,7 +142,6 @@ export default {
const str = decode.length > 64 ? 'blob' : isASCII(decode) ? decode : 'blob'
return str
})
this.totalColumns = item.binary.length
return item
})
this.total = res.data.table.total
......
......@@ -23,7 +23,7 @@
}"
:outerLoading="loadingStatus">
<div slot="operate" slot-scope="row">
<span class="operate" @click="$router.push({ path: '/data/edit', query: { name: row.name } })">编辑</span>
<span class="operate" @click="$router.push({ path: '/data/edit', query: { name: row.name, columns: row.columns } })">编辑</span>
<span class="operate operate-delete" @click="handleDelete(row)">删除</span>
</div>
</st-table>
......
......@@ -30,7 +30,7 @@
clearable
>
</st-select> -->
<el-select v-model="form.base" placeholder="请选择" style="width: 400px;height: 32px;line-height: 32px">
<el-select v-model="form.base" placeholder="请选择" style="width: 400px;height: 32px;line-height: 32px" @change="handleSelectBase">
<el-option
v-for="item in baseOptions"
:key="item.name"
......@@ -65,12 +65,12 @@
style="width: 100%">
<el-table-column label="字段">
<template slot-scope="scope">
<input type="text" v-model="scope.row.field" @blur="handleBlur" placeholder="请输入">
<input type="text" v-model="scope.row.field" @blur="handleBlur" placeholder="请输入" :disabled="Boolean(scope.row.level)">
</template>
</el-table-column>
<el-table-column label="类型">
<template slot-scope="scope">
<pack-select v-model="scope.row.type" placeholder="请选择" @blur="handleBlur" @visible-change="handleVisibleChange" @change="handleChange(scope.row)">
<pack-select v-model="scope.row.type" placeholder="请选择" @blur="handleBlur" @visible-change="handleVisibleChange" @change="handleChange(scope.row)" :disabled="Boolean(scope.row.level)">
<el-option
v-for="item in typeOptions"
:key="item.value"
......@@ -87,8 +87,8 @@
<span class="upload-btn" v-if="!scope.row.value">Select File</span>
<input type="file" @blur="handleBlur" @change="(event) => handleUpload(event, scope.row)" class="input-btn" v-if="!scope.row.value">
<span v-if="scope.row.value">
<span style="float: left;margin-right: 10px">{{calculateByte(scope.row.value)}}字节</span>
<el-image style="width: 42px; height: 28px;overflow: visible" :src="scope.row.value" fit="fit">
<span style="float: left;margin-right: 10px" @click="scope.row.value = ''">{{calculateByte(scope.row.value)}}字节</span>
<el-image style="width: 42px; height: 28px;overflow: visible" :src="scope.row.value" fit="fit" :preview-src-list="[scope.row.value]">
<div slot="error" style="width: 80px; height: 28px;overflow: visible">(不可预览)</div>
</el-image>
</span>
......@@ -107,7 +107,9 @@
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<span @click="handleDelete(scope.$index)" class="delete-btn">删除</span>
<span @click="handleHidden(scope.row)" class="delete-btn" style="color: #E6A23C" v-if="scope.row.level">隐藏</span>
<span @click="handleReturnBack(scope.row, scope.$index)" style="color: #409EFF" class="delete-btn" v-if="scope.row.level && scope.row.value != originalData[scope.$index].value">撤回</span>
<span @click="handleDelete(scope.$index)" class="delete-btn" v-if="!scope.row.level">删除</span>
</template>
</el-table-column>
</el-table>
......@@ -126,7 +128,7 @@
</template>
<script>
import { createParameter, getTable, getParameter } from '@/axios'
import { createParameter, getTable, getParameter, detailParameter } from '@/axios'
import { fileToBase64 } from '@/utils/typeConversion'
import { calculateByte } from '@/utils/system'
import Dialog from '@/helpers/dialog'
......@@ -151,6 +153,7 @@ export default {
tableOptions: [],
baseOptions: [],
tableData: [],
originalData: [],
flexHeight: 0,
currentRow: ''
}
......@@ -183,8 +186,36 @@ export default {
this.baseOptions = res.data.parameters.datas
}
},
async handleSelectBase(value) {
const res = await detailParameter({ name: value })
if (res && res.data && res.data.code === 0) {
this.tableData = []
const binaryObj = res.data.parameters.binary
const scalarsObj = res.data.parameters.scalars
const tableObj = res.data.parameters.table
for (const key in binaryObj) {
this.tableData.push({ field: key, type: 'blob', value: binaryObj[key], level: 1 })
}
for (const key in scalarsObj) {
this.tableData.push({ field: key, type: typeof scalarsObj[key], value: scalarsObj[key], level: 1 })
}
for (const key in tableObj) {
this.tableData.push({ field: key, type: 'table', value: tableObj[key], level: 1 })
}
this.originalData = JSON.parse(JSON.stringify(this.tableData))
}
},
async save() {
const tableData = this.tableData.filter(item => item.field && item.value)
const tableDataTemp = this.tableData.filter(item => item.field !== '' && item.type !== '' && item.value !== '')
// 最终提交的数据字段名不重复
const temp = []
const tableData = []
for (let i = 0; i < tableDataTemp.length; i++) {
if (!temp.includes(tableDataTemp[i].field)) {
temp.push(tableDataTemp[i].field)
tableData.push(tableDataTemp[i])
}
}
const scalarsArr = tableData.filter(item => item.type === 'string' || item.type === 'number')
const binaryArr = tableData.filter(item => item.type === 'blob')
const tableArr = tableData.filter(item => item.type === 'table')
......@@ -192,7 +223,7 @@ export default {
const binaryObj = {}
const tableObj = {}
for (let i = 0; i < scalarsArr.length; i++) {
scalarsObj[scalarsArr[i].field] = scalarsArr[i].value
scalarsObj[scalarsArr[i].field] = scalarsArr[i].value === null ? null : (scalarsArr[i].type === 'number' ? Number(scalarsArr[i].value) : String(scalarsArr[i].value))
}
for (let j = 0; j < binaryArr.length; j++) {
binaryObj[binaryArr[j].field] = binaryArr[j].value
......@@ -210,11 +241,13 @@ export default {
})
if (res && res.data && res.data.code === 0) {
Toast.success('操作成功')
this.$router.push({ path: '/params' })
// this.$router.push({ path: '/params' })
}
},
cancel() {
this.$router.push({ path: '/params' })
// this.$router.push({ path: '/params' })
this.form = {}
this.tableData = []
},
async handleUpload(event, row) {
row.value = await fileToBase64(event.target.files[0])
......@@ -222,8 +255,17 @@ export default {
insertTableData() {
this.tableData.push({ field: '', type: '', value: '' })
},
handleReturnBack(row, index) {
row.value = JSON.parse(JSON.stringify(this.originalData[index])).value
this.$forceUpdate()
},
handleHidden(row) {
row.value = null
this.$forceUpdate()
},
handleDelete(index) {
this.tableData.splice(index, 1)
this.$forceUpdate()
},
setFlexHeight() {
const ele = document.getElementsByClassName('flex-item') && document.getElementsByClassName('flex-item')[0]
......@@ -242,6 +284,7 @@ export default {
event.target && event.target.classList && event.target.classList.remove('write')
},
cellClick(row, column, cell, event) {
if (row.level && (column.label === '字段' || column.label === '类型')) return
if (cell.getElementsByTagName('input')[0]) {
cell.getElementsByTagName('input')[0].classList.add('write')
cell.getElementsByTagName('input')[0].focus()
......
......@@ -26,20 +26,22 @@
:options="definitions"
:pagination="false"
:data="{
list: tokenList,
list: tableData,
total: total,
}"
:outerLoading="loadingStatus">
<div slot="value" slot-scope="row">
<span v-if="row.type === 'number' || row.type === 'string'">{{row.value}}</span>
<span v-if="row.type === 'blob'" style="line-height: 28px">
<!-- TODO -->
<span style="float: left;margin-right: 10px">{{parseInt(calculateByte(row.value))}}&nbsp;字节</span>
<el-image style="width: 42px; height: 28px;overflow: visible" :src="row.value" fit="fit">
<div slot="error" style="width: 80px; height: 28px;overflow: visible">(不可预览)</div>
</el-image>
<span v-if="row.value === null" class="cell-null">null</span>
<span v-else>
<span v-if="row.type === 'number' || row.type === 'string'">{{row.value}}</span>
<span v-if="row.type === 'blob'" style="line-height: 28px">
<span style="float: left;margin-right: 10px">{{parseInt(calculateByte(row.value))}}&nbsp;字节</span>
<el-image style="width: 42px; height: 28px;overflow: visible" :src="row.value" fit="fit" :preview-src-list="[row.value]">
<div slot="error" style="width: 80px; height: 28px;overflow: visible">(不可预览)</div>
</el-image>
</span>
<span v-if="row.type === 'table'" style="color: #409EFF; cursor: pointer" @click="handleToTableDetail(row.value)">{{row.value}}</span>
</span>
<span v-if="row.type === 'table'" style="color: #409EFF; cursor: pointer" @click="$router.push({ path: '/data/edit', query: { name: row.value } })">{{row.value}}</span>
</div>
</st-table>
</st-form-item>
......@@ -49,7 +51,7 @@
</template>
<script>
import { detailParameter } from '@/axios'
import { detailParameter, getTable } from '@/axios'
import { calculateByte } from '@/utils/system'
export default {
data() {
......@@ -71,7 +73,8 @@ export default {
slotName: 'value'
}
],
tokenList: [],
baseData: [],
tableData: [],
total: 0
}
},
......@@ -79,24 +82,69 @@ export default {
this.loadingStatus = true
const res = await detailParameter({ name: this.$route.query.name })
if (res && res.data && res.data.code === 0) {
let binaryObj = {}
let scalarsObj = {}
let tableObj = {}
let binaryObj1 = {}
let scalarsObj1 = {}
let tableObj1 = {}
if (res.data.base) {
const base = await detailParameter({ name: res.data.base })
if (base && base.data && base.data.code === 0) {
binaryObj1 = base.data.parameters.binary
scalarsObj1 = base.data.parameters.scalars
tableObj1 = base.data.parameters.table
this.baseObj = Object.assign(JSON.parse(JSON.stringify(binaryObj1)), JSON.parse(JSON.stringify(scalarsObj1)), JSON.parse(JSON.stringify(tableObj1)))
for (const key in binaryObj1) {
this.baseData.push({ field: key, type: 'blob', value: binaryObj1[key], level: 1 })
}
for (const key in scalarsObj1) {
this.baseData.push({ field: key, type: typeof scalarsObj1[key], value: scalarsObj1[key], level: 1 })
}
for (const key in tableObj1) {
this.baseData.push({ field: key, type: 'table', value: tableObj1[key], level: 1 })
}
}
}
this.form = res.data
const binaryObj = res.data.parameters.binary
const scalarsObj = res.data.parameters.scalars
const tableObj = res.data.parameters.table
binaryObj = Object.assign(JSON.parse(JSON.stringify(binaryObj1)), res.data.parameters.binary)
scalarsObj = Object.assign(JSON.parse(JSON.stringify(scalarsObj1)), res.data.parameters.scalars)
tableObj = Object.assign(JSON.parse(JSON.stringify(tableObj1)), res.data.parameters.table)
const frontData = []
const endData = []
for (const key in binaryObj) {
this.tokenList.push({ field: key, type: 'blob', value: binaryObj[key] })
if (binaryObj1[key]) {
frontData.push({ field: key, type: 'blob', value: binaryObj[key], level: 1 })
} else {
endData.push({ field: key, type: 'blob', value: binaryObj[key] })
}
}
for (const key in scalarsObj) {
this.tokenList.push({ field: key, type: typeof scalarsObj[key], value: scalarsObj[key] })
if (scalarsObj1[key]) {
frontData.push({ field: key, type: typeof scalarsObj[key], value: scalarsObj[key], level: 1 })
} else {
endData.push({ field: key, type: typeof scalarsObj[key], value: scalarsObj[key] })
}
}
for (const key in tableObj) {
this.tokenList.push({ field: key, type: 'table', value: tableObj[key] })
if (tableObj1[key]) {
frontData.push({ field: key, type: 'table', value: tableObj[key], level: 1 })
} else {
endData.push({ field: key, type: 'table', value: tableObj[key] })
}
}
this.tableData = frontData.concat(endData)
}
this.loadingStatus = false
},
methods: {
calculateByte: base64 => calculateByte(base64),
async handleToTableDetail(name) {
const res = await getTable({ pages: 0, pagesize: 1, name: name })
if (res && res.data && res.data.code === 0) {
this.$router.push({ path: '/data/edit', query: { name: name, columns: res.data.data && res.data.data.tables.length && res.data.data.tables[0].columns } })
}
}
}
}
</script>
......@@ -121,4 +169,12 @@ export default {
::v-deep .cell
height: 28px
line-height: 28px!important
.cell-null
display: inline-block
height: 26px
line-height: 26px
padding: 0 10px
color: #fff
background: #ccc
border-radius: 4px
</style>
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!