赋能案例-后台管理系统
This commit is contained in:
851673013@qq.com
parent
46c1cc68ed
commit
11b2536c5c
File diff suppressed because it is too large
Load Diff
|
|
@ -1,980 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<el-dialog
|
|
||||||
:visible.sync="visible"
|
|
||||||
:title="disabled ? '能力展示' : '挂接'"
|
|
||||||
@close="guanbi"
|
|
||||||
:close-on-click-modal="false"
|
|
||||||
:close-on-press-escape="false"
|
|
||||||
>
|
|
||||||
<!-- 挂载和修改-->
|
|
||||||
<div key="1" v-if="!disabled">
|
|
||||||
<!-- 挂载-->
|
|
||||||
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">填写字段</div>
|
|
||||||
<el-checkbox-group v-model="checkList" @change="showListChagne" style="margin-bottom:20px;">
|
|
||||||
<el-checkbox-button v-for="item in dataForm.showListAll" :label="item.name" :key="item.id">{{item.name}}</el-checkbox-button>
|
|
||||||
</el-checkbox-group>
|
|
||||||
<el-form
|
|
||||||
v-if="!UpdateState"
|
|
||||||
:model="dataForm"
|
|
||||||
:rules="rules"
|
|
||||||
ref="dataForm"
|
|
||||||
@keyup.enter.native="dataFormSubmitHandle()"
|
|
||||||
:label-width="$i18n.locale === 'en-US' ? '120px' : 'auto'"
|
|
||||||
>
|
|
||||||
<div v-show="checkList.indexOf('必填信息')>-1">
|
|
||||||
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">必填信息</div>
|
|
||||||
<el-form-item label="应用名称" prop="name">
|
|
||||||
<el-input v-model="dataForm.name" placeholder="请输入组件名称" ></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="应用描述" prop="description">
|
|
||||||
<el-input v-model="dataForm.description" placeholder="请输入组件描述" ></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="部门联系人" prop="deptContacts">
|
|
||||||
<el-input v-model="dataForm.deptContacts" placeholder="请输入部门联系人" ></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="部门联系人电话" prop="deptPhone">
|
|
||||||
<el-input v-model="dataForm.deptPhone" placeholder="请输入部门联系人电话" ></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享条件" prop="shareCondition">
|
|
||||||
<el-select
|
|
||||||
v-model="dataForm.shareCondition"
|
|
||||||
placeholder="请选择共享条件"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="val in typeOptions"
|
|
||||||
:key="val.value"
|
|
||||||
:label="val.label"
|
|
||||||
:value="val.value"
|
|
||||||
>
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享类型" prop="shareType"><el-select
|
|
||||||
v-model="dataForm.shareType"
|
|
||||||
placeholder="请选择共享类型"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="val in conditionOptions"
|
|
||||||
:key="val.value"
|
|
||||||
:label="val.label"
|
|
||||||
:value="val.value"
|
|
||||||
>
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享方式" prop="shareMode">
|
|
||||||
<el-input v-model="dataForm.shareMode" placeholder="请输入共享方式" ></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div v-for="item in dataForm.showList" :key="item.id" v-show="item.name !== '必填信息'">
|
|
||||||
<div style="text-align:center;font-weight: 600;font-size: 18px;margin-bottom: 10px;">{{item.name}}</div>
|
|
||||||
<el-form-item :label="child.name" v-for="child in item.children" :key="child.id" v-show="item.children">
|
|
||||||
<el-input v-model="child.note1" :placeholder="'请输入'+child.name" v-if="child.type=='input'"></el-input>
|
|
||||||
<el-input v-model="child.note1" :placeholder="'请输入'+child.name" type="textarea" :rows="2" v-if="child.type=='textArea'"></el-input>
|
|
||||||
<el-select
|
|
||||||
v-else-if="child.type=='select'"
|
|
||||||
v-model="child.note1"
|
|
||||||
:placeholder="'请选择' + child.name"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="val in child.options"
|
|
||||||
:key="val"
|
|
||||||
:label="val"
|
|
||||||
:value="val"
|
|
||||||
>
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
<upload v-else-if="child.type=='images'" :child='child' limit='5' accept='.jpg,.png'></upload>
|
|
||||||
<upload v-else-if="child.type=='image'" :child='child' limit='1' accept='.jpg,.png'></upload>
|
|
||||||
<upload v-else-if="child.type=='video'" :child='child' limit='1' accept='.mp4'></upload>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
<!-- 修改-->
|
|
||||||
<el-form
|
|
||||||
v-else
|
|
||||||
:model="dataFormUpdate"
|
|
||||||
ref="dataForm"
|
|
||||||
@keyup.enter.native="dataFormSubmitHandle()"
|
|
||||||
:label-width="$i18n.locale === 'en-US' ? '120px' : 'auto'"
|
|
||||||
>
|
|
||||||
<el-form-item label="应用名称">
|
|
||||||
<el-input
|
|
||||||
v-model="dataFormUpdate.name"
|
|
||||||
placeholder="应用名称"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="应用描述">
|
|
||||||
<el-input
|
|
||||||
v-model="dataFormUpdate.description"
|
|
||||||
placeholder="应用描述"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="访问地址">
|
|
||||||
<el-input
|
|
||||||
v-model="dataFormUpdate.link"
|
|
||||||
placeholder="访问地址"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="部门联系人">
|
|
||||||
<el-input
|
|
||||||
v-model="dataFormUpdate.deptContacts"
|
|
||||||
placeholder="部门联系人"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="部门联系人电话">
|
|
||||||
<el-input
|
|
||||||
v-model="dataFormUpdate.deptPhone"
|
|
||||||
placeholder="部门联系人电话"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享类型">
|
|
||||||
<el-select v-model="dataFormUpdate.shareType" placeholder="请选择">
|
|
||||||
<el-option
|
|
||||||
v-for="item in typeOptions"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value"
|
|
||||||
>
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
<!-- <el-input v-model="dataFormUpdate.shareType" placeholder="共享类型"></el-input> -->
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享条件">
|
|
||||||
<el-select
|
|
||||||
v-model="dataFormUpdate.shareCondition"
|
|
||||||
placeholder="请选择"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in conditionOptions"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value"
|
|
||||||
>
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
<!-- <el-input v-model="dataFormUpdate.shareCondition" placeholder="共享条件"></el-input> -->
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享方式">
|
|
||||||
<el-input
|
|
||||||
v-model="dataFormUpdate.shareMode"
|
|
||||||
placeholder="共享方式"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="服务接口">
|
|
||||||
<el-input
|
|
||||||
v-model="dataFormUpdate.apiUrl"
|
|
||||||
placeholder="服务接口"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="服务接口请求方式">
|
|
||||||
<el-input
|
|
||||||
v-model="dataFormUpdate.apiMethodType"
|
|
||||||
placeholder="服务接口请求方式"
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
v-for="item in dataFormUpdate.infoList"
|
|
||||||
:key="item.index"
|
|
||||||
:label="item.attrType"
|
|
||||||
>
|
|
||||||
<el-input
|
|
||||||
v-model="item.attrValue"
|
|
||||||
:placeholder="item.attrType"
|
|
||||||
v-if="
|
|
||||||
item.attrType != '应用领域' &&
|
|
||||||
item.attrType != '应用类型' &&
|
|
||||||
item.attrType != '发布端' &&
|
|
||||||
item.attrType != '应用状态'
|
|
||||||
"
|
|
||||||
></el-input>
|
|
||||||
<el-select
|
|
||||||
v-else
|
|
||||||
v-model="item.attrValue"
|
|
||||||
:placeholder="item.attrType"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
:value="item2.dictLabel"
|
|
||||||
v-for="item2 in item.children"
|
|
||||||
:key="item2.id"
|
|
||||||
:label="item2.dictLabel"
|
|
||||||
></el-option>
|
|
||||||
</el-select>
|
|
||||||
<!-- <el-upload
|
|
||||||
v-if="item.attrType == '应用图片'"
|
|
||||||
ref="addUpload"
|
|
||||||
class="upload-demo"
|
|
||||||
:action="fileUploadUrl"
|
|
||||||
:on-success="handleAvatarSuccess"
|
|
||||||
:before-upload="beforeAvatarUpload"
|
|
||||||
:on-remove="addUploadRemoveFile"
|
|
||||||
:on-preview="showView"
|
|
||||||
list-type="picture"
|
|
||||||
>
|
|
||||||
<el-button size="small" type="primary">点击上传</el-button>
|
|
||||||
<div slot="tip" class="el-upload__tip">
|
|
||||||
只能上传jpg/png文件，且不超过200M
|
|
||||||
</div>
|
|
||||||
</el-upload> -->
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
<!-- 展示 -->
|
|
||||||
<el-form
|
|
||||||
key="2"
|
|
||||||
class="detial-form"
|
|
||||||
v-else
|
|
||||||
:label-width="$i18n.locale === 'en-US' ? '120px' : 'auto'"
|
|
||||||
>
|
|
||||||
<el-form-item label="应用名称" prop="name">
|
|
||||||
{{ dataFormShowDetails.name || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="应用描述">
|
|
||||||
{{ dataFormShowDetails.description || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="访问地址">
|
|
||||||
{{ dataFormShowDetails.link || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="部门联系人">
|
|
||||||
{{ dataFormShowDetails.deptContacts || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="部门联系人电话">
|
|
||||||
{{ dataFormShowDetails.deptPhone || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享类型">
|
|
||||||
{{ dataFormShowDetails.shareType || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享条件">
|
|
||||||
{{ dataFormShowDetails.shareCondition || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="共享方式">
|
|
||||||
{{ dataFormShowDetails.shareMode || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="服务接口">
|
|
||||||
{{ dataFormShowDetails.apiUrl || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="服务接口请求方式">
|
|
||||||
{{ dataFormShowDetails.apiMethodType || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
v-for="item in dataFormShowDetails.infoList"
|
|
||||||
:key="item.index"
|
|
||||||
:label="item.attrType"
|
|
||||||
:prop="item.attrValue"
|
|
||||||
>
|
|
||||||
{{ item.attrValue || "--" }}
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<template slot="footer" v-if="!disabled">
|
|
||||||
<el-button @click="visible = false">{{ $t("cancel") }}</el-button>
|
|
||||||
<el-button type="primary" @click="dataFormSubmitHandle()">{{
|
|
||||||
$t("confirm")
|
|
||||||
}}</el-button>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
<div>
|
|
||||||
<el-dialog :visible.sync="dialogVisibleImg">
|
|
||||||
<img width="100%" :src="previewImg" />
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import debounce from 'lodash/debounce'
|
|
||||||
import dictionaries from '@/utils/dictionaries'
|
|
||||||
import { mapState } from 'vuex'
|
|
||||||
import { getIconList } from '@/utils'
|
|
||||||
import Cookies from 'js-cookie'
|
|
||||||
import upload from './upload.vue'
|
|
||||||
import bus from '@/views/bus.js'
|
|
||||||
import qs from 'qs'
|
|
||||||
import Vue from 'vue'
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
upload
|
|
||||||
},
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
checkList: [],
|
|
||||||
dialogVisibleImg: false,
|
|
||||||
previewImg: '', // 预览图片
|
|
||||||
dialogVisible: false,
|
|
||||||
fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload',
|
|
||||||
uploadUrl:
|
|
||||||
window.SITE_CONFIG.apiURL +
|
|
||||||
'/sys/oss/upload?token=' +
|
|
||||||
Cookies.get('ucsToken'),
|
|
||||||
companyArr: dictionaries.companyArr,
|
|
||||||
visible: false,
|
|
||||||
sceneArr: dictionaries.sceneArr,
|
|
||||||
fieldArr: dictionaries.fieldArr,
|
|
||||||
shareFormArr: dictionaries.shareFormArr,
|
|
||||||
shareTypeArr: dictionaries.shareTypeArr,
|
|
||||||
iconList: [],
|
|
||||||
iconListVisible: false,
|
|
||||||
menuListVisible: false,
|
|
||||||
UpdateState: false,
|
|
||||||
dataForm: {
|
|
||||||
id: '',
|
|
||||||
deptId: '',
|
|
||||||
deptContacts: '',
|
|
||||||
deptPhone: '',
|
|
||||||
dataVolume: '',
|
|
||||||
shareCondition: '',
|
|
||||||
shareType: '',
|
|
||||||
shareMode: '',
|
|
||||||
delFlag: 0,
|
|
||||||
description: '',
|
|
||||||
downloads: 0,
|
|
||||||
image: '',
|
|
||||||
showList: [],
|
|
||||||
infoList: [],
|
|
||||||
link: '',
|
|
||||||
name: '',
|
|
||||||
note1: '',
|
|
||||||
note2: '',
|
|
||||||
note3: '',
|
|
||||||
note4: '',
|
|
||||||
note5: '',
|
|
||||||
score: '',
|
|
||||||
type: '应用资源',
|
|
||||||
apiMethodType: '',
|
|
||||||
apiUrl: '',
|
|
||||||
visits: 0
|
|
||||||
},
|
|
||||||
deptId: '',
|
|
||||||
fangwendizhi: '',
|
|
||||||
mingzi: '',
|
|
||||||
dataFormUpdate: {},
|
|
||||||
dataFormShowDetails: {},
|
|
||||||
infoList2: [],
|
|
||||||
infoList3: [],
|
|
||||||
typeOptions: [
|
|
||||||
{ value: '有条件共享', label: '有条件共享' },
|
|
||||||
{ value: '无条件共享', label: '无条件共享' }
|
|
||||||
],
|
|
||||||
conditionOptions: [
|
|
||||||
{ value: '申请', label: '申请' },
|
|
||||||
{ value: '免批申请', label: '免批申请' }
|
|
||||||
],
|
|
||||||
|
|
||||||
rules: {
|
|
||||||
name: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请输入应用名称',
|
|
||||||
trigger: 'change'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
description: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请输入应用描述',
|
|
||||||
trigger: 'change'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
deptContacts: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请输入部门联系人',
|
|
||||||
trigger: 'change'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
deptPhone: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请输入部门联系人电话',
|
|
||||||
trigger: 'change'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
shareCondition: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请选择共享条件',
|
|
||||||
trigger: 'change'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
shareType: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请选择请输入共享类型',
|
|
||||||
trigger: 'change'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
shareMode: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: '请输入共享方式',
|
|
||||||
trigger: 'change'
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
disabled: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
...mapState(['catalogueTree']),
|
|
||||||
...mapState(['departmentSelects']),
|
|
||||||
dataRule () {
|
|
||||||
return {
|
|
||||||
name: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
version: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
visitUrl: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
type: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
shareType: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
shareForm: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
field: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
scene: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
deptId: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
content: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
rank: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
useInfo: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
remarks: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
isUp: [
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: this.$t('validate.required'),
|
|
||||||
trigger: 'blur'
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
// 上传图片
|
|
||||||
handleAvatarSuccess (res, file) {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error('上传图片失败')
|
|
||||||
}
|
|
||||||
debugger
|
|
||||||
this.dataForm.infoList.map((item, index) => {
|
|
||||||
if (item.attrType == '应用图片') {
|
|
||||||
if (!this.dataForm.infoList[index].attrValue) {
|
|
||||||
this.dataForm.infoList[index].attrValue = res.data
|
|
||||||
} else {
|
|
||||||
this.dataForm.infoList[index].attrValue += ';' + res.data
|
|
||||||
}
|
|
||||||
console.log('上传图片', this.dataForm.infoList[index])
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// this.imageUrl = URL.createObjectURL(file.raw);
|
|
||||||
},
|
|
||||||
handleAvatarSuccessone (res, file) {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error('上传图片失败')
|
|
||||||
}
|
|
||||||
debugger
|
|
||||||
this.dataForm.infoList.map((item, index) => {
|
|
||||||
if (item.attrType == '子系统一图片') {
|
|
||||||
if (!this.dataForm.infoList[index].attrValue) {
|
|
||||||
this.dataForm.infoList[index].attrValue = res.data
|
|
||||||
} else {
|
|
||||||
this.dataForm.infoList[index].attrValue = ''
|
|
||||||
this.dataForm.infoList[index].attrValue = res.data
|
|
||||||
}
|
|
||||||
console.log('上传图片', this.dataForm.infoList[index])
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// this.imageUrl = URL.createObjectURL(file.raw);
|
|
||||||
},
|
|
||||||
handleAvatarSuccesstwo (res, file) {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error('上传图片失败')
|
|
||||||
}
|
|
||||||
debugger
|
|
||||||
this.dataForm.infoList.map((item, index) => {
|
|
||||||
if (item.attrType == '子系统二图片') {
|
|
||||||
if (!this.dataForm.infoList[index].attrValue) {
|
|
||||||
this.dataForm.infoList[index].attrValue = res.data
|
|
||||||
} else {
|
|
||||||
this.dataForm.infoList[index].attrValue = ''
|
|
||||||
this.dataForm.infoList[index].attrValue = res.data
|
|
||||||
}
|
|
||||||
console.log('上传图片', this.dataForm.infoList[index])
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// this.imageUrl = URL.createObjectURL(file.raw);
|
|
||||||
},
|
|
||||||
handleAvatarSuccessthree (res, file) {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error('上传图片失败')
|
|
||||||
}
|
|
||||||
debugger
|
|
||||||
this.dataForm.infoList.map((item, index) => {
|
|
||||||
if (item.attrType == '子系统三图片') {
|
|
||||||
if (!this.dataForm.infoList[index].attrValue) {
|
|
||||||
this.dataForm.infoList[index].attrValue = res.data
|
|
||||||
} else {
|
|
||||||
this.dataForm.infoList[index].attrValue = ''
|
|
||||||
this.dataForm.infoList[index].attrValue = res.data
|
|
||||||
}
|
|
||||||
console.log('上传图片', this.dataForm.infoList[index])
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// this.imageUrl = URL.createObjectURL(file.raw);
|
|
||||||
},
|
|
||||||
beforeAvatarUpload (file) {
|
|
||||||
const isImage =
|
|
||||||
file.type === 'image/jpeg' ||
|
|
||||||
file.type === 'image/jpg' ||
|
|
||||||
file.type === 'image/png'
|
|
||||||
const isLt2M = file.size / 1024 / 1024 < 9999
|
|
||||||
|
|
||||||
if (!isImage) {
|
|
||||||
this.$message.error('上传头像图片只能是 JPG 格式!')
|
|
||||||
}
|
|
||||||
if (!isLt2M) {
|
|
||||||
this.$message.error('上传头像图片大小不能超过 2MB!')
|
|
||||||
}
|
|
||||||
return isImage && isLt2M
|
|
||||||
},
|
|
||||||
addUploadRemoveFile (file, fileList) {
|
|
||||||
this.$refs.addUpload.clearFiles()
|
|
||||||
this.addDataFrom.imageUrl = ''
|
|
||||||
},
|
|
||||||
showView (file) {
|
|
||||||
this.previewImg = file.url
|
|
||||||
this.dialogVisibleImg = true
|
|
||||||
},
|
|
||||||
// 获取当前管理员信息
|
|
||||||
getUserInfo () {
|
|
||||||
this.$http.get('/sys/user/info').then(({ data: res }) => {
|
|
||||||
this.dataForm.deptId = res.data.deptId
|
|
||||||
this.deptId = res.data.deptId
|
|
||||||
console.log('depid', this.dataForm)
|
|
||||||
})
|
|
||||||
},
|
|
||||||
guanbi () {
|
|
||||||
this.dataForm = {
|
|
||||||
id: '',
|
|
||||||
deptId: '',
|
|
||||||
deptContacts: '',
|
|
||||||
deptPhone: '',
|
|
||||||
dataVolume: '',
|
|
||||||
shareCondition: '',
|
|
||||||
shareType: '',
|
|
||||||
shareMode: '',
|
|
||||||
delFlag: 0,
|
|
||||||
description: '',
|
|
||||||
downloads: 0,
|
|
||||||
image: '',
|
|
||||||
showList: [],
|
|
||||||
infoList: [],
|
|
||||||
link: '',
|
|
||||||
name: '',
|
|
||||||
note1: '',
|
|
||||||
note2: '',
|
|
||||||
note3: '',
|
|
||||||
note4: '',
|
|
||||||
note5: '',
|
|
||||||
score: '',
|
|
||||||
type: '应用资源',
|
|
||||||
apiMethodType: '',
|
|
||||||
apiUrl: '',
|
|
||||||
visits: 0
|
|
||||||
}
|
|
||||||
},
|
|
||||||
handleRemove (file, fileList) {
|
|
||||||
console.log(file, fileList)
|
|
||||||
},
|
|
||||||
handlePictureCardPreview (file) {
|
|
||||||
this.dialogImageUrl = file.url
|
|
||||||
this.dialogVisible = true
|
|
||||||
},
|
|
||||||
// 上传图片之前
|
|
||||||
uploadBeforeUploadHandle (file) {
|
|
||||||
if (
|
|
||||||
file.type !== 'image/jpg' &&
|
|
||||||
file.type !== 'image/jpeg' &&
|
|
||||||
file.type !== 'image/png' &&
|
|
||||||
file.type !== 'image/gif'
|
|
||||||
) {
|
|
||||||
this.$message.error('只支持jpg、png、gif格式的图片！')
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
imgUploadSuccess (res, file, fileList) {
|
|
||||||
console.log('zzzzzzz', res, file, fileList)
|
|
||||||
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error(res.msg)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
init () {
|
|
||||||
this.getInfoList()
|
|
||||||
this.visible = true
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.$refs.dataForm && this.$refs.dataForm.resetFields()
|
|
||||||
this.iconList = getIconList()
|
|
||||||
if (this.dataForm.id) {
|
|
||||||
this.getInfo()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// 获取属性信息
|
|
||||||
getInfoList () {
|
|
||||||
const parms = {
|
|
||||||
topCategoryName: '应用资源'
|
|
||||||
}
|
|
||||||
this.infoList2 = []
|
|
||||||
this.$http
|
|
||||||
.get('/category/getAllFiledByTopCategory' + '?' + qs.stringify(parms))
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error(res.msg)
|
|
||||||
}
|
|
||||||
res.data.map((item, index) => {
|
|
||||||
if (
|
|
||||||
item.name.search('应用名称') == -1 &&
|
|
||||||
item.name.search('地址') == -1 &&
|
|
||||||
// item.name.search("描述") == -1 &&
|
|
||||||
item.name !== '组件描述' &&
|
|
||||||
item.name !== '组件名称' &&
|
|
||||||
item.name !== '服务接口' &&
|
|
||||||
item.name !== '共享类型' &&
|
|
||||||
item.name !== '共享条件' &&
|
|
||||||
item.name !== '共享方式' &&
|
|
||||||
item.name !== '部门联系人电话' &&
|
|
||||||
item.name !== '部门统一社会代码' &&
|
|
||||||
item.name !== '部门联系人' &&
|
|
||||||
item.name !== '服务商统一社会信用代码' &&
|
|
||||||
item.name !== '服务接口请求方式' &&
|
|
||||||
item.name !== '部门名称'
|
|
||||||
) {
|
|
||||||
const duixiang = {
|
|
||||||
attrType: item.name,
|
|
||||||
attrValue: '',
|
|
||||||
delFlag: 0
|
|
||||||
}
|
|
||||||
this.infoList2.push(item)
|
|
||||||
if (item.isLinkToDic != 'false') {
|
|
||||||
const xinxi = {
|
|
||||||
page: 1,
|
|
||||||
limit: 99,
|
|
||||||
dictTypeId: item.linkValue,
|
|
||||||
dictLabel: '',
|
|
||||||
dictValue: ''
|
|
||||||
}
|
|
||||||
this.$http
|
|
||||||
.get('/sys/dict/data/page' + '?' + qs.stringify(xinxi))
|
|
||||||
.then(({ data: res2 }) => {
|
|
||||||
// this.infoList2[index - 1].children = res2.data.list
|
|
||||||
this.infoList2.map((item3, index3) => {
|
|
||||||
if (item3.name == item.name) {
|
|
||||||
Vue.set(
|
|
||||||
this.infoList2[index3],
|
|
||||||
'children',
|
|
||||||
res2.data.list
|
|
||||||
)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.dataFormUpdate.infoList.map((item3, index3) => {
|
|
||||||
if (item3.attrType == item.name) {
|
|
||||||
Vue.set(
|
|
||||||
this.dataFormUpdate.infoList[index3],
|
|
||||||
'children',
|
|
||||||
res2.data.list
|
|
||||||
)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
console.log(
|
|
||||||
'11111111111111111111111111110',
|
|
||||||
this.dataFormUpdate
|
|
||||||
)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
this.dataForm.infoList.push(duixiang)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
console.log('this.infoList', this.dataFormUpdate)
|
|
||||||
})
|
|
||||||
.catch(() => {})
|
|
||||||
this.$http
|
|
||||||
.get('/sys/dict/data/page' + '?' + qs.stringify(parms))
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error(res.msg)
|
|
||||||
}
|
|
||||||
console.log('this.infoList', this.dataForm)
|
|
||||||
})
|
|
||||||
.catch(() => {})
|
|
||||||
},
|
|
||||||
// 图标, 选中
|
|
||||||
iconListCurrentChangeHandle (icon) {
|
|
||||||
this.dataForm.imgurl = icon
|
|
||||||
this.iconListVisible = false
|
|
||||||
},
|
|
||||||
// 上级菜单树, 选中
|
|
||||||
menuListTreeCurrentChangeHandle (data) {
|
|
||||||
this.dataForm.pid = data.id
|
|
||||||
this.dataForm.type = data.name
|
|
||||||
this.menuListVisible = false
|
|
||||||
},
|
|
||||||
// 上级菜单树, 设置默认值
|
|
||||||
deptListTreeSetDefaultHandle () {
|
|
||||||
this.dataForm.pid = '0'
|
|
||||||
this.dataForm.type = '目录级别'
|
|
||||||
},
|
|
||||||
// 获取信息
|
|
||||||
getInfo () {
|
|
||||||
this.$http
|
|
||||||
.get('/ability/bsabilityai/' + this.dataForm.id)
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error(res.msg)
|
|
||||||
}
|
|
||||||
this.dataForm = {
|
|
||||||
...this.dataForm,
|
|
||||||
...res.data
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(() => {})
|
|
||||||
},
|
|
||||||
// 表单提交
|
|
||||||
dataFormSubmitHandle: debounce(
|
|
||||||
function () {
|
|
||||||
this.$refs.dataForm.validate((valid) => {
|
|
||||||
this.getUserInfo()
|
|
||||||
this.dataForm.deptId = this.deptId
|
|
||||||
if (!valid) {
|
|
||||||
this.$message.error('请检查表单是否填写完整')
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
console.log('表单数据=======================》', this.dataForm)
|
|
||||||
if (!this.UpdateState) {
|
|
||||||
this.dataForm.infoList = []
|
|
||||||
this.dataForm.showListAll.forEach(val => {
|
|
||||||
if (val.name !== '必填信息') {
|
|
||||||
if (val.name === '服务接口信息') {
|
|
||||||
val.children.forEach(item => {
|
|
||||||
if (item.name === '服务接口') {
|
|
||||||
this.dataForm.apiUrl = item.note1
|
|
||||||
}
|
|
||||||
if (item.name === '接口请求方式') {
|
|
||||||
this.dataForm.apiMethodType = item.note1
|
|
||||||
}
|
|
||||||
if (item.name === '访问地址') {
|
|
||||||
this.dataForm.link = item.note1
|
|
||||||
}
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
val.children.forEach(item => {
|
|
||||||
this.dataForm.infoList.push({
|
|
||||||
attrType: item.name,
|
|
||||||
attrValue: item.note1,
|
|
||||||
delFlag: 0
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http
|
|
||||||
.post('/resource/insert?source= b', this.dataForm)
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error(res.msg)
|
|
||||||
}
|
|
||||||
this.$message({
|
|
||||||
message: this.$t('prompt.success'),
|
|
||||||
type: 'success',
|
|
||||||
duration: 500,
|
|
||||||
onClose: () => {
|
|
||||||
this.visible = false
|
|
||||||
this.$emit('refreshDataList')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.catch(() => {})
|
|
||||||
} else {
|
|
||||||
this.$http
|
|
||||||
.put('/resource/update', this.dataFormUpdate)
|
|
||||||
.then(({ data: res }) => {
|
|
||||||
if (res.code !== 0) {
|
|
||||||
return this.$message.error(res.msg)
|
|
||||||
}
|
|
||||||
this.$message({
|
|
||||||
message: this.$t('prompt.success'),
|
|
||||||
type: 'success',
|
|
||||||
duration: 500,
|
|
||||||
onClose: () => {
|
|
||||||
this.visible = false
|
|
||||||
this.$emit('refreshDataList')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.catch(() => {})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
1000,
|
|
||||||
{ leading: true, trailing: false }
|
|
||||||
),
|
|
||||||
showListChagne () {
|
|
||||||
this.dataForm.showList = this.dataForm.showListAll.filter(item => this.checkList.indexOf(item.name) > -1)
|
|
||||||
console.log('属性变更===================>', this.checkList, this.dataForm.showList, this.dataForm.showListAll)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted () {
|
|
||||||
this.getUserInfo()
|
|
||||||
},
|
|
||||||
beforeDestroy () {
|
|
||||||
console.log('销毁~~~~~~~~~~~~~~~~~~~~')
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
::v-deep .el-dialog__body {
|
|
||||||
height: 580px;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
.icon-input ::v-deep .el-input__inner {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.detial-form ::v-deep {
|
|
||||||
.el-form-item {
|
|
||||||
margin-bottom: 0px;
|
|
||||||
line-height: 32px;
|
|
||||||
}
|
|
||||||
.el-form-item__label {
|
|
||||||
line-height: 32px;
|
|
||||||
}
|
|
||||||
.el-form-item__content {
|
|
||||||
line-height: 32px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
::v-deep .el-checkbox-button__inner {
|
|
||||||
width: 130px;
|
|
||||||
margin: 0 10px 5px;
|
|
||||||
border-left: unset !important;
|
|
||||||
border-radius: unset !important;
|
|
||||||
border: 1px solid #dcdfe6 !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.mod-sys__menu {
|
|
||||||
.menu-list,
|
|
||||||
.icon-list {
|
|
||||||
.el-input__inner,
|
|
||||||
.el-input__suffix {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&-icon-popover {
|
|
||||||
width: 458px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
&-icon-inner {
|
|
||||||
width: 478px;
|
|
||||||
max-height: 258px;
|
|
||||||
overflow-x: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
&-icon-list {
|
|
||||||
width: 458px;
|
|
||||||
padding: 0;
|
|
||||||
margin: -8px 0 0 -8px;
|
|
||||||
> .el-button {
|
|
||||||
padding: 8px;
|
|
||||||
margin: 8px 0 0 8px;
|
|
||||||
> span {
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 18px;
|
|
||||||
height: 18px;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.previewImg {
|
|
||||||
position: fixed;
|
|
||||||
z-index: 9999;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -0,0 +1,515 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-dialog
|
||||||
|
:visible.sync="visible"
|
||||||
|
:title="disabled ? '能力展示' : '挂接'"
|
||||||
|
@close="guanbi"
|
||||||
|
:close-on-click-modal="false"
|
||||||
|
:close-on-press-escape="false"
|
||||||
|
>
|
||||||
|
<!-- 挂载和修改-->
|
||||||
|
<div key="1" v-if="!disabled">
|
||||||
|
<!-- 挂接 -->
|
||||||
|
<el-form v-if="!UpdateState" ref="dataForm" :model="dataForm">
|
||||||
|
<el-form-item
|
||||||
|
v-for="(item, index) in dataList"
|
||||||
|
:key="index"
|
||||||
|
:label="item.attrType"
|
||||||
|
>
|
||||||
|
<el-input
|
||||||
|
v-model="dataForm.name"
|
||||||
|
v-if="item.type == 'name'"
|
||||||
|
></el-input>
|
||||||
|
<el-input
|
||||||
|
v-model="dataForm.apiUrl"
|
||||||
|
v-if="item.type == 'link'"
|
||||||
|
></el-input>
|
||||||
|
<el-input
|
||||||
|
type="textarea"
|
||||||
|
v-model="item.attrValue"
|
||||||
|
v-if="item.type == 'textarea'"
|
||||||
|
></el-input>
|
||||||
|
<el-select
|
||||||
|
v-if="item.type == 'select'"
|
||||||
|
v-model="item.attrValue"
|
||||||
|
placeholder="请选择活动区域"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
:label="itemSelect"
|
||||||
|
v-for="(itemSelect, indexSelect) in item.children"
|
||||||
|
:key="indexSelect"
|
||||||
|
:value="itemSelect"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
|
||||||
|
<upload
|
||||||
|
:child="dataForm"
|
||||||
|
limit="1"
|
||||||
|
accept=".jpg,.png"
|
||||||
|
v-if="item.type == 'photo'"
|
||||||
|
></upload>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<!-- 修改 -->
|
||||||
|
<el-form
|
||||||
|
v-else
|
||||||
|
:model="dataFormUpdate"
|
||||||
|
ref="dataForm"
|
||||||
|
@keyup.enter.native="dataFormSubmitHandle()"
|
||||||
|
>
|
||||||
|
<el-form-item label="场景名称">
|
||||||
|
<el-input
|
||||||
|
v-model="dataFormUpdate.name"
|
||||||
|
placeholder="场景名称"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="场景url">
|
||||||
|
<el-input
|
||||||
|
v-model="dataFormUpdate.apiUrl"
|
||||||
|
placeholder="场景url"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item
|
||||||
|
v-for="item in dataFormUpdate.infoList"
|
||||||
|
:key="item.index"
|
||||||
|
:label="item.attrType"
|
||||||
|
>
|
||||||
|
<el-input
|
||||||
|
v-model="item.attrValue"
|
||||||
|
:placeholder="item.attrType"
|
||||||
|
v-if="item.attrType != '应用领域'"
|
||||||
|
></el-input>
|
||||||
|
<el-select
|
||||||
|
v-else
|
||||||
|
v-model="item.attrValue"
|
||||||
|
:placeholder="item.attrType"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
:value="item2"
|
||||||
|
v-for="(item2, index2) in dataList[2].children"
|
||||||
|
:key="index2"
|
||||||
|
:label="item2"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<!-- 展示 -->
|
||||||
|
<el-form key="2" class="detial-form" v-else>
|
||||||
|
<el-form-item label="场景名称" prop="name">
|
||||||
|
{{ dataFormShowDetails.name || "--" }}
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="场景url" prop="name">
|
||||||
|
{{ dataFormShowDetails.apiUrl || "--" }}
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item
|
||||||
|
v-for="item in dataFormShowDetails.infoList"
|
||||||
|
:key="item.index"
|
||||||
|
:label="item.attrType"
|
||||||
|
:prop="item.attrValue"
|
||||||
|
>
|
||||||
|
{{ item.attrValue || "--" }}
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<template slot="footer" v-if="true">
|
||||||
|
<el-button @click="visible = false">{{ $t("cancel") }}</el-button>
|
||||||
|
<el-button type="primary" @click="dataFormSubmitHandle()">{{
|
||||||
|
$t("confirm")
|
||||||
|
}}</el-button>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
<div>
|
||||||
|
<el-dialog :visible.sync="dialogVisibleImg">
|
||||||
|
<img width="100%" :src="previewImg" />
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import debounce from "lodash/debounce";
|
||||||
|
import dictionaries from "@/utils/dictionaries";
|
||||||
|
import { mapState } from "vuex";
|
||||||
|
import { getIconList } from "@/utils";
|
||||||
|
import Cookies from "js-cookie";
|
||||||
|
import upload from "./upload.vue";
|
||||||
|
import qs from "qs";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
upload,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
checkList: [],
|
||||||
|
dialogVisibleImg: false,
|
||||||
|
previewImg: "", // 预览图片
|
||||||
|
dialogVisible: false,
|
||||||
|
fileUploadUrl: window.SITE_CONFIG.apiURL + "/upload",
|
||||||
|
uploadUrl:
|
||||||
|
window.SITE_CONFIG.apiURL +
|
||||||
|
"/sys/oss/upload?token=" +
|
||||||
|
Cookies.get("ucsToken"),
|
||||||
|
companyArr: dictionaries.companyArr,
|
||||||
|
visible: false,
|
||||||
|
sceneArr: dictionaries.sceneArr,
|
||||||
|
fieldArr: dictionaries.fieldArr,
|
||||||
|
shareFormArr: dictionaries.shareFormArr,
|
||||||
|
shareTypeArr: dictionaries.shareTypeArr,
|
||||||
|
iconList: [],
|
||||||
|
iconListVisible: false,
|
||||||
|
UpdateState: false,
|
||||||
|
dataForm: {
|
||||||
|
id: "",
|
||||||
|
deptId: "",
|
||||||
|
deptContacts: "",
|
||||||
|
deptPhone: "",
|
||||||
|
dataVolume: "",
|
||||||
|
shareCondition: "",
|
||||||
|
shareType: "",
|
||||||
|
shareMode: "",
|
||||||
|
delFlag: 0,
|
||||||
|
description: "",
|
||||||
|
downloads: 0,
|
||||||
|
image: "",
|
||||||
|
infoList: [],
|
||||||
|
link: "",
|
||||||
|
name: "",
|
||||||
|
note1: "",
|
||||||
|
note2: "",
|
||||||
|
note3: "",
|
||||||
|
note4: "",
|
||||||
|
note5: "",
|
||||||
|
score: "",
|
||||||
|
type: "赋能案例",
|
||||||
|
apiMethodType: "",
|
||||||
|
apiUrl: "",
|
||||||
|
visits: 0,
|
||||||
|
},
|
||||||
|
deptId: "",
|
||||||
|
fangwendizhi: "",
|
||||||
|
mingzi: "",
|
||||||
|
dataFormUpdate: {},
|
||||||
|
dataFormShowDetails: {},
|
||||||
|
infoList2: [],
|
||||||
|
infoList3: [],
|
||||||
|
dataList: [
|
||||||
|
{ attrType: "场景名称", attrValue: "", type: "name" },
|
||||||
|
{
|
||||||
|
attrType: "图片",
|
||||||
|
attrValue: "",
|
||||||
|
type: "photo",
|
||||||
|
child: { node1: "" },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
attrType: "应用领域",
|
||||||
|
attrValue: "",
|
||||||
|
type: "select",
|
||||||
|
children: [],
|
||||||
|
},
|
||||||
|
{ attrType: "场景url", attrValue: "", type: "link" },
|
||||||
|
{ attrType: "案例背景", attrValue: "", type: "textarea" },
|
||||||
|
{ attrType: "业务挑战", attrValue: "", type: "textarea" },
|
||||||
|
{ attrType: "解决方案", attrValue: "", type: "textarea" },
|
||||||
|
{ attrType: "案例成效", attrValue: "", type: "textarea" },
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取当前管理员信息
|
||||||
|
getUserInfo() {
|
||||||
|
this.$http.get("/sys/user/info").then(({ data: res }) => {
|
||||||
|
this.dataForm.deptId = res.data.deptId;
|
||||||
|
this.deptId = res.data.deptId;
|
||||||
|
console.log("depid", this.dataForm);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleRemove(file, fileList) {
|
||||||
|
console.log(file, fileList);
|
||||||
|
},
|
||||||
|
handlePictureCardPreview(file) {
|
||||||
|
this.dialogImageUrl = file.url;
|
||||||
|
this.dialogVisible = true;
|
||||||
|
},
|
||||||
|
// 上传图片之前
|
||||||
|
uploadBeforeUploadHandle(file) {
|
||||||
|
if (
|
||||||
|
file.type !== "image/jpg" &&
|
||||||
|
file.type !== "image/jpeg" &&
|
||||||
|
file.type !== "image/png" &&
|
||||||
|
file.type !== "image/gif"
|
||||||
|
) {
|
||||||
|
this.$message.error("只支持jpg、png、gif格式的图片！");
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
imgUploadSuccess(res, file, fileList) {
|
||||||
|
console.log("zzzzzzz", res, file, fileList);
|
||||||
|
|
||||||
|
if (res.code !== 0) {
|
||||||
|
return this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
init() {
|
||||||
|
this.visible = true;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.dataForm && this.$refs.dataForm.resetFields();
|
||||||
|
this.iconList = getIconList();
|
||||||
|
if (this.dataForm.id) {
|
||||||
|
this.getInfo();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 图标, 选中
|
||||||
|
iconListCurrentChangeHandle(icon) {
|
||||||
|
this.dataForm.imgurl = icon;
|
||||||
|
this.iconListVisible = false;
|
||||||
|
},
|
||||||
|
// 获取信息
|
||||||
|
getInfo() {
|
||||||
|
const params = {
|
||||||
|
page: 1,
|
||||||
|
limit: 99,
|
||||||
|
dictTypeId: "1513712507692818433",
|
||||||
|
};
|
||||||
|
debugger;
|
||||||
|
this.$http
|
||||||
|
.get("/sys/dict/data/page" + "?" + qs.stringify(params))
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
res.data.list.map((item) => {
|
||||||
|
this.dataList[2].children.push(item.dictLabel);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 表单提交
|
||||||
|
dataFormSubmitHandle: debounce(
|
||||||
|
function () {
|
||||||
|
this.$refs.dataForm.validate((valid) => {
|
||||||
|
this.getUserInfo();
|
||||||
|
this.dataForm.deptId = this.deptId;
|
||||||
|
console.log("表单数据=======================》", this.dataForm);
|
||||||
|
if (!this.UpdateState) {
|
||||||
|
this.dataList.map((item) => {
|
||||||
|
if (item.attrType != "场景名称" && item.attrType != "场景url") {
|
||||||
|
if (item.attrType == "图片" && this.dataForm.note1) {
|
||||||
|
const params = {
|
||||||
|
attrType: item.attrType,
|
||||||
|
attrValue: this.dataForm.note1,
|
||||||
|
delFlag: 0,
|
||||||
|
};
|
||||||
|
this.dataForm.infoList.push(params);
|
||||||
|
} else if (item.attrType != "图片" && item.attrValue) {
|
||||||
|
const params = {
|
||||||
|
attrType: item.attrType,
|
||||||
|
attrValue: item.attrValue,
|
||||||
|
delFlag: 0,
|
||||||
|
};
|
||||||
|
this.dataForm.infoList.push(params);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.$http
|
||||||
|
.post("/resource/insert?source= b", this.dataForm)
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
if (res.code !== 0) {
|
||||||
|
return this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
this.$message({
|
||||||
|
message: this.$t("prompt.success"),
|
||||||
|
type: "success",
|
||||||
|
duration: 500,
|
||||||
|
onClose: () => {
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit("refreshDataList");
|
||||||
|
},
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => {});
|
||||||
|
} else {
|
||||||
|
this.$http
|
||||||
|
.put("/resource/update", this.dataFormUpdate)
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
if (res.code !== 0) {
|
||||||
|
return this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
this.$message({
|
||||||
|
message: this.$t("prompt.success"),
|
||||||
|
type: "success",
|
||||||
|
duration: 500,
|
||||||
|
onClose: () => {
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit("refreshDataList");
|
||||||
|
},
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => {});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
1000,
|
||||||
|
{ leading: true, trailing: false }
|
||||||
|
),
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
visible: {
|
||||||
|
immediate: true,
|
||||||
|
deep: true,
|
||||||
|
handler() {
|
||||||
|
this.dataForm = {
|
||||||
|
id: "",
|
||||||
|
deptId: "",
|
||||||
|
deptContacts: "",
|
||||||
|
deptPhone: "",
|
||||||
|
dataVolume: "",
|
||||||
|
shareCondition: "",
|
||||||
|
shareType: "",
|
||||||
|
shareMode: "",
|
||||||
|
delFlag: 0,
|
||||||
|
description: "",
|
||||||
|
downloads: 0,
|
||||||
|
image: "",
|
||||||
|
infoList: [],
|
||||||
|
link: "",
|
||||||
|
name: "",
|
||||||
|
note1: "",
|
||||||
|
note2: "",
|
||||||
|
note3: "",
|
||||||
|
note4: "",
|
||||||
|
note5: "",
|
||||||
|
score: "",
|
||||||
|
type: "赋能案例",
|
||||||
|
apiMethodType: "",
|
||||||
|
apiUrl: "",
|
||||||
|
visits: 0,
|
||||||
|
};
|
||||||
|
this.dataList = [
|
||||||
|
{ attrType: "场景名称", attrValue: "", type: "name" },
|
||||||
|
{
|
||||||
|
attrType: "图片",
|
||||||
|
attrValue: "",
|
||||||
|
type: "photo",
|
||||||
|
child: { node1: "" },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
attrType: "应用领域",
|
||||||
|
attrValue: "",
|
||||||
|
type: "select",
|
||||||
|
children: [],
|
||||||
|
},
|
||||||
|
{ attrType: "场景url", attrValue: "", type: "link" },
|
||||||
|
{ attrType: "案例背景", attrValue: "", type: "textarea" },
|
||||||
|
{ attrType: "业务挑战", attrValue: "", type: "textarea" },
|
||||||
|
{ attrType: "解决方案", attrValue: "", type: "textarea" },
|
||||||
|
{ attrType: "案例成效", attrValue: "", type: "textarea" },
|
||||||
|
];
|
||||||
|
this.getInfo();
|
||||||
|
this.getUserInfo();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getInfo();
|
||||||
|
this.getUserInfo();
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
console.log("销毁~~~~~~~~~~~~~~~~~~~~");
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
::v-deep .el-form-item__content {
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__body {
|
||||||
|
height: 580px;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
.icon-input ::v-deep .el-input__inner {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
::v-deep .upload-demo {
|
||||||
|
width: 800px;
|
||||||
|
}
|
||||||
|
::v-deep .el-form-item {
|
||||||
|
margin-bottom: 30px;
|
||||||
|
width: 100%;
|
||||||
|
line-height: 32px;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
::v-deep .el-form-item__label {
|
||||||
|
line-height: 32px;
|
||||||
|
width: 120px;
|
||||||
|
margin-right: 20px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
::v-deep textarea {
|
||||||
|
width: 800px;
|
||||||
|
}
|
||||||
|
::v-deep .el-form-item__content {
|
||||||
|
line-height: 32px;
|
||||||
|
}
|
||||||
|
::v-deep .el-input {
|
||||||
|
width: 800px;
|
||||||
|
}
|
||||||
|
::v-deep .el-checkbox-button__inner {
|
||||||
|
width: 130px;
|
||||||
|
margin: 0 10px 5px;
|
||||||
|
border-left: unset !important;
|
||||||
|
border-radius: unset !important;
|
||||||
|
border: 1px solid #dcdfe6 !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.canassigncase-add-or-update {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.mod-sys__menu {
|
||||||
|
.menu-list,
|
||||||
|
.icon-list {
|
||||||
|
.el-input__inner,
|
||||||
|
.el-input__suffix {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-icon-popover {
|
||||||
|
width: 458px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
&-icon-inner {
|
||||||
|
width: 478px;
|
||||||
|
max-height: 258px;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
&-icon-list {
|
||||||
|
width: 458px;
|
||||||
|
padding: 0;
|
||||||
|
margin: -8px 0 0 -8px;
|
||||||
|
> .el-button {
|
||||||
|
padding: 8px;
|
||||||
|
margin: 8px 0 0 8px;
|
||||||
|
> span {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.submit-father {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
.previewImg {
|
||||||
|
position: fixed;
|
||||||
|
z-index: 9999;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -55,11 +55,16 @@
|
||||||
></el-table-column>
|
></el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
prop="name"
|
prop="name"
|
||||||
label="应用名称"
|
label="场景名称"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="apiUrl"
|
||||||
|
label="场景url"
|
||||||
header-align="center"
|
header-align="center"
|
||||||
align="center"
|
align="center"
|
||||||
></el-table-column>
|
></el-table-column>
|
||||||
|
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="(item, index) in dataList[0].infoList"
|
v-for="(item, index) in dataList[0].infoList"
|
||||||
:key="index"
|
:key="index"
|
||||||
|
|
@ -127,7 +132,7 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import mixinViewModule from "@/mixins/view-module";
|
import mixinViewModule from "@/mixins/view-module";
|
||||||
import AddOrUpdate from "./bsabilityservice-add-or-update";
|
import AddOrUpdate from "./canassigncase-add-or-update";
|
||||||
import dictionaries from "@/utils/dictionaries";
|
import dictionaries from "@/utils/dictionaries";
|
||||||
import qs from "qs";
|
import qs from "qs";
|
||||||
import { type } from "os";
|
import { type } from "os";
|
||||||
|
|
@ -151,7 +156,7 @@ export default {
|
||||||
creator: "",
|
creator: "",
|
||||||
selectType: 0,
|
selectType: 0,
|
||||||
delFlag: 0,
|
delFlag: 0,
|
||||||
type: "应用资源",
|
type: "赋能案例",
|
||||||
},
|
},
|
||||||
qp: false,
|
qp: false,
|
||||||
};
|
};
|
||||||
|
|
@ -162,7 +167,7 @@ export default {
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.dataForm.name = "";
|
this.dataForm.name = "";
|
||||||
this.dataForm.type = "应用资源";
|
this.dataForm.type = "赋能案例";
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
window.addEventListener("resize", this.a);
|
window.addEventListener("resize", this.a);
|
||||||
|
|
@ -183,7 +188,7 @@ export default {
|
||||||
limit: 10,
|
limit: 10,
|
||||||
delFlag: 0,
|
delFlag: 0,
|
||||||
creator: "",
|
creator: "",
|
||||||
type: "应用资源",
|
type: "赋能案例",
|
||||||
name: "",
|
name: "",
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
|
|
@ -246,7 +251,7 @@ export default {
|
||||||
// type: '组件服务',
|
// type: '组件服务',
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
pageSize: this.limit,
|
pageSize: this.limit,
|
||||||
type: "应用资源",
|
type: "赋能案例",
|
||||||
creator: "",
|
creator: "",
|
||||||
selectType: 0,
|
selectType: 0,
|
||||||
delFlag: 0,
|
delFlag: 0,
|
||||||
|
|
|
||||||
|
|
@ -3,12 +3,12 @@
|
||||||
<el-upload
|
<el-upload
|
||||||
ref="addUpload"
|
ref="addUpload"
|
||||||
class="upload-demo"
|
class="upload-demo"
|
||||||
:accept='accept'
|
:accept="accept"
|
||||||
:action="fileUploadUrl"
|
:action="fileUploadUrl"
|
||||||
:on-success="onSuccess"
|
:on-success="onSuccess"
|
||||||
:on-remove="onRemove"
|
:on-remove="onRemove"
|
||||||
:on-exceed='onExceed'
|
:on-exceed="onExceed"
|
||||||
:limit='limit'
|
:limit="limit"
|
||||||
:on-preview="onPreview"
|
:on-preview="onPreview"
|
||||||
list-type="text"
|
list-type="text"
|
||||||
>
|
>
|
||||||
|
|
@ -21,42 +21,40 @@
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
name: '',
|
name: "",
|
||||||
components: {
|
components: {},
|
||||||
|
|
||||||
},
|
|
||||||
props: {
|
props: {
|
||||||
child: {
|
child: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: () => {
|
default: () => {
|
||||||
return {}
|
return {};
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
limit: {
|
limit: {
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 1
|
default: 1,
|
||||||
},
|
},
|
||||||
accept: {
|
accept: {
|
||||||
type: String,
|
type: String,
|
||||||
default: '.jpg,.png'
|
default: ".jpg,.png",
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload'
|
fileUploadUrl: window.SITE_CONFIG.apiURL + "/upload",
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
onSuccess(res, file) {
|
onSuccess(res, file) {
|
||||||
console.log('limit', this.limit)
|
console.log("limit", this.limit);
|
||||||
console.log(res, file, this.child)
|
console.log(res, file, this.child);
|
||||||
if (res.code !== 0) {
|
if (res.code !== 0) {
|
||||||
return this.$message.error('上传图片失败')
|
return this.$message.error("上传图片失败");
|
||||||
}
|
}
|
||||||
if (this.child.note1 == '') {
|
if (this.child.note1 == "") {
|
||||||
this.child.note1 = res.data
|
this.child.note1 = res.data;
|
||||||
} else {
|
} else {
|
||||||
this.child.note1 += (';' + res.data)
|
this.child.note1 += ";" + res.data;
|
||||||
}
|
}
|
||||||
// this.dataForm.infoList.map((item, index) => {
|
// this.dataForm.infoList.map((item, index) => {
|
||||||
// if (item.attrType == '组件图片') {
|
// if (item.attrType == '组件图片') {
|
||||||
|
|
@ -72,33 +70,32 @@ export default {
|
||||||
onRemove(file, fileList) {
|
onRemove(file, fileList) {
|
||||||
// this.$refs.addUpload.clearFiles()
|
// this.$refs.addUpload.clearFiles()
|
||||||
// 通过;分割字符串
|
// 通过;分割字符串
|
||||||
const arr = this.child.note1.split(';')
|
const arr = this.child.note1.split(";");
|
||||||
fileList.forEach((item, index) => {
|
fileList.forEach((item, index) => {
|
||||||
if (item === file.response.data) {
|
if (item === file.response.data) {
|
||||||
fileList.splice(index, 1)
|
fileList.splice(index, 1);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
arr.forEach((item, index) => {
|
arr.forEach((item, index) => {
|
||||||
if (item === file.response.data) {
|
if (item === file.response.data) {
|
||||||
arr.splice(index, 1)
|
arr.splice(index, 1);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
if (arr.length == 0) {
|
if (arr.length == 0) {
|
||||||
this.child.note1 = ''
|
this.child.note1 = "";
|
||||||
} else {
|
} else {
|
||||||
this.child.note1 = arr.join(';')
|
this.child.note1 = arr.join(";");
|
||||||
}
|
}
|
||||||
console.log(this.child.note1)
|
console.log(this.child.note1);
|
||||||
},
|
},
|
||||||
onPreview(file) {
|
onPreview(file) {
|
||||||
console.log('点击预览===============>', file)
|
console.log("点击预览===============>", file);
|
||||||
window.open(file.response.data)
|
window.open(file.response.data);
|
||||||
},
|
},
|
||||||
onExceed(files, fileList) {
|
onExceed(files, fileList) {
|
||||||
this.$message.warning('当前附件数量已达上限，请先删除部分附件！')
|
this.$message.warning("当前附件数量已达上限，请先删除部分附件！");
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss' scoped>
|
<style lang="scss" scoped></style>
|
||||||
</style>
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue