feat(应用市场): 三方应用对接

This commit is contained in:
wangjiahao 2022-10-26 19:39:20 +08:00
parent 9623343d4b
commit 2b67bec9ab
12 changed files with 125 additions and 91 deletions

View File

@ -336,10 +336,9 @@ export function editApply(data) {
}) })
} }
export function findOneWithParent(panelId) { export function findOneWithParent(panelId) {
return request({ return request({
url: 'panel/group/findOneWithParent/'+panelId, url: 'panel/group/findOneWithParent/' + panelId,
method: 'get', method: 'get',
loading: false loading: false
}) })

View File

@ -42,7 +42,7 @@ export default {
return backPath || backName || backTo return backPath || backName || backTo
}, },
needInnerPadding() { needInnerPadding() {
return ['system-app-template','sys-identification', 'sys-abutment', 'sys-task-email', 'system-dept', 'system-dept-form', 'system-auth', 'sys-appearance', 'system-param', 'system-template', 'sys-task-dataset', 'sys-msg-web-all', 'system-plugin'].includes(this.$route.name) return ['system-app-template', 'sys-identification', 'sys-abutment', 'sys-task-email', 'system-dept', 'system-dept-form', 'system-auth', 'sys-appearance', 'system-param', 'system-template', 'sys-task-dataset', 'sys-msg-web-all', 'system-plugin'].includes(this.$route.name)
} }
} }
} }

View File

@ -27,8 +27,8 @@
currentTemplateShowList.length currentTemplateShowList.length
}}) }})
<deBtn <deBtn
type="primary"
v-if="showPositionCheck('system-setting')" v-if="showPositionCheck('system-setting')"
type="primary"
icon="el-icon-upload2" icon="el-icon-upload2"
@click="templateImport(currentTemplateId)" @click="templateImport(currentTemplateId)"
> >
@ -77,7 +77,7 @@
:label="dialogTitleLabel" :label="dialogTitleLabel"
prop="name" prop="name"
> >
<el-input v-model="templateEditForm.name"/> <el-input v-model="templateEditForm.name" />
</el-form-item> </el-form-item>
<el-form-item <el-form-item
:label="$t('app_template.app_group_icon')" :label="$t('app_template.app_group_icon')"
@ -95,7 +95,7 @@
:http-request="upload" :http-request="upload"
:file-list="fileList" :file-list="fileList"
> >
<i class="el-icon-plus"/> <i class="el-icon-plus" />
</el-upload> </el-upload>
<el-dialog <el-dialog
top="25vh" top="25vh"
@ -151,7 +151,6 @@
</template> </template>
<script> <script>
import DeLayoutContent from '@/components/business/DeLayoutContent'
import TemplateList from './component/TemplateList' import TemplateList from './component/TemplateList'
import TemplateItem from './component/TemplateItem' import TemplateItem from './component/TemplateItem'
import TemplateImport from './component/TemplateImport' import TemplateImport from './component/TemplateImport'
@ -163,7 +162,7 @@ import { imgUrlTrans } from '@/components/canvas/utils/utils'
export default { export default {
name: 'AppTemplateContent', name: 'AppTemplateContent',
components: { DeLayoutContent, TemplateList, TemplateItem, TemplateImport }, components: { TemplateList, TemplateItem, TemplateImport },
mixins: [msgCfm], mixins: [msgCfm],
props: { props: {
showPosition: { showPosition: {

View File

@ -7,19 +7,22 @@
size="600px" size="600px"
direction="rtl" direction="rtl"
> >
<ds-form v-if="applyDrawer" :reference-position="'appMarket'" :outer-params="outerParams" @closeDraw="close"></ds-form> <ds-form
v-if="applyDrawer"
:reference-position="'appMarket'"
:outer-params="outerParams"
@closeDraw="close"
/>
</el-drawer> </el-drawer>
</template> </template>
<script> <script>
import DeDatePick from '@/components/deCustomCm/deDatePick.vue'
import DsForm from '@/views/system/datasource/DsForm' import DsForm from '@/views/system/datasource/DsForm'
export default { export default {
components: {
DsForm,
DeDatePick
},
name: 'AppTemplateApply', name: 'AppTemplateApply',
components: {
DsForm
},
data() { data() {
return { return {
outerParams: {}, outerParams: {},
@ -40,7 +43,7 @@ export default {
this.outerParams = params this.outerParams = params
}, },
close() { close() {
this.$emit("closeDraw") this.$emit('closeDraw')
this.applyDrawer = false this.applyDrawer = false
} }
} }

View File

@ -12,7 +12,10 @@
alt="" alt=""
> >
</div> </div>
<div class="card-info" v-if="showPositionCheck('system-setting')"> <div
v-if="showPositionCheck('system-setting')"
class="card-info"
>
<el-tooltip <el-tooltip
class="item" class="item"
effect="dark" effect="dark"
@ -26,18 +29,18 @@
trigger="click" trigger="click"
@command="handleCommand" @command="handleCommand"
> >
<i class="el-icon-more"/> <i class="el-icon-more" />
<el-dropdown-menu <el-dropdown-menu
slot="dropdown" slot="dropdown"
class="de-card-dropdown" class="de-card-dropdown"
> >
<slot> <slot>
<el-dropdown-item command="update"> <el-dropdown-item command="update">
<i class="el-icon-edit"/> <i class="el-icon-edit" />
{{ $t('commons.update') }} {{ $t('commons.update') }}
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="delete"> <el-dropdown-item command="delete">
<i class="el-icon-delete"/> <i class="el-icon-delete" />
{{ $t('commons.uninstall') }} {{ $t('commons.uninstall') }}
</el-dropdown-item> </el-dropdown-item>
</slot> </slot>
@ -45,7 +48,10 @@
</el-dropdown> </el-dropdown>
</div> </div>
<div class="card-info-apply" v-if="showPositionCheck('market-manage')"> <div
v-if="showPositionCheck('market-manage')"
class="card-info-apply"
>
<el-row> <el-row>
<el-row> <el-row>
<el-tooltip <el-tooltip

View File

@ -29,12 +29,17 @@
:class="[{ select: activeTemplate === ele.id }]" :class="[{ select: activeTemplate === ele.id }]"
@click="nodeClick(ele)" @click="nodeClick(ele)"
> >
<img :src="iconImgRul(ele.icon)" style="margin-right: 8px;border-radius: 4px" width="24" height="24"/> <img
:src="iconImgRul(ele.icon)"
style="margin-right: 8px;border-radius: 4px"
width="24"
height="24"
>
<span>{{ ele.name }}</span> <span>{{ ele.name }}</span>
<span <span
v-if="showPositionCheck('system-setting')"
class="more" class="more"
@click.stop @click.stop
v-if="showPositionCheck('system-setting')"
> >
<el-dropdown <el-dropdown
trigger="click" trigger="click"
@ -87,7 +92,6 @@
import msgCfm from '@/components/msgCfm/index' import msgCfm from '@/components/msgCfm/index'
import { imgUrlTrans } from '@/components/canvas/utils/utils' import { imgUrlTrans } from '@/components/canvas/utils/utils'
export default { export default {
name: 'TemplateList', name: 'TemplateList',
components: {}, components: {},
@ -126,10 +130,10 @@ export default {
} }
}, },
methods: { methods: {
showPositionCheck(requiredPosition){ showPositionCheck(requiredPosition) {
return this.showPosition === requiredPosition return this.showPosition === requiredPosition
}, },
iconImgRul(iconUrl){ iconImgRul(iconUrl) {
return imgUrlTrans(iconUrl) return imgUrlTrans(iconUrl)
}, },
clickMore(type, data) { clickMore(type, data) {

View File

@ -1,6 +1,6 @@
<template> <template>
<de-layout-content> <de-layout-content>
<app-template-content :show-position="'system-setting'"></app-template-content> <app-template-content :show-position="'system-setting'" />
</de-layout-content> </de-layout-content>
</template> </template>
@ -9,7 +9,7 @@ import AppTemplateContent from '@/views/panel/appTemplate/AppTemplateContent'
import DeLayoutContent from '@/components/business/DeLayoutContent' import DeLayoutContent from '@/components/business/DeLayoutContent'
export default { export default {
name: 'AppTemplate', name: 'AppTemplate',
components: { DeLayoutContent, AppTemplateContent } components: { DeLayoutContent, AppTemplateContent }
} }
</script> </script>

View File

@ -1,17 +1,23 @@
<template> <template>
<el-row> <el-row>
<el-row style="height: 56px"> <el-row style="height: 56px">
<el-col :span="12" style="text-align: left;line-height: 56px"> <el-col
:span="12"
style="text-align: left;line-height: 56px"
>
<svg-icon <svg-icon
icon-class="icon_left_outlined" icon-class="icon_left_outlined"
class="toolbar-icon-active icon20 margin-left20" class="toolbar-icon-active icon20 margin-left20"
@click="closePreview" @click="closePreview"
/> />
<span class="text16 margin-left12"> <span class="text16 margin-left12">
{{templateInfo.name}} {{ templateInfo.name }}
</span> </span>
</el-col> </el-col>
<el-col :span="12" style="text-align: right;line-height: 56px;padding-right: 24px"> <el-col
:span="12"
style="text-align: right;line-height: 56px;padding-right: 24px"
>
<el-button <el-button
size="small" size="small"
type="primary" type="primary"
@ -32,13 +38,9 @@
</template> </template>
<script> <script>
import TemplateMarketPreviewItem from '@/views/panel/appTemplateMarket/component/TemplateMarketPreviewItem'
import AppTemplateLog from '@/views/panel/appTemplateMarket/log'
import DsAppForm from '@/views/system/datasource/DsAppForm'
export default { export default {
name: 'AppMarketPreview', name: 'AppMarketPreview',
components: { DsAppForm, AppTemplateLog, TemplateMarketPreviewItem }, components: { },
props: { props: {
templateInfo: { templateInfo: {
type: Object, type: Object,
@ -60,11 +62,11 @@ export default {
}, },
methods: { methods: {
appApply(){ appApply() {
this.$emit("appApply") this.$emit('appApply')
}, },
closePreview(){ closePreview() {
this.$emit("closePreview") this.$emit('closePreview')
} }
} }
} }
@ -102,7 +104,6 @@ export default {
color: var(--TextPrimary, #1F2329); color: var(--TextPrimary, #1F2329);
} }
.icon16 { .icon16 {
font-size: 16px!important; font-size: 16px!important;
color: var(--TextPrimary, #1F2329); color: var(--TextPrimary, #1F2329);

View File

@ -31,13 +31,19 @@
</el-tabs> </el-tabs>
</el-row> </el-row>
<el-row v-show="marketActiveTab==='apps'"> <el-row v-show="marketActiveTab==='apps'">
<app-template-content :ref="'appTemplateContent'" class="template-main-content" :show-position="'market-manage'" @previewApp="previewApp" @applyNew="applyNew"></app-template-content> <app-template-content
:ref="'appTemplateContent'"
class="template-main-content"
:show-position="'market-manage'"
@previewApp="previewApp"
@applyNew="applyNew"
/>
</el-row> </el-row>
<el-row <el-row
v-show="marketActiveTab==='apply_logs'" v-show="marketActiveTab==='apply_logs'"
class="main-log-area template-main" class="main-log-area template-main"
> >
<app-template-log class="log-area"/> <app-template-log class="log-area" />
</el-row> </el-row>
</el-row> </el-row>
@ -114,18 +120,15 @@
import { searchAppTemplate } from '@/api/appTemplateMarket' import { searchAppTemplate } from '@/api/appTemplateMarket'
import { groupTree, panelSave } from '@/api/panel/panel' import { groupTree, panelSave } from '@/api/panel/panel'
import { DEFAULT_COMMON_CANVAS_STYLE_STRING } from '@/views/panel/panel' import { DEFAULT_COMMON_CANVAS_STYLE_STRING } from '@/views/panel/panel'
import MarketPreview from '@/views/panel/appTemplateMarket/component/MarketPreview'
import elementResizeDetectorMaker from 'element-resize-detector' import elementResizeDetectorMaker from 'element-resize-detector'
import AppTemplateItem from '@/views/panel/appTemplateMarket/component/AppTemplateItem'
import AppTemplateLog from '@/views/panel/appTemplateMarket/log' import AppTemplateLog from '@/views/panel/appTemplateMarket/log'
import AppTemplate from '@/views/panel/appTemplate'
import AppTemplateContent from '@/views/panel/appTemplate/AppTemplateContent' import AppTemplateContent from '@/views/panel/appTemplate/AppTemplateContent'
import AppMarketPreview from '@/views/panel/appTemplateMarket/component/AppMarketPreview' import AppMarketPreview from '@/views/panel/appTemplateMarket/component/AppMarketPreview'
import AppTemplateApply from '@/views/panel/appTemplate/component/AppTemplateApply' import AppTemplateApply from '@/views/panel/appTemplate/component/AppTemplateApply'
export default { export default {
name: 'AppTemplateMarket', name: 'AppTemplateMarket',
components: { AppTemplateApply, AppMarketPreview, AppTemplateContent, AppTemplate, AppTemplateLog, AppTemplateItem, MarketPreview }, components: { AppTemplateApply, AppMarketPreview, AppTemplateContent, AppTemplateLog },
data() { data() {
return { return {
previewItem: null, previewItem: null,
@ -203,10 +206,10 @@ export default {
} }
this.$refs.templateApply.init(param) this.$refs.templateApply.init(param)
}, },
appApply(){ appApply() {
this.applyNew(this.previewItem) this.applyNew(this.previewItem)
}, },
previewApp(item){ previewApp(item) {
this.previewModel = true this.previewModel = true
this.previewItem = item this.previewItem = item
}, },

View File

@ -35,8 +35,8 @@
icon="iconfont icon-icon-filter" icon="iconfont icon-icon-filter"
@click="filterShow" @click="filterShow"
>{{ >{{
$t('user.filter') $t('user.filter')
}} }}
<template v-if="filterTexts.length"> <template v-if="filterTexts.length">
({{ cacheCondition.length }}) ({{ cacheCondition.length }})
</template> </template>
@ -49,7 +49,7 @@
> >
<span class="sum">{{ paginationConfig.total }}</span> <span class="sum">{{ paginationConfig.total }}</span>
<span class="title">{{ $t('user.result_one') }}</span> <span class="title">{{ $t('user.result_one') }}</span>
<el-divider direction="vertical"/> <el-divider direction="vertical" />
<i <i
v-if="showScroll" v-if="showScroll"
class="el-icon-arrow-left arrow-filter" class="el-icon-arrow-left arrow-filter"
@ -62,9 +62,9 @@
class="text" class="text"
> >
{{ ele }} <i {{ ele }} <i
class="el-icon-close" class="el-icon-close"
@click="clearOneFilter(index)" @click="clearOneFilter(index)"
/> />
</p> </p>
</div> </div>
<i <i
@ -100,7 +100,11 @@
:label="$t('app_template.datasource')" :label="$t('app_template.datasource')"
> >
<template #default="{ row }"> <template #default="{ row }">
<span v-if="row.datasourceId" class="link-span" @click="goToDatasource(row)">{{ row.datasourceName }}</span> <span
v-if="row.datasourceId"
class="link-span"
@click="goToDatasource(row)"
>{{ row.datasourceName }}</span>
<span v-else>{{ row.datasourceName }}</span> <span v-else>{{ row.datasourceName }}</span>
</template> </template>
</el-table-column> </el-table-column>
@ -115,7 +119,11 @@
:label="$t('app_template.panel')" :label="$t('app_template.panel')"
> >
<template #default="{ row }"> <template #default="{ row }">
<span v-if="row.panelId" class="link-span" @click="goPanel(row)">{{ row.panelName }}</span> <span
v-if="row.panelId"
class="link-span"
@click="goPanel(row)"
>{{ row.panelName }}</span>
<span v-else>{{ row.panelName }}</span> <span v-else>{{ row.panelName }}</span>
</template> </template>
</el-table-column> </el-table-column>
@ -181,20 +189,20 @@
width="420px" width="420px"
> >
<el-row> <el-row>
<el-checkbox v-model="deleteItemInfo.deleteResource"></el-checkbox> <el-checkbox v-model="deleteItemInfo.deleteResource" />
{{$t('app_template.log_resource_delete_tips')}} {{ $t('app_template.log_resource_delete_tips') }}
</el-row> </el-row>
<span slot="footer"> <span slot="footer">
<el-button <el-button
size="mini" size="mini"
@click="closeDel" @click="closeDel"
>{{ $t('commons.cancel') }}</el-button> >{{ $t('commons.cancel') }}</el-button>
<el-button <el-button
type="danger" type="danger"
size="mini" size="mini"
@click="confirmDel" @click="confirmDel"
>{{ $t('commons.confirm') }}</el-button> >{{ $t('commons.confirm') }}</el-button>
</span> </span>
</el-dialog> </el-dialog>
</el-row> </el-row>
</template> </template>
@ -211,7 +219,6 @@ import {
import { deleteLogAndResource, logGrid } from '@/api/appTemplateMarket/log' import { deleteLogAndResource, logGrid } from '@/api/appTemplateMarket/log'
import { findOneWithParent } from '@/api/panel/panel' import { findOneWithParent } from '@/api/panel/panel'
import AppTemplateApply from '@/views/panel/appTemplate/component/AppTemplateApply' import AppTemplateApply from '@/views/panel/appTemplate/component/AppTemplateApply'
import { deepCopy } from '@/components/canvas/utils/utils'
export default { export default {
name: 'AppTemplateLog', name: 'AppTemplateLog',
@ -274,7 +281,7 @@ export default {
this.deleteConfirmDialog = false this.deleteConfirmDialog = false
}, },
confirmDel() { confirmDel() {
deleteLogAndResource(this.deleteItemInfo).then(()=>{ deleteLogAndResource(this.deleteItemInfo).then(() => {
this.closeDel() this.closeDel()
this.search() this.search()
}) })

View File

@ -17,7 +17,7 @@
style="border-bottom: 1px solid;border-bottom-color:#E6E6E6;" style="border-bottom: 1px solid;border-bottom-color:#E6E6E6;"
> >
<div style="height: 100%;"> <div style="height: 100%;">
<share-head/> <share-head />
</div> </div>
</el-row> </el-row>
<el-row <el-row
@ -45,7 +45,7 @@
width="400" width="400"
trigger="click" trigger="click"
> >
<panel-detail-info/> <panel-detail-info />
<i <i
slot="reference" slot="reference"
class="el-icon-warning icon-class" class="el-icon-warning icon-class"

View File

@ -3,7 +3,10 @@
v-loading="formLoading" v-loading="formLoading"
:class="positionCheck('datasource')?'de-ds-form':'de-ds-form-app'" :class="positionCheck('datasource')?'de-ds-form':'de-ds-form-app'"
> >
<div v-if="positionCheck('datasource')" class="de-ds-top"> <div
v-if="positionCheck('datasource')"
class="de-ds-top"
>
<span class="name"> <span class="name">
<i <i
class="el-icon-arrow-left" class="el-icon-arrow-left"
@ -11,10 +14,10 @@
/> />
{{ {{
params && params &&
params.id && params.id &&
params.showModel && params.showModel &&
params.showModel === 'show' && params.showModel === 'show' &&
!canEdit !canEdit
? $t('datasource.show_info') ? $t('datasource.show_info')
: formType == 'add' : formType == 'add'
? `${$t('commons.create') + typeMap}${$t('commons.datasource')}` ? `${$t('commons.create') + typeMap}${$t('commons.datasource')}`
@ -64,15 +67,18 @@
<div class="de-ds-inner"> <div class="de-ds-inner">
<div class="w600"> <div class="w600">
<el-form <el-form
ref="attachParamsForm"
v-if="positionCheck('appMarket')" v-if="positionCheck('appMarket')"
ref="attachParamsForm"
:model="attachForm" :model="attachForm"
:rules="attachRule" :rules="attachRule"
class="de-form-item" class="de-form-item"
label-width="180px" label-width="180px"
label-position="right" label-position="right"
> >
<div class="de-row-rules" style="margin: 0 0 16px 0;"> <div
class="de-row-rules"
style="margin: 0 0 16px 0;"
>
<span>{{ $t('datasource.basic_info') }}</span> <span>{{ $t('datasource.basic_info') }}</span>
</div> </div>
<el-form-item <el-form-item
@ -94,7 +100,7 @@
:label="$t('app_template.panel_name')" :label="$t('app_template.panel_name')"
prop="panelName" prop="panelName"
> >
<el-input v-model="attachForm.panelName"/> <el-input v-model="attachForm.panelName" />
</el-form-item> </el-form-item>
<el-form-item <el-form-item
:label="$t('app_template.dataset_group_position')" :label="$t('app_template.dataset_group_position')"
@ -115,7 +121,7 @@
:label="$t('app_template.dataset_group_name')" :label="$t('app_template.dataset_group_name')"
prop="datasetGroupName" prop="datasetGroupName"
> >
<el-input v-model="attachForm.datasetGroupName"/> <el-input v-model="attachForm.datasetGroupName" />
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -137,8 +143,8 @@
> >
<div class="de-row-rules"> <div class="de-row-rules">
<span>{{ <span>{{
positionCheck('appMarket') ? $t('app_template.datasource_info') : $t('datasource.basic_info') positionCheck('appMarket') ? $t('app_template.datasource_info') : $t('datasource.basic_info')
}}</span> }}</span>
</div> </div>
<el-form-item <el-form-item
:label="$t('datasource.display_name')" :label="$t('datasource.display_name')"
@ -222,8 +228,14 @@
</div> </div>
</div> </div>
</div> </div>
<div v-if="positionCheck('appMarket')" class="de-ds-bottom"> <div
<div class="apply" style="width: 100%"> v-if="positionCheck('appMarket')"
class="de-ds-bottom"
>
<div
class="apply"
style="width: 100%"
>
<template v-if="canEdit"> <template v-if="canEdit">
<deBtn <deBtn
secondary secondary
@ -871,10 +883,10 @@ export default {
} }
if (this.positionCheck('appMarket')) { if (this.positionCheck('appMarket')) {
this.$refs.attachParamsForm.validate(valid => { this.$refs.attachParamsForm.validate(valid => {
if (!valid) { if (!valid) {
return false return false
}
} }
}
) )
} }
this.$refs.dsForm.validate((valid) => { this.$refs.dsForm.validate((valid) => {
@ -1016,10 +1028,10 @@ export default {
} }
if (this.positionCheck('appMarket')) { if (this.positionCheck('appMarket')) {
this.$refs.attachParamsForm.validate(valid => { this.$refs.attachParamsForm.validate(valid => {
if (!valid) { if (!valid) {
return false return false
}
} }
}
) )
} }
this.$refs.dsForm.validate((valid) => { this.$refs.dsForm.validate((valid) => {