赋能案例-后台管理系统
This commit is contained in:
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
|
||||
prop="name"
|
||||
label="应用名称"
|
||||
label="场景名称"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="apiUrl"
|
||||
label="场景url"
|
||||
header-align="center"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
|
||||
<el-table-column
|
||||
v-for="(item, index) in dataList[0].infoList"
|
||||
:key="index"
|
||||
|
@ -127,7 +132,7 @@
|
|||
|
||||
<script>
|
||||
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 qs from "qs";
|
||||
import { type } from "os";
|
||||
|
@ -151,7 +156,7 @@ export default {
|
|||
creator: "",
|
||||
selectType: 0,
|
||||
delFlag: 0,
|
||||
type: "应用资源",
|
||||
type: "赋能案例",
|
||||
},
|
||||
qp: false,
|
||||
};
|
||||
|
@ -162,7 +167,7 @@ export default {
|
|||
},
|
||||
created() {
|
||||
this.dataForm.name = "";
|
||||
this.dataForm.type = "应用资源";
|
||||
this.dataForm.type = "赋能案例";
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener("resize", this.a);
|
||||
|
@ -183,7 +188,7 @@ export default {
|
|||
limit: 10,
|
||||
delFlag: 0,
|
||||
creator: "",
|
||||
type: "应用资源",
|
||||
type: "赋能案例",
|
||||
name: "",
|
||||
})
|
||||
)
|
||||
|
@ -246,7 +251,7 @@ export default {
|
|||
// type: '组件服务',
|
||||
pageNum: 1,
|
||||
pageSize: this.limit,
|
||||
type: "应用资源",
|
||||
type: "赋能案例",
|
||||
creator: "",
|
||||
selectType: 0,
|
||||
delFlag: 0,
|
||||
|
|
|
@ -3,12 +3,12 @@
|
|||
<el-upload
|
||||
ref="addUpload"
|
||||
class="upload-demo"
|
||||
:accept='accept'
|
||||
:accept="accept"
|
||||
:action="fileUploadUrl"
|
||||
:on-success="onSuccess"
|
||||
:on-remove="onRemove"
|
||||
:on-exceed='onExceed'
|
||||
:limit='limit'
|
||||
:on-exceed="onExceed"
|
||||
:limit="limit"
|
||||
:on-preview="onPreview"
|
||||
list-type="text"
|
||||
>
|
||||
|
@ -21,42 +21,40 @@
|
|||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: '',
|
||||
components: {
|
||||
|
||||
},
|
||||
name: "",
|
||||
components: {},
|
||||
props: {
|
||||
child: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
return {};
|
||||
},
|
||||
},
|
||||
limit: {
|
||||
type: Number,
|
||||
default: 1
|
||||
default: 1,
|
||||
},
|
||||
accept: {
|
||||
type: String,
|
||||
default: '.jpg,.png'
|
||||
}
|
||||
default: ".jpg,.png",
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload'
|
||||
}
|
||||
fileUploadUrl: window.SITE_CONFIG.apiURL + "/upload",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onSuccess(res, file) {
|
||||
console.log('limit', this.limit)
|
||||
console.log(res, file, this.child)
|
||||
console.log("limit", this.limit);
|
||||
console.log(res, file, this.child);
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error('上传图片失败')
|
||||
return this.$message.error("上传图片失败");
|
||||
}
|
||||
if (this.child.note1 == '') {
|
||||
this.child.note1 = res.data
|
||||
if (this.child.note1 == "") {
|
||||
this.child.note1 = res.data;
|
||||
} else {
|
||||
this.child.note1 += (';' + res.data)
|
||||
this.child.note1 += ";" + res.data;
|
||||
}
|
||||
// this.dataForm.infoList.map((item, index) => {
|
||||
// if (item.attrType == '组件图片') {
|
||||
|
@ -72,33 +70,32 @@ export default {
|
|||
onRemove(file, fileList) {
|
||||
// this.$refs.addUpload.clearFiles()
|
||||
// 通过;分割字符串
|
||||
const arr = this.child.note1.split(';')
|
||||
const arr = this.child.note1.split(";");
|
||||
fileList.forEach((item, index) => {
|
||||
if (item === file.response.data) {
|
||||
fileList.splice(index, 1)
|
||||
fileList.splice(index, 1);
|
||||
}
|
||||
})
|
||||
});
|
||||
arr.forEach((item, index) => {
|
||||
if (item === file.response.data) {
|
||||
arr.splice(index, 1)
|
||||
arr.splice(index, 1);
|
||||
}
|
||||
})
|
||||
});
|
||||
if (arr.length == 0) {
|
||||
this.child.note1 = ''
|
||||
this.child.note1 = "";
|
||||
} else {
|
||||
this.child.note1 = arr.join(';')
|
||||
this.child.note1 = arr.join(";");
|
||||
}
|
||||
console.log(this.child.note1)
|
||||
console.log(this.child.note1);
|
||||
},
|
||||
onPreview(file) {
|
||||
console.log('点击预览===============>', file)
|
||||
window.open(file.response.data)
|
||||
console.log("点击预览===============>", file);
|
||||
window.open(file.response.data);
|
||||
},
|
||||
onExceed(files, fileList) {
|
||||
this.$message.warning('当前附件数量已达上限,请先删除部分附件!')
|
||||
}
|
||||
}
|
||||
}
|
||||
this.$message.warning("当前附件数量已达上限,请先删除部分附件!");
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang='scss' scoped>
|
||||
</style>
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
Loading…
Reference in New Issue