应用中心 脚本管理、数据源管理修改与开发
This commit is contained in:
parent
ce3fc2f6ca
commit
aa1b38e226
|
@ -67,6 +67,14 @@ const permission = {
|
||||||
hidden: true
|
hidden: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'scriptAdmin',
|
||||||
|
name: 'scriptAdmin',
|
||||||
|
component: () => import('@/views/applicationList/scriptAdmin'),
|
||||||
|
meta: {
|
||||||
|
hidden: true
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: 'appApiadd',
|
path: 'appApiadd',
|
||||||
name: 'appApiAdd',
|
name: 'appApiAdd',
|
||||||
|
|
|
@ -205,6 +205,11 @@ const settingMenu = [
|
||||||
icon: "appMenu06",
|
icon: "appMenu06",
|
||||||
path: 'inserterAdmin'
|
path: 'inserterAdmin'
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "脚本管理",
|
||||||
|
icon: "appMenu06",
|
||||||
|
path: 'scriptAdmin'
|
||||||
|
},
|
||||||
]
|
]
|
||||||
const configData = {
|
const configData = {
|
||||||
addForm,
|
addForm,
|
||||||
|
|
|
@ -2,230 +2,265 @@ const exploitSettingFormRow = [
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "select",
|
type: 'select',
|
||||||
title: "接入方式",
|
title: '接入方式',
|
||||||
id: "accessMode",
|
id: 'accessMode',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: false,
|
disabled: false,
|
||||||
required: true,
|
required: true,
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
options: [
|
options: [
|
||||||
{
|
{
|
||||||
id: "1",
|
id: '1',
|
||||||
label: "接口",
|
label: '接口'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "2",
|
id: '2',
|
||||||
label: "H5",
|
label: 'H5'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "3",
|
id: '3',
|
||||||
label: "PC网页",
|
label: 'PC网页'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "4",
|
id: '4',
|
||||||
label: "PC应用程序",
|
label: 'PC应用程序'
|
||||||
},
|
}
|
||||||
],
|
],
|
||||||
multiple: true,
|
multiple: true
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "应用客户端地址(pc)",
|
title: '应用客户端地址(pc)',
|
||||||
id: "clientPath",
|
id: 'clientPath',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: false,
|
disabled: false,
|
||||||
required: false,
|
required: false,
|
||||||
fontSize: 16
|
fontSize: 16
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "应用网页端地址(pc)",
|
title: '应用网页端地址(pc)',
|
||||||
id: "webPath",
|
id: 'webPath',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: false,
|
disabled: false,
|
||||||
required: false,
|
required: false,
|
||||||
fontSize: 16
|
fontSize: 16
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "应用程序地址(移动端)",
|
title: '应用程序地址(移动端)',
|
||||||
id: "programPath",
|
id: 'programPath',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: false,
|
disabled: false,
|
||||||
required: false,
|
required: false,
|
||||||
fontSize: 16
|
fontSize: 16
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "ip白名单",
|
title: 'ip白名单',
|
||||||
id: "systemAddress",
|
id: 'systemAddress',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: false,
|
disabled: false,
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
placeholder:"请输入ip白名单并以,分割"
|
placeholder: '请输入ip白名单并以,分割'
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "应用Key",
|
title: '应用Key',
|
||||||
id: "publicKey",
|
id: 'publicKey',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: true,
|
disabled: true,
|
||||||
required: false,
|
required: false,
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
double: true
|
double: true
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "应用密钥",
|
title: '应用密钥',
|
||||||
id: "secretKey",
|
id: 'secretKey',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: true,
|
disabled: true,
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
double: true
|
double: true
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "appId ",
|
title: 'appId ',
|
||||||
id: "appId",
|
id: 'appId',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: true,
|
disabled: true,
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
double: true,
|
double: true,
|
||||||
required: false,
|
required: false
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
}
|
||||||
]
|
]
|
||||||
const apiEnvFormRow = [
|
const apiEnvFormRow = [
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [
|
||||||
{
|
{
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "接口地址",
|
title: '接口地址',
|
||||||
id: "interfaceAddress",
|
id: 'interfaceAddress',
|
||||||
row: 24,
|
row: 24,
|
||||||
disabled: false,
|
disabled: false,
|
||||||
required: false,
|
required: false,
|
||||||
fontSize: 16
|
fontSize: 16
|
||||||
},
|
}
|
||||||
],
|
]
|
||||||
},
|
}
|
||||||
]
|
]
|
||||||
const tableColumn = [
|
const tableColumn = [
|
||||||
{
|
{
|
||||||
id: 'interfaceKey',
|
id: 'interfaceKey',
|
||||||
title: "Key"
|
title: 'Key'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'interfaceValue',
|
id: 'interfaceValue',
|
||||||
title: "Value"
|
title: 'Value'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'interfaceType',
|
id: 'interfaceType',
|
||||||
title: "位置"
|
title: '位置'
|
||||||
},
|
}
|
||||||
]
|
]
|
||||||
const dataSettingFormRow = [
|
const dataSettingFormRow = [
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [{
|
||||||
{
|
title: '数据源编码',
|
||||||
type: "select",
|
id: 'sourceCode',
|
||||||
title: "数据源类型",
|
type: 'input',
|
||||||
id: "sourceType",
|
row: 24,
|
||||||
row: 24,
|
disabled: false,
|
||||||
disabled: false,
|
required: true,
|
||||||
required: true,
|
fontSize: 16
|
||||||
fontSize: 16,
|
}]
|
||||||
options: [
|
|
||||||
{
|
|
||||||
id: "1",
|
|
||||||
label: "oracle "
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "2",
|
|
||||||
label: "sqlServer"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3",
|
|
||||||
label: "mysql"
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [{
|
||||||
{
|
title: '数据源名称',
|
||||||
type: "input",
|
id: 'sourceName',
|
||||||
title: "实例地址",
|
type: 'input',
|
||||||
id: "sourceUrl",
|
row: 24,
|
||||||
row: 24,
|
disabled: false,
|
||||||
disabled: false,
|
required: true,
|
||||||
required: true,
|
fontSize: 16
|
||||||
fontSize: 16
|
|
||||||
},
|
}]
|
||||||
],
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
elCol: [
|
elCol: [{
|
||||||
{
|
title: 'ip',
|
||||||
type: "input",
|
id: 'sourceIp',
|
||||||
title: "账户",
|
type: 'input',
|
||||||
id: "loginName",
|
changeRemind: true,
|
||||||
row: 8,
|
row: 12,
|
||||||
disabled: false,
|
required: true,
|
||||||
required: true,
|
fontSize: 16
|
||||||
fontSize: 16
|
}, {
|
||||||
},
|
title: '端口',
|
||||||
{
|
id: 'sourcePort',
|
||||||
type: "input",
|
type: 'input',
|
||||||
title: "密码",
|
changeRemind: true,
|
||||||
id: "password",
|
row: 12,
|
||||||
row: 8,
|
required: true,
|
||||||
disabled: false,
|
fontSize: 16
|
||||||
required: true,
|
}]
|
||||||
fontSize: 16
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "input",
|
|
||||||
title: "库名",
|
|
||||||
id: "dbName",
|
|
||||||
row: 8,
|
|
||||||
disabled: false,
|
|
||||||
required: true,
|
|
||||||
fontSize: 16
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
elCol: [{
|
||||||
|
title: '数据库名称',
|
||||||
|
id: 'dbName',
|
||||||
|
type: 'input',
|
||||||
|
changeRemind: true,
|
||||||
|
row: 12,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16
|
||||||
|
}, {
|
||||||
|
title: '数据源类型',
|
||||||
|
id: 'sourceType',
|
||||||
|
type: 'select',
|
||||||
|
changeRemind: true,
|
||||||
|
row: 12,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16,
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
id: '1',
|
||||||
|
label: 'oracle'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
label: 'sqlsever'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3',
|
||||||
|
label: 'mysql'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
elCol: [{
|
||||||
|
title: '登录名',
|
||||||
|
id: 'loginName',
|
||||||
|
type: 'input',
|
||||||
|
changeRemind: true,
|
||||||
|
row: 12,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16
|
||||||
|
}, {
|
||||||
|
title: '密码',
|
||||||
|
id: 'password',
|
||||||
|
type: 'input',
|
||||||
|
changeRemind: true,
|
||||||
|
row: 12,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
elCol: [{
|
||||||
|
title: '服务名称',
|
||||||
|
id: 'serviceName',
|
||||||
|
type: 'input',
|
||||||
|
show: false,
|
||||||
|
changeRemind: true,
|
||||||
|
row: 12,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16
|
||||||
|
},]
|
||||||
|
}
|
||||||
]
|
]
|
||||||
const config = {
|
const config = {
|
||||||
exploitSettingFormRow,
|
exploitSettingFormRow,
|
||||||
|
|
|
@ -111,7 +111,7 @@
|
||||||
@click="testHandle"
|
@click="testHandle"
|
||||||
:type="testResult ? 'success' : 'primary'"
|
:type="testResult ? 'success' : 'primary'"
|
||||||
style="margin-right: 10px"
|
style="margin-right: 10px"
|
||||||
>{{ testResult ? "测试通过" : "点击测试" }}
|
>{{ testResult ? '测试通过' : '点击测试' }}
|
||||||
<i v-if="testResult" class="el-icon-check el-icon--right"></i>
|
<i v-if="testResult" class="el-icon-check el-icon--right"></i>
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-switch
|
<el-switch
|
||||||
|
@ -128,7 +128,7 @@
|
||||||
<div class="form">
|
<div class="form">
|
||||||
<baseNewForm
|
<baseNewForm
|
||||||
ref="dataSettingForm"
|
ref="dataSettingForm"
|
||||||
:spanNumber="24"
|
:spanNumber="12"
|
||||||
:isFunBtn="false"
|
:isFunBtn="false"
|
||||||
:lookFlag="lookFlag"
|
:lookFlag="lookFlag"
|
||||||
:formRule="!lookFlag"
|
:formRule="!lookFlag"
|
||||||
|
@ -137,6 +137,7 @@
|
||||||
@onSubmit="dataSettingOnSubmit"
|
@onSubmit="dataSettingOnSubmit"
|
||||||
@onSelect="dataSettingFormChange"
|
@onSelect="dataSettingFormChange"
|
||||||
@onInput="dataSettingFormChange"
|
@onInput="dataSettingFormChange"
|
||||||
|
@changeRemind="dataSettingFormChange"
|
||||||
></baseNewForm>
|
></baseNewForm>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -145,10 +146,10 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import BaseTable from "@/views/intergrationTask/compoments/baseTable.vue";
|
import BaseTable from '@/views/intergrationTask/compoments/baseTable.vue'
|
||||||
import configData from "./configData";
|
import configData from './configData'
|
||||||
import {getApiModuleApi} from "@/api/apiChunks/index.js";
|
import { getApiModuleApi } from '@/api/apiChunks/index.js'
|
||||||
import baseNewForm from "@/views/intergrationTask/compoments/baseNewForm";
|
import baseNewForm from '@/views/intergrationTask/compoments/baseNewForm'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
|
@ -158,7 +159,7 @@ export default {
|
||||||
// 文件list
|
// 文件list
|
||||||
fileList: [],
|
fileList: [],
|
||||||
// 头像转base
|
// 头像转base
|
||||||
iconBase64: "",
|
iconBase64: '',
|
||||||
// 状态
|
// 状态
|
||||||
lookFlag: false,
|
lookFlag: false,
|
||||||
// 开发设置表单
|
// 开发设置表单
|
||||||
|
@ -168,14 +169,14 @@ export default {
|
||||||
},
|
},
|
||||||
// 接口环境
|
// 接口环境
|
||||||
apiEnvFormRow: configData.apiEnvFormRow,
|
apiEnvFormRow: configData.apiEnvFormRow,
|
||||||
apiEnvRuleForm: {interfaceAddress: ""},
|
apiEnvRuleForm: { interfaceAddress: '' },
|
||||||
tableData: [],
|
tableData: [],
|
||||||
tableColumn: configData.tableColumn,
|
tableColumn: configData.tableColumn,
|
||||||
funData: [
|
funData: [
|
||||||
{
|
{
|
||||||
text: "删除",
|
text: '删除',
|
||||||
color: "#e47470",
|
color: '#e47470'
|
||||||
},
|
}
|
||||||
],
|
],
|
||||||
apiEnvOpen: 2,
|
apiEnvOpen: 2,
|
||||||
// 数据源
|
// 数据源
|
||||||
|
@ -183,13 +184,13 @@ export default {
|
||||||
dataSettingRuleForm: {},
|
dataSettingRuleForm: {},
|
||||||
locationOptions: [
|
locationOptions: [
|
||||||
{
|
{
|
||||||
value: "1",
|
value: '1',
|
||||||
label: "Header",
|
label: 'Header'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value: "2",
|
value: '2',
|
||||||
label: "Body",
|
label: 'Body'
|
||||||
},
|
}
|
||||||
],
|
],
|
||||||
testResult: false,
|
testResult: false,
|
||||||
// 测试loading
|
// 测试loading
|
||||||
|
@ -197,58 +198,66 @@ export default {
|
||||||
// 接口环境开关
|
// 接口环境开关
|
||||||
interfaceStatus: 2,
|
interfaceStatus: 2,
|
||||||
// 接口环境开关
|
// 接口环境开关
|
||||||
dbStatus: 2,
|
dbStatus: 2
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
//双击复制
|
//双击复制
|
||||||
dblclick(val) {
|
dblclick(val) {
|
||||||
navigator.clipboard.writeText(val)
|
navigator.clipboard.writeText(val)
|
||||||
this.$vmNews("内容已复制到剪贴板", 'success')
|
this.$vmNews('内容已复制到剪贴板', 'success')
|
||||||
},
|
},
|
||||||
// 数据源测试改变事件
|
// 数据源测试改变事件
|
||||||
dataSettingFormChange() {
|
dataSettingFormChange(val, index, indexRow, row = {}) {
|
||||||
this.testResult = false;
|
this.testResult = false
|
||||||
this.dbStatus = 2;
|
this.dbStatus = 2
|
||||||
|
if (row.id === 'sourceType') {
|
||||||
|
if (val == 1) {
|
||||||
|
this.dataSettingFormRow[5].elCol[0].show = true
|
||||||
|
} else {
|
||||||
|
this.dataSettingFormRow[5].elCol[0].show = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
// 开关点击事件(需要测试才可以点)
|
// 开关点击事件(需要测试才可以点)
|
||||||
switchCLick() {
|
switchCLick() {
|
||||||
if (!this.testResult) {
|
if (!this.testResult) {
|
||||||
this.$vmNews("请测试通过后再开启", "warning");
|
this.$vmNews('请测试通过后再开启', 'warning')
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 删除行
|
// 删除行
|
||||||
tableButtonHandle(index, row) {
|
tableButtonHandle(index, row) {
|
||||||
this.tableData.splice(index.index, 1);
|
this.tableData.splice(index.index, 1)
|
||||||
},
|
},
|
||||||
// 新增行
|
// 新增行
|
||||||
newRow() {
|
newRow() {
|
||||||
this.tableData.push({interfaceType: "1"});
|
this.tableData.push({ interfaceType: '1' })
|
||||||
},
|
},
|
||||||
// 测试按钮
|
// 测试按钮
|
||||||
testHandle() {
|
testHandle() {
|
||||||
this.$refs.dataSettingForm.submitForm();
|
this.$refs.dataSettingForm.submitForm()
|
||||||
},
|
},
|
||||||
//点击保存后验证
|
//点击保存后验证
|
||||||
saveHandle() {
|
saveHandle() {
|
||||||
let pattern = /^http(s)?:\/\/?[\w.-]+(?:\.[\w\.-]+)+[\w\-\._~:/?#[\]@!\$&'\*\+,;=.]+$/
|
let pattern = /^http(s)?:\/\/?[\w.-]+(?:\.[\w\.-]+)+[\w\-\._~:/?#[\]@!\$&'\*\+,;=.]+$/
|
||||||
if (this.apiEnvRuleForm.interfaceAddress && !pattern.test(this.apiEnvRuleForm.interfaceAddress)) {
|
if (this.apiEnvRuleForm.interfaceAddress && !pattern.test(this.apiEnvRuleForm.interfaceAddress)) {
|
||||||
this.$vmNews("接口地址不合法,请重新输入!", "warning")
|
this.$vmNews('接口地址不合法,请重新输入!', 'warning')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (this.interfaceStatus != 2) {
|
if (this.interfaceStatus != 2) {
|
||||||
if (!this.apiEnvRuleForm.interfaceAddress) {
|
if (!this.apiEnvRuleForm.interfaceAddress) {
|
||||||
this.$vmNews("接口环境开启时,接口地址不能为空!", "warning");
|
this.$vmNews('接口环境开启时,接口地址不能为空!', 'warning')
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
let flag = this.tableData.some((item, index) => {
|
let flag = this.tableData.some((item, index) => {
|
||||||
if (item.interfaceKey == "" || !item.interfaceKey) {
|
if (item.interfaceKey == '' || !item.interfaceKey) {
|
||||||
this.$vmNews(`接口环境开启时,接口环境第${index + 1}行Key不能为空!`)
|
this.$vmNews(`接口环境开启时,接口环境第${index + 1}行Key不能为空!`)
|
||||||
return true
|
return true
|
||||||
} else if (item.interfaceValue == "" || !item.interfaceValue) {
|
} else if (item.interfaceValue == '' || !item.interfaceValue) {
|
||||||
this.$vmNews(`接口环境开启时,接口环境第${index + 1}行Value不能为空!`)
|
this.$vmNews(`接口环境开启时,接口环境第${index + 1}行Value不能为空!`)
|
||||||
return true
|
return true
|
||||||
} else if (item.interfaceType == "" || !item.interfaceType) {
|
} else if (item.interfaceType == '' || !item.interfaceType) {
|
||||||
this.$vmNews(`接口环境开启时,接口环境第${index + 1}行位置不能为空!`)
|
this.$vmNews(`接口环境开启时,接口环境第${index + 1}行位置不能为空!`)
|
||||||
return true
|
return true
|
||||||
} else {
|
} else {
|
||||||
|
@ -259,26 +268,28 @@ export default {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.$refs.exploitSettingForm.submitForm();
|
this.$refs.exploitSettingForm.submitForm()
|
||||||
},
|
},
|
||||||
async dataSettingOnSubmit() {
|
async dataSettingOnSubmit() {
|
||||||
this.testLoading = true;
|
this.testLoading = true
|
||||||
//测试成功
|
//测试成功
|
||||||
// this.testResult = true;
|
// this.testResult = true;
|
||||||
try {
|
try {
|
||||||
const res = await getApiModuleApi({
|
const res = await getApiModuleApi({
|
||||||
tl: "sysApplicationService",
|
tl: 'sysApplicationService',
|
||||||
as: "application",
|
as: 'application',
|
||||||
dj: "testDatabase"
|
dj: 'testDatabase'
|
||||||
}, {...this.dataSettingRuleForm})
|
}, { ...this.dataSettingRuleForm })
|
||||||
if (res.status === '200' && res.flag) {
|
if (res.status === '200' && res.attribute) {
|
||||||
this.testResult = true;
|
this.testResult = true
|
||||||
this.$vmNews("测试通过开关已开启", "success")
|
this.$vmNews('测试通过开关已开启', 'success')
|
||||||
|
} else {
|
||||||
|
this.$vmNews(res.msg)
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
this.testResult = false
|
this.testResult = false
|
||||||
}
|
}
|
||||||
this.testLoading = false;
|
this.testLoading = false
|
||||||
},
|
},
|
||||||
// 验证成功
|
// 验证成功
|
||||||
async exploitSettingOnSubmit() {
|
async exploitSettingOnSubmit() {
|
||||||
|
@ -305,31 +316,32 @@ export default {
|
||||||
...this.apiEnvRuleForm,
|
...this.apiEnvRuleForm,
|
||||||
apiParas: this.tableData,
|
apiParas: this.tableData,
|
||||||
databaseEntity: {
|
databaseEntity: {
|
||||||
...this.dataSettingRuleForm,
|
...this.dataSettingRuleForm
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const res = await getApiModuleApi({
|
const res = await getApiModuleApi({
|
||||||
tl: "sysApplicationService",
|
tl: 'sysApplicationService',
|
||||||
as: "application",
|
as: 'application',
|
||||||
dj: "updateApp"
|
dj: 'updateApp'
|
||||||
}, {...obj})
|
}, { ...obj })
|
||||||
if (res.status === '200') {
|
if (res.status === '200') {
|
||||||
this.$vmNews("保存成功", "success")
|
this.$vmNews('保存成功', 'success')
|
||||||
this.initDataInfo()
|
this.initDataInfo()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async initDataInfo() {
|
async initDataInfo() {
|
||||||
const res = await getApiModuleApi({
|
const res = await getApiModuleApi({
|
||||||
tl: 'sysApplicationService',
|
tl: 'sysApplicationService',
|
||||||
as: "application",
|
as: 'application',
|
||||||
dj: "queryAppAll"
|
dj: 'queryAppAll'
|
||||||
}, {id: this.$route.query.id})
|
}, { id: this.$route.query.id })
|
||||||
if (res.status === '200') {
|
if (res.status === '200') {
|
||||||
if (res.attribute.databaseEntity) {
|
if (res.attribute.databaseEntity) {
|
||||||
this.dataSettingRuleForm = res.attribute.databaseEntity;
|
this.dataSettingRuleForm = res.attribute.databaseEntity
|
||||||
|
console.log(this.dataSettingRuleForm, 'this.dataSettingRuleForm')
|
||||||
console.log('数据源设置id:' + res.attribute.databaseEntity.id)
|
console.log('数据源设置id:' + res.attribute.databaseEntity.id)
|
||||||
}
|
}
|
||||||
this.tableData = res.attribute.apiParas;
|
this.tableData = res.attribute.apiParas
|
||||||
this.apiEnvRuleForm.interfaceAddress = res.attribute.app.interfaceAddress
|
this.apiEnvRuleForm.interfaceAddress = res.attribute.app.interfaceAddress
|
||||||
this.dbStatus = res.attribute.app.dbStatus
|
this.dbStatus = res.attribute.app.dbStatus
|
||||||
if (this.dbStatus == 1) {
|
if (this.dbStatus == 1) {
|
||||||
|
@ -344,18 +356,18 @@ export default {
|
||||||
publicKey: res.attribute.app.publicKey,
|
publicKey: res.attribute.app.publicKey,
|
||||||
secretKey: res.attribute.app.secretKey,
|
secretKey: res.attribute.app.secretKey,
|
||||||
appId: res.attribute.app.appId,
|
appId: res.attribute.app.appId,
|
||||||
systemAddress: res.attribute.app.systemAddress,
|
systemAddress: res.attribute.app.systemAddress
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
baseNewForm,
|
baseNewForm,
|
||||||
BaseTable,
|
BaseTable
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.initDataInfo()
|
this.initDataInfo()
|
||||||
this.$emit("flashActive", 1)
|
this.$emit('flashActive', 1)
|
||||||
// if (this.$route.query.id) {
|
// if (this.$route.query.id) {
|
||||||
// this.lookFlag = true;
|
// this.lookFlag = true;
|
||||||
// } else {
|
// } else {
|
||||||
|
@ -370,8 +382,8 @@ export default {
|
||||||
// this.dbStatus = 2;
|
// this.dbStatus = 2;
|
||||||
// },
|
// },
|
||||||
// },
|
// },
|
||||||
},
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
|
@ -0,0 +1,140 @@
|
||||||
|
const formRow = [
|
||||||
|
{
|
||||||
|
elCol: [
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
title: '脚本名称',
|
||||||
|
id: 'scriptName',
|
||||||
|
row: 24,
|
||||||
|
disabled: false,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
elCol: [
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
title: '脚本编号',
|
||||||
|
id: 'scriptCode',
|
||||||
|
row: 24,
|
||||||
|
disabled: false,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
elCol: [
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
title: '脚本版本',
|
||||||
|
id: 'scriptVersion',
|
||||||
|
row: 24,
|
||||||
|
disabled: false,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
elCol: [
|
||||||
|
{
|
||||||
|
type: 'datepick',
|
||||||
|
title: '发布日期',
|
||||||
|
id: 'releaseDate',
|
||||||
|
row: 24,
|
||||||
|
disabled: false,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
elCol: [
|
||||||
|
{
|
||||||
|
type: 'textrea',
|
||||||
|
title: '脚本内容',
|
||||||
|
id: 'scriptData',
|
||||||
|
row: 24,
|
||||||
|
disabled: false,
|
||||||
|
required: false,
|
||||||
|
fontSize: 16
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
elCol: [
|
||||||
|
{
|
||||||
|
type: 'textrea',
|
||||||
|
title: '描述',
|
||||||
|
id: 'scriptRemark',
|
||||||
|
row: 24,
|
||||||
|
disabled: false,
|
||||||
|
required: false,
|
||||||
|
fontSize: 16
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
elCol: [
|
||||||
|
{
|
||||||
|
type: 'radio',
|
||||||
|
title: '是否启用',
|
||||||
|
id: 'scriptStatus',
|
||||||
|
row: 24,
|
||||||
|
disabled: false,
|
||||||
|
required: true,
|
||||||
|
fontSize: 16,
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: '启用',
|
||||||
|
id: '1'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '停用',
|
||||||
|
id: '2'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
const tableColumn = [
|
||||||
|
{
|
||||||
|
id: 'pluginName',
|
||||||
|
title: '插件名称'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'pluginCode',
|
||||||
|
title: '插件编号'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'pluginVersion',
|
||||||
|
title: '插件版本'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'pluginRemark',
|
||||||
|
title: '描述',
|
||||||
|
tooltip: true,
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'releaseDate',
|
||||||
|
title: '发布日期',
|
||||||
|
tooltip: true,
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'modify_time',
|
||||||
|
title: '更新日期',
|
||||||
|
tooltip: true
|
||||||
|
}
|
||||||
|
]
|
||||||
|
const configData = {
|
||||||
|
formRow,
|
||||||
|
tableColumn
|
||||||
|
}
|
||||||
|
export default configData
|
|
@ -0,0 +1,336 @@
|
||||||
|
<template>
|
||||||
|
<div class="monitoring">
|
||||||
|
<header>
|
||||||
|
<div class="left">
|
||||||
|
<el-input
|
||||||
|
placeholder="脚本"
|
||||||
|
v-model="searchForm.scriptName"
|
||||||
|
@change="searchBtnHandle"
|
||||||
|
>
|
||||||
|
<i slot="suffix" class="el-input__icon el-icon-search" @click="searchBtnHandle"></i>
|
||||||
|
</el-input>
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<el-button
|
||||||
|
icon="el-icon-back"
|
||||||
|
@click="
|
||||||
|
$router.replace({ path: '/applicationList/applicationListAdmin' })
|
||||||
|
"
|
||||||
|
>返回
|
||||||
|
</el-button
|
||||||
|
>
|
||||||
|
<el-button type="primary" icon="el-icon-plus" @click="inserterAdd"
|
||||||
|
>添加脚本
|
||||||
|
</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main>
|
||||||
|
<BaseTable
|
||||||
|
ref="mainTable"
|
||||||
|
:tableData="tableData"
|
||||||
|
:tableColumn="tableColumn"
|
||||||
|
:funData="funData"
|
||||||
|
:funWidth="funWidth"
|
||||||
|
:showIndex="true"
|
||||||
|
:tabLoading="mainTabLoading"
|
||||||
|
@onFunc="tableButtonHandle"
|
||||||
|
:tableHeight="'70vh'"
|
||||||
|
:border="false"
|
||||||
|
>
|
||||||
|
<template #scriptStatus="{row}">
|
||||||
|
{{ row.scriptStatus == 1 ? '启用' : '停用' }}
|
||||||
|
</template>
|
||||||
|
<!-- 启用/停用-->
|
||||||
|
<template #scriptStatus="{row}">
|
||||||
|
<el-switch
|
||||||
|
v-model="row.scriptStatus"
|
||||||
|
active-value="1"
|
||||||
|
inactive-value="0"
|
||||||
|
@change="(val)=>{swithChangeHandle(val,row)}"
|
||||||
|
>
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
</BaseTable>
|
||||||
|
<div class="page">
|
||||||
|
<basePage
|
||||||
|
:pageModel="pageModel"
|
||||||
|
@update:pageModel="currentChangeHandle"
|
||||||
|
></basePage>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
<footer></footer>
|
||||||
|
<baseDialog
|
||||||
|
:title="'插件配置'"
|
||||||
|
v-model="plugInDialog"
|
||||||
|
@confirm="plugInConfirm"
|
||||||
|
:width="'50%'"
|
||||||
|
>
|
||||||
|
<div v-if="plugInDialog">
|
||||||
|
<baseNewForm
|
||||||
|
ref="dataSettingForm"
|
||||||
|
:spanNumber="24"
|
||||||
|
:isFunBtn="false"
|
||||||
|
:lookFlag="lookFlag"
|
||||||
|
:formRule="!lookFlag"
|
||||||
|
:formRow="formRow"
|
||||||
|
:ruleForm="ruleForm"
|
||||||
|
@onSubmit="onSubmit"
|
||||||
|
></baseNewForm>
|
||||||
|
</div>
|
||||||
|
</baseDialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { deepClone } from '@/utils/index.js'
|
||||||
|
import baseNewForm from '@/views/intergrationTask/compoments/baseNewForm'
|
||||||
|
import baseDialog from '@/views/integrationOption/compoments/baseDialog'
|
||||||
|
import configData from './configData.js'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
import BaseTable from '@/views/intergrationTask/compoments/baseTable.vue'
|
||||||
|
import basePage from '@/views/intergrationTask/compoments/basePage.vue'
|
||||||
|
import { getApiModuleApi } from '@/api/apiChunks/index.js'
|
||||||
|
import { authApi } from '@/api/apis/auth'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
ruleForm: { pluginStatus: '1' },
|
||||||
|
formRow: configData.formRow,
|
||||||
|
lookFlag: false,
|
||||||
|
plugInDialog: false,
|
||||||
|
refreshLoading: false,
|
||||||
|
searchForm: {
|
||||||
|
name: ''
|
||||||
|
},
|
||||||
|
mainTabLoading: false,
|
||||||
|
funData: [
|
||||||
|
{
|
||||||
|
type: 'view',
|
||||||
|
text: '更新',
|
||||||
|
color: '#5a9cf8'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'dele',
|
||||||
|
text: '删除',
|
||||||
|
color: '#e47470'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
tableColumn: [
|
||||||
|
{
|
||||||
|
id: 'scriptName',
|
||||||
|
title: '脚本名称',
|
||||||
|
tooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'scriptCode',
|
||||||
|
title: '脚本编号',
|
||||||
|
tooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'scriptVersion',
|
||||||
|
title: '脚本版本',
|
||||||
|
tooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'scriptRemark',
|
||||||
|
title: '描述',
|
||||||
|
tooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'releaseDate',
|
||||||
|
title: '发布日期',
|
||||||
|
tooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'scriptStatus',
|
||||||
|
title: '启用状态',
|
||||||
|
tooltip: true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
tableData: [],
|
||||||
|
pageModel: {
|
||||||
|
pageIndex: 1,
|
||||||
|
total: 10,
|
||||||
|
limit: 10
|
||||||
|
},
|
||||||
|
editFlag: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
//启用停用
|
||||||
|
async swithChangeHandle(val, row) {
|
||||||
|
const res = await authApi('sysApplicationService', '', 'enableOrDisableAppScript', '', {
|
||||||
|
id: row.id,
|
||||||
|
scriptStatus: row.scriptStatus
|
||||||
|
})
|
||||||
|
this.$vmNews(res.msg, 'success')
|
||||||
|
console.log(res, 'res')
|
||||||
|
this.initMainTableData(this.searchForm)
|
||||||
|
},
|
||||||
|
searchBtnHandle() {
|
||||||
|
this.initMainTableData(this.searchForm)
|
||||||
|
},
|
||||||
|
async onSubmit() {
|
||||||
|
if (!this.ruleForm.id) {
|
||||||
|
const res = await getApiModuleApi({
|
||||||
|
tl: 'sysApplicationService',
|
||||||
|
as: '',
|
||||||
|
dj: 'saveAppScript'
|
||||||
|
}, { appId: this.$route.query.id, ...this.ruleForm })
|
||||||
|
if (res.status === '200') {
|
||||||
|
this.$vmNews('提交成功', 'success')
|
||||||
|
this.plugInDialog = false
|
||||||
|
this.ruleForm = {}
|
||||||
|
this.initMainTableData()
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
const res = await getApiModuleApi({
|
||||||
|
tl: 'sysApplicationService',
|
||||||
|
as: '',
|
||||||
|
dj: 'updateAppScript'
|
||||||
|
}, { appId: this.$route.query.id, ...this.ruleForm })
|
||||||
|
if (res.status === '200') {
|
||||||
|
this.$vmNews('提交成功', 'success')
|
||||||
|
this.plugInDialog = false
|
||||||
|
this.ruleForm = {}
|
||||||
|
this.initMainTableData()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
plugInConfirm() {
|
||||||
|
this.$refs.dataSettingForm.submitForm()
|
||||||
|
},
|
||||||
|
// 添加应用
|
||||||
|
inserterAdd() {
|
||||||
|
this.plugInDialog = true
|
||||||
|
// this.$router.push({ path: "/inserterAdmin/inserterAdd" });
|
||||||
|
},
|
||||||
|
// 时间处理
|
||||||
|
getTimeHandler(time) {
|
||||||
|
var days = parseInt(time / (1000 * 60 * 60 * 24))
|
||||||
|
var hours = parseInt((time % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))
|
||||||
|
var minutes = parseInt((time % (1000 * 60 * 60)) / (1000 * 60))
|
||||||
|
var seconds = (time % (1000 * 60)) / 1000
|
||||||
|
return days + '天' + hours + '小时' + minutes + '分钟' + seconds + '秒'
|
||||||
|
},
|
||||||
|
// 初始化表单
|
||||||
|
async initMainTableData(obj = {}) {
|
||||||
|
this.refreshLoading = true
|
||||||
|
this.openLoading('detail')
|
||||||
|
const res = await getApiModuleApi(
|
||||||
|
{
|
||||||
|
tl: 'sysApplicationService',
|
||||||
|
as: '',
|
||||||
|
dj: 'queryAppScriptPage'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
pageNum: this.pageModel.pageIndex,
|
||||||
|
pageSize: this.pageModel.limit,
|
||||||
|
...obj,
|
||||||
|
appId: this.$route.query.id
|
||||||
|
}
|
||||||
|
)
|
||||||
|
this.refreshLoading = false
|
||||||
|
if (res.status == 200) {
|
||||||
|
this.tableData = res.attribute.list
|
||||||
|
this.pageModel.total = res.attribute.total
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 点击提交
|
||||||
|
submitsearchForm() {
|
||||||
|
this.initMainTableData(this.searchForm)
|
||||||
|
},
|
||||||
|
// 表单操作
|
||||||
|
tableButtonHandle(val, item) {
|
||||||
|
if (item.type === 'view') {
|
||||||
|
this.ruleForm = deepClone(val)
|
||||||
|
this.plugInDialog = true
|
||||||
|
} else if (item.type === 'dele') {
|
||||||
|
this.$confirm('确认删除?')
|
||||||
|
.then(async() => {
|
||||||
|
this.openLoading('submit')
|
||||||
|
const res = await getApiModuleApi({
|
||||||
|
tl: 'sysApplicationService',
|
||||||
|
as: '',
|
||||||
|
dj: 'deleteAppScript'
|
||||||
|
}, { id: val.id })
|
||||||
|
if (res.status === '200') {
|
||||||
|
this.$vmNews('删除脚本成功', 'success')
|
||||||
|
this.initMainTableData(this.searchForm)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 页码
|
||||||
|
currentChangeHandle(pageModel) {
|
||||||
|
this.pageModel = pageModel
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.initMainTableData(this.searchForm)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
// 操作框的宽度
|
||||||
|
funWidth() {
|
||||||
|
return this.funData.length * 70
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
BaseTable,
|
||||||
|
basePage,
|
||||||
|
baseDialog,
|
||||||
|
baseNewForm
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.initMainTableData()
|
||||||
|
this.$emit('flashActive', 6)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.monitoring {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #fafafa;
|
||||||
|
|
||||||
|
header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 20px;
|
||||||
|
|
||||||
|
.left {
|
||||||
|
width: 20vw;
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.search {
|
||||||
|
margin-left: 30px;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
> .chunk {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
margin-top: 10px;
|
||||||
|
padding: 20px 20px 5px;
|
||||||
|
border-radius: 20px;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,206 @@
|
||||||
|
<template>
|
||||||
|
<div class="wrap">
|
||||||
|
<div class="btn">
|
||||||
|
<div class="chunk">
|
||||||
|
<el-button icon="el-icon-close" @click="$router.back()">取消</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="chunk">
|
||||||
|
<el-button
|
||||||
|
icon="el-icon-first-aid-kit
|
||||||
|
"
|
||||||
|
type="primary"
|
||||||
|
>保存</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main">
|
||||||
|
<div class="upload">
|
||||||
|
<div class="title">插件信息</div>
|
||||||
|
<div class="uploadMain">
|
||||||
|
<div class="left">
|
||||||
|
<div class="title">插件上传</div>
|
||||||
|
<el-upload
|
||||||
|
class="upload-demo"
|
||||||
|
action="https://jsonplaceholder.typicode.com/posts/"
|
||||||
|
:on-preview="handlePreview"
|
||||||
|
:on-remove="handleRemove"
|
||||||
|
:before-upload="beforeUpload"
|
||||||
|
:file-list="fileList"
|
||||||
|
list-type="picture"
|
||||||
|
:limit="1"
|
||||||
|
:disabled="lookFlag"
|
||||||
|
>
|
||||||
|
<div class="line">
|
||||||
|
<div class="left">
|
||||||
|
<el-image
|
||||||
|
style="width: 64px; height: 64px"
|
||||||
|
:src="iconBase64"
|
||||||
|
fit="cover"
|
||||||
|
alt="点击上传"
|
||||||
|
>
|
||||||
|
<template v-slot:error>
|
||||||
|
<div style="line-height: 64px; font-size: 12px">
|
||||||
|
logo上传
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-image>
|
||||||
|
</div>
|
||||||
|
<div class="right" v-if="!lookFlag">
|
||||||
|
<el-button size="small" type="primary">点击上传</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div slot="tip" class="el-upload__tip" v-if="!lookFlag">
|
||||||
|
只能上传jpg/png文件,且不超过2MB
|
||||||
|
</div>
|
||||||
|
</el-upload>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form">
|
||||||
|
<baseNewForm
|
||||||
|
ref="mainForm"
|
||||||
|
:spanNumber="24"
|
||||||
|
:isFunBtn="false"
|
||||||
|
:lookFlag="lookFlag"
|
||||||
|
:formRule="!lookFlag"
|
||||||
|
:formRow="formRow"
|
||||||
|
></baseNewForm>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import configData from "./configData";
|
||||||
|
import baseNewForm from "@/views/intergrationTask/compoments/baseNewForm";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
fileList: [],
|
||||||
|
iconBase64: "",
|
||||||
|
value1: true,
|
||||||
|
ruleForm: {},
|
||||||
|
lookFlag: false,
|
||||||
|
formRow: configData.addForm,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleRemove(file, fileList) {
|
||||||
|
console.log(file, fileList, "123");
|
||||||
|
},
|
||||||
|
handlePreview(file) {
|
||||||
|
console.log(file, this.fileList, "12333");
|
||||||
|
},
|
||||||
|
beforeUpload(file) {
|
||||||
|
console.log(file);
|
||||||
|
if (
|
||||||
|
file.type.split("/")[1] != "jpeg" &&
|
||||||
|
file.type.split("/")[1] != "png"
|
||||||
|
) {
|
||||||
|
this.$message({
|
||||||
|
type: "warning",
|
||||||
|
message: "只能上传jpg/png文件",
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
if (file.size >= 2000000) {
|
||||||
|
this.$message({
|
||||||
|
type: "warning",
|
||||||
|
message: "文件大小不超过2MB",
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
let reader = new FileReader();
|
||||||
|
let that = this;
|
||||||
|
console.log(this, 111);
|
||||||
|
reader.onloadend = function () {
|
||||||
|
// 将文件转换成base64字符串
|
||||||
|
var base64String = reader.result;
|
||||||
|
that.iconBase64 = base64String;
|
||||||
|
console.log(that.iconBase64);
|
||||||
|
};
|
||||||
|
reader.readAsDataURL(file);
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
baseNewForm,
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
if (this.$route.query.id) {
|
||||||
|
this.lookFlag = true;
|
||||||
|
} else {
|
||||||
|
this.lookFlag = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
::v-deep .el-button {
|
||||||
|
border-radius: 16px;
|
||||||
|
}
|
||||||
|
::v-deep .el-form-item {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
.wrap {
|
||||||
|
background-color: #fbfbfb;
|
||||||
|
width: 100%;
|
||||||
|
padding: 10px;
|
||||||
|
overflow: auto;
|
||||||
|
> .btn {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
> .chunk {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .main {
|
||||||
|
margin-top: 10px;
|
||||||
|
> .upload {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 15px;
|
||||||
|
> .title {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
> .uploadMain {
|
||||||
|
margin-top: 20px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
> .left {
|
||||||
|
> .title {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #999999;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.line {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.left {
|
||||||
|
border: 1px dashed #999999;
|
||||||
|
width: 64px;
|
||||||
|
height: 64px;
|
||||||
|
> img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.right {
|
||||||
|
margin-left: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .form {
|
||||||
|
margin-top: 10px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -89,7 +89,7 @@
|
||||||
:disabled="row.disabled && !newFlag ? row.disabled : false"
|
:disabled="row.disabled && !newFlag ? row.disabled : false"
|
||||||
:precision="row.precisionNum ? row.precisionNum : 0"
|
:precision="row.precisionNum ? row.precisionNum : 0"
|
||||||
:step="row.stepNum ? row.stepNum : 1"
|
:step="row.stepNum ? row.stepNum : 1"
|
||||||
@change="handleChange"
|
@change="row.changeRemind?changeRemind(row):''"
|
||||||
@input="(val) => limitPhoneNum(val, ruleForm, row.id)"
|
@input="(val) => limitPhoneNum(val, ruleForm, row.id)"
|
||||||
:maxlength="row.maxlength ? row.maxlength * 1 : 50"
|
:maxlength="row.maxlength ? row.maxlength * 1 : 50"
|
||||||
:min="1"
|
:min="1"
|
||||||
|
@ -488,6 +488,9 @@ export default {
|
||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
methods: {
|
methods: {
|
||||||
|
changeRemind() {
|
||||||
|
this.$emit('changeRemind', this.ruleForm)
|
||||||
|
},
|
||||||
showValueHandle() {
|
showValueHandle() {
|
||||||
},
|
},
|
||||||
limitPhoneNum(value, data, id) {
|
limitPhoneNum(value, data, id) {
|
||||||
|
|
Loading…
Reference in New Issue