This commit is contained in:
851673013@qq.com 2022-06-21 16:59:31 +08:00
parent 7bc3912bb7
commit bec8226d8a
10 changed files with 1891 additions and 10 deletions

View File

@ -0,0 +1,980 @@
<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>

View File

@ -0,0 +1,322 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-ability__bsabilityai">
<el-form :inline="true" :model="dataForm">
<el-form-item>
<el-input
v-model="dataForm.name"
placeholder="名称"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getDataList2(dataForm.name)">{{
$t("query")
}}</el-button>
</el-form-item>
<el-form-item>
<el-button type="info" @click="exportHandle()">{{
$t("export")
}}</el-button>
</el-form-item>
<el-form-item>
<el-button
v-if="$hasPermission('ability:bsabilityai:save')"
type="primary"
@click="addOrUpdateHandleServe()"
>挂接</el-button
>
</el-form-item>
<el-form-item>
<el-button
v-if="$hasPermission('ability:bsabilityai:delete')"
type="danger"
@click="deleteHandle2()"
>{{ $t("deleteBatch") }}</el-button
>
</el-form-item>
<el-form-item>
<el-button @click="reset">重置</el-button>
</el-form-item>
</el-form>
<el-table
v-loading="dataListLoading"
:data="dataList"
border
@selection-change="dataListSelectionChangeHandle"
style="width: 100%"
:height="qp ? '810px' : '650px'"
>
<el-table-column
type="selection"
header-align="center"
align="center"
width="50"
></el-table-column>
<el-table-column
prop="name"
label="应用名称"
header-align="center"
align="center"
></el-table-column>
<el-table-column
v-for="(item, index) in dataList[0].infoList"
:key="index"
:label="item.attrType"
header-align="center"
align="center"
show-overflow-tooltip="true"
>
<template slot-scope="scope">
{{ findValue(scope.row.infoList, item.attrType) }}
</template>
</el-table-column>
<el-table-column
:label="$t('handle')"
fixed="right"
header-align="center"
align="center"
width="94"
right="0"
>
<template slot-scope="scope">
<el-button
v-if="$hasPermission('ability:bsabilityai:update')"
type="text"
size="small"
@click="UpdateHandle(scope.row)"
>{{ $t("update") }}</el-button
>
<el-button
v-if="$hasPermission('ability:bsabilityai:delete')"
type="text"
size="small"
@click="deleteHandle2(scope.row.id)"
>{{ $t("delete") }}</el-button
>
<el-button type="text" size="small" @click="showDetail(scope.row)"
>展示</el-button
>
<el-button type="text" size="small" @click="showDocument(scope.row)"
>开发文档</el-button
>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="page"
:page-sizes="[10, 20, 50, 100]"
:page-size="limit"
:total="Number(total)"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle"
>
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update
:disabled="disabled"
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@refreshDataList="getDataList"
></add-or-update>
</div>
</el-card>
</template>
<script>
import mixinViewModule from "@/mixins/view-module";
import AddOrUpdate from "./bsabilityservice-add-or-update";
import dictionaries from "@/utils/dictionaries";
import qs from "qs";
import { type } from "os";
export default {
mixins: [mixinViewModule],
data() {
return {
mixinViewModuleOptions: {
getDataListURL: "/resource/page",
getDataListIsPage: true,
exportURL: "/ability/bsabilityai/export",
deleteURL: "/resource/delete",
deleteIsBatch: true,
},
disabled: false,
sceneArr: dictionaries.sceneArr,
fieldArr: dictionaries.fieldArr,
shareFormArr: dictionaries.shareFormArr,
dataForm: {
name: "",
creator: "",
selectType: 0,
delFlag: 0,
type: "应用资源",
},
qp: false,
};
},
watch: {},
components: {
AddOrUpdate,
},
created() {
this.dataForm.name = "";
this.dataForm.type = "应用资源";
},
mounted() {
window.addEventListener("resize", this.a);
this.fullScreen();
},
methods: {
reset() {
this.$http
.get(
this.mixinViewModuleOptions.getDataListURL +
"?" +
qs.stringify({
// order: this.order,
// orderField: this.orderField,
// type: '',
page: 1,
selectType: 0,
limit: 10,
delFlag: 0,
creator: "",
type: "应用资源",
name: "",
})
)
.then(({ data: res }) => {
this.dataForm.name = "";
if (res.code !== 0) {
this.dataList = [];
this.total = 0;
return this.$message.error(res.msg);
}
this.dataList = this.mixinViewModuleOptions.getDataListIsPage
? res.data.list
: res.data;
this.total = this.mixinViewModuleOptions.getDataListIsPage
? res.data.total
: 0;
if (this.mixinViewModuleOptions.requestCallback) {
this.mixinViewModuleOptions.requestCallback(res.data);
}
this.dataListLoading = false;
})
.catch(() => {
this.dataListLoading = false;
});
},
showDetail(val) {
this.addOrUpdateVisible = true;
this.disabled = false;
this.$nextTick(() => {
this.$refs.addOrUpdate.UpdateState = false;
this.$refs.addOrUpdate.dataFormShowDetails = val;
this.$refs.addOrUpdate.init();
});
this.disabled = true;
},
showDocument(val) {
console.log(val);
window.open(
window.SITE_CONFIG.frontUrl + "?id=" + val.id + "&&type=" + val.type,
"_blank"
);
},
findValue(list, type) {
const found = list.find((item) => item.attrType === type);
if (found) {
return found.attrValue;
} else {
return "暂无数据";
}
},
getDataList2(names) {
if (names != null) {
this.$http
.get(
this.mixinViewModuleOptions.getDataListURL +
"?" +
qs.stringify({
// order: this.order,
// orderField: this.orderField,
// type: '',
pageNum: 1,
pageSize: this.limit,
type: "应用资源",
creator: "",
selectType: 0,
delFlag: 0,
name: names,
})
)
.then(({ data: res }) => {
if (res.code !== 0) {
this.dataList = [];
this.total = 0;
return this.$message.error(res.msg);
}
if (res.data.list.length !== 0) {
this.dataList = res.data.list;
this.total = this.mixinViewModuleOptions.getDataListIsPage
? res.data.total
: 0;
if (this.mixinViewModuleOptions.requestCallback) {
this.mixinViewModuleOptions.requestCallback(res.data);
}
this.dataListLoading = false;
} else {
this.$message.error("未查询到相关信息");
this.reset();
}
})
.catch(() => {
this.dataListLoading = false;
});
} else {
this.$message.error("查询不能输入为空");
}
},
fullScreen() {
if (window.outerHeight === screen.availHeight) {
if (window.outerWidth === screen.availWidth) {
console.log(
"全屏1",
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = false;
} else {
console.log(
"不是全屏2",
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = true;
}
} else {
console.log(
"不是全屏3",
window.outerHeight,
screen.availHeight,
window.outerWidth,
screen.availWidth
);
this.qp = true;
}
},
},
};
</script>
<style lang="scss" scoped>
.el-tooltip__popper {
max-width: 50%;
}
</style>

View File

@ -0,0 +1,104 @@
<template>
<div>
<el-upload
ref="addUpload"
class="upload-demo"
:accept='accept'
:action="fileUploadUrl"
:on-success="onSuccess"
:on-remove="onRemove"
:on-exceed='onExceed'
:limit='limit'
:on-preview="onPreview"
list-type="text"
>
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">
只能上传{{accept}}文件最多上传{{limit}}个附件
</div>
</el-upload>
</div>
</template>
<script>
export default {
name: '',
components: {
},
props: {
child: {
type: Object,
default: () => {
return {}
}
},
limit: {
type: Number,
default: 1
},
accept: {
type: String,
default: '.jpg,.png'
}
},
data () {
return {
fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload'
}
},
methods: {
onSuccess (res, file) {
console.log('limit', this.limit)
console.log(res, file, this.child)
if (res.code !== 0) {
return this.$message.error('上传图片失败')
}
if (this.child.note1 == '') {
this.child.note1 = res.data
} else {
this.child.note1 += (';' + res.data)
}
// 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])
// }
// })
},
onRemove (file, fileList) {
// this.$refs.addUpload.clearFiles()
// ;
const arr = this.child.note1.split(';')
fileList.forEach((item, index) => {
if (item === file.response.data) {
fileList.splice(index, 1)
}
})
arr.forEach((item, index) => {
if (item === file.response.data) {
arr.splice(index, 1)
}
})
if (arr.length == 0) {
this.child.note1 = ''
} else {
this.child.note1 = arr.join(';')
}
console.log(this.child.note1)
},
onPreview (file) {
console.log('点击预览===============>', file)
window.open(file.response.data)
},
onExceed (files, fileList) {
this.$message.warning('当前附件数量已达上限,请先删除部分附件!')
}
}
}
</script>
<style lang='scss' scoped>
</style>

View File

@ -78,6 +78,14 @@ export function scInsert(data) {
})
}
//
export function getBsList(params) {
return request({
url: '/resourceBrowse/page',
method: 'get',
params,
})
}
//
export function getScList(params) {
return request({
@ -86,7 +94,6 @@ export function getScList(params) {
params,
})
}
//
export function scDel(data) {
return request({
@ -95,6 +102,14 @@ export function scDel(data) {
data,
})
}
//
export function BsDel(data) {
return request({
url: '/resourceBrowse/delete',
method: 'delete',
data,
})
}
//
export function wodepage(params) {
return request({

View File

@ -277,7 +277,6 @@
let params = {
type: name,
}
debugger
componentServiceRank(params).then((res) => {
dataList.value = res.data.data
console.log('res', dataList.value)
@ -530,12 +529,19 @@
border: 0.01rem rgba(0, 108, 188, 0.7) solid;
color: rgba(255, 255, 255, 0.8);
& > div {
height: 0.32rem;
& > span {
display: inline-block;
height: 0.32rem;
line-height: 0.32rem;
border-right: 0.01rem rgba(0, 108, 188, 0.7) solid;
border-bottom: 0.01rem rgba(0, 108, 188, 0.7) solid;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
word-break: break-all;
}
& > span:first-child {
width: 0.47rem;

View File

@ -63,7 +63,6 @@
})
}
}
const onTrial = ref('http://localhost:8080/#/details?id=1522550194535735298')
//
const copyFunction = (data, name) => {
let url = data

View File

@ -372,6 +372,13 @@
}
}
}
:deep(.ant-list-item-meta-title) {
display: flex;
justify-content: space-between;
span {
margin-right: 0.3rem;
}
}
.ant-list::-webkit-scrollbar {
width: 0 !important;
}

View File

@ -0,0 +1,447 @@
<template>
<div class="title">我的浏览</div>
<div class="sousuokuang">
<a-input-search
v-model:value="name"
placeholder="请输入关键词"
enter-button="搜索"
size="large"
@change="onSearch"
@search="getList"
/>
<a-button
type="primary"
style="width: 80px; height: 36px; margin-left: 10px"
@click="clean"
>
重置
</a-button>
</div>
<div class="tab">
<span>筛选</span>
<div
:class="tabIndex == index ? 'tabclass' : ' '"
@click="changeTab(index)"
v-for="(item, index) in tabList"
:key="index"
>
{{ item }}
</div>
</div>
<a-list
class="demo-loadmore-list"
:loading="initLoading"
item-layout="horizontal"
:data-source="list"
:key="showKey"
>
<template #renderItem="{ item }">
<a-list-item>
<a-skeleton avatar :title="false" :loading="!!item.loading" active>
<a-list-item-meta
:description="item.description || '--'"
style="position: relative"
>
<template #title>
<span
@click="showItem(item.resourceId, item.type, item.delFlag)"
style="cursor: pointer"
class="name"
>
{{ item.name }}
</span>
<span class="time">浏览时间{{ item.createDate }}</span>
<svg
t="1652233950228"
class="icon"
viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="5970"
data-spm-anchor-id="a313x.7781069.0.i8"
width="50"
height="50"
v-if="item.delFlag == 4 || item.delFlag == 5"
style="position: absolute; top: 0; left: 100px"
>
<path
d="M955.22053 256C813.82053 11.2 500.72053-72.6 255.92053 68.8S-72.67947 523.2 68.72053 768 523.22053 1096.6 768.02053 955.2c244.7-141.2 328.6-454.1 187.4-698.8 0-0.1-0.1-0.3-0.2-0.4zM762.02053 944.7c-239 138.1-544.8 56.2-682.9-182.8S22.92053 217.1 261.92053 79.1s544.8-56.2 682.9 182.8c137.9 239 56.1 544.6-182.8 682.8z"
fill="#515151"
opacity=".5"
p-id="5971"
></path>
<path
d="M898.12053 289.2C775.02053 76 502.42053 2.9 289.22053 126 76.02053 249.1 3.02053 521.6 126.02053 734.8 249.12053 948 521.62053 1021.1 734.82053 898 947.92053 774.9 1021.02053 502.4 898.12053 289.2zM731.62053 892.8C521.32053 1014.3 252.42053 942.2 131.02053 731.9 9.52053 521.6 81.62053 252.7 291.92053 131.3 502.12053 9.9 771.02053 81.8 892.42053 292c121.5 210.3 49.5 479.3-160.8 600.8z"
fill="#515151"
opacity=".5"
p-id="5972"
></path>
<path
d="M323.62053 176.8c3.6-2 6 0.8 8.8 2.8 6 4.4 12.4 8.8 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 13.6-5.6 20.8 4.8 6 10 11.6 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.4 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.4-1.9-3.9-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.7-0.8-0.3-1.6 0.6-2zM200.72053 289.2c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 13.6-5.6 20.8 4.8 6 10 11.6 14.8 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.4-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5c-8.4-2-16.8-4.4-25.2-6.4-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 3.6-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.4-1.2 0-1.6 0.8-2.4l0.2 0.4z m276.6-159.6c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 14-5.6 20.8 4.8 6 10 12 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.8-1.2-0.4-1.6 0.4-2.4l0.2 0.4z m141.9 29.6c3.6-2 6 0.8 8.8 2.8l18.8 12.8c7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 14-5.6 20.8 4.8 6 10 12 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4-7.7 0.4-15.2 0.8-22.4 0.8-4.4 6.8-8.4 13.2-12.8 20-1.6 2.4-4 5.1-7.2 4-2.4-1.9-3.9-4.7-4.4-7.7l-7.2-20.5c-8.4-2-16.8-4.4-25.2-6.4-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.5-1.2 0.2-1.6 0.6-2zM150.02053 430c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-4 14-5.6 20.8 4.8 6 10 11.6 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 3.6-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.7-0.8-0.3-1.5 0.6-2z m558.9 414.4c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.1 4.4-0.7 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.5-1.1 0.8-1.1 1.6-1.1h0.1z m-158.8 50c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.1-3.7-5.6-3.6-7.7-4-6.8-1.6-14-3.6-20.8-5.6l-7.7-22c-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2-1 4.2-1.7 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.4-0.8 0.8-0.8 1.7-0.7z m276.5-159.6c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8s-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.2 4.4-0.7 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0-0.8 0.8-1.2 1.6-1.2l0.1 0.1z m45.6-137.6c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-1.6-14-3.6-20.8-5.6l-7.7-22c-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.2-0.7 0.6-0.7 1.4-0.7h0.3zM402.72053 868c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.5-0.8 1-1.1 1.7-1.1z"
fill="#515151"
opacity=".5"
p-id="5973"
></path>
<path
d="M386.42053 590.4l-43.8-75.9L207.02053 592.7l10.2 17.7L334.02053 543l23.4 40.4-90.5 52.2-13.5-23.4-18.7 10.8 53.1 92c9.1 15.8 21.2 19.5 36.4 10.7l98.8-57c6.2-3.6 11-9.3 13.4-16.1-1.4-15.9-6.2-31.2-14.2-45l-21.4 4.8c6.7 10.3 11 21.9 12.8 34-1 3.3-3.2 6-6.1 7.8l-88.3 51c-6.2 3.6-11.1 2.1-14.8-4.3l-27.3-47.4 109.3-63.1z m2.9-103.2l10.4 18.1 65.6-37.9 79.9 138.4 18.6-10.8-55.9-96.9c18.8-0.9 43.2-0.6 73 0.7l1.5-23.1c-29.8-0.3-58.4 0.4-86 2.6l-12.5-21.6 74.9-43.2-10.4-18.1-159.1 91.8zM669.52053 329l38.2 66.2 61.4-35.4-38.1-66.1-61.5 35.3z m72.4 24.2l-26.3 15.2-19-33 26.3-15.2 19 33zM599.02053 356.7l7.9 13.7-23.3 13.5 9.8 17 21.8-12.6c7.5 18.7 6.6 39.6-2.5 57.6l20.7 4.4c10.3-23.1 10.3-49.4 0-72.5l18.8-10.9c6 9.2 10.7 19.2 14.2 29.7 0.3 5-2.6 9.7-7.2 11.7-2.9 1.2-6.4 2.8-10.9 4.9l14.1 14.1c3.7-1.3 7.3-2.9 10.7-4.8 8.6-3.9 14.4-12.2 15.2-21.6-5.4-22.1-14.6-43-27.4-61.8l-36.1 20.8-7.9-13.7-17.9 10.5z m29.9 108.1l10 17.4 53.2-30.7c-7.8 23.7-20.6 45.4-37.5 63.6l20.6 11.1c18.6-24.2 30-53.1 33-83.4l29.8 51.5 18.4-10.7-29.8-51.5c27.4 11.5 57.2 16.3 86.9 14.1l3.5-23.5c-24.7 5.1-50.1 5-74.8-0.1l53.5-30.9-10-17.3-69.3 40-7.3-12.6-18.4 10.7L698.02053 425l-69.1 39.8z"
fill="#515151"
opacity=".5"
p-id="5974"
></path>
</svg>
</template>
<template #avatar>
<a-checkbox
:checked="item.checked"
@click.stop="checkedItem(item)"
@change="checkedItem(item)"
></a-checkbox>
</template>
</a-list-item-meta>
</a-skeleton>
</a-list-item>
</template>
</a-list>
<a-pagination
v-model:current="pageNum"
v-model:page-size="pageSize"
:page-size-options="pageSizeOptions"
:total="total"
show-size-changer
@showSizeChange="onShowSizeChange"
@change="pageChange"
:key="showKey"
>
<template #buildOptionText="props">
<span>{{ props.value }}/</span>
</template>
</a-pagination>
<div class="bottom">
<div class="left">
<a-checkbox v-model:checked="checkAll" @change="onCheckAllChange">
全选
</a-checkbox>
<a-popconfirm
:title="'是否批量删除已选中的' + checkedList.length + '条数据?'"
ok-text="是"
cancel-text="否"
@confirm="delList"
@cancel="cancel"
>
<a-button
type="primary"
style="width: 70px; height: 32px; margin-left: 10px"
>
删除
</a-button>
</a-popconfirm>
</div>
</div>
</template>
<script setup>
import { onMounted, ref } from 'vue'
import { useRouter } from 'vue-router'
import { message } from 'ant-design-vue'
import mybus from '@/myplugins/mybus'
import { getBsList, BsDel, getTopCategory } from '@/api/personalCenter'
const router = useRouter()
//
const pageNum = ref('1')
const pageSize = ref('5')
const pageSizeOptions = ref(['5', '10', '20'])
const total = ref(0)
//
const checkedList = ref([])
const checkAll = ref(false)
const initLoading = ref(true)
const showKey = ref(0)
//
const name = ref('')
const type = ref('')
const list = ref([])
const tabList = ref([])
//
onMounted(() => {
getList()
getCategory()
})
//
const getCategory = () => {
getTopCategory().then((res) => {
console.log('编目一级=============>', res.data)
res.data.data.forEach((val) => {
// tabList.value.push(val.name)
if (val.name == '应用资源' || val.name == '组件服务') {
tabList.value.push(val.name)
}
})
})
}
//
const onCheckAllChange = () => {
console.log(checkedList)
if (checkAll.value) {
// checkedList.value = []
list.value.forEach((val) => {
if (checkedList.value.indexOf(val.id) != -1) {
checkedList.value.splice(checkedList.value.indexOf(val.id), 1)
}
val.checked = true
checkedList.value.push(val.id)
dataResourceId.value.push(val.id)
arr.value.push(val.name)
})
console.log(checkAll.value)
} else {
list.value.forEach((val) => {
val.checked = false
if (checkedList.value.indexOf(val.id) != -1) {
checkedList.value.splice(checkedList.value.indexOf(val.id), 1)
}
})
// checkedList.value = []
dataResourceId.value = []
arr.value = []
console.log(checkAll.value)
}
}
//
const clean = () => {
name.value = ''
type.value = ''
pageNum.value = '1'
pageSize.value = '5'
showKey.value++
checkAll.value = false
getList()
}
//
const getList = () => {
console.log(name.value)
getBsList({
limit: pageSize.value,
page: pageNum.value,
}).then((res) => {
checkAll.value = true
console.log('申购车列表================>', res)
initLoading.value = false
list.value = []
total.value = res.data.data.total
res.data.data.list.forEach((val) => {
const obj = {
loading: false,
name: val.resourceDTO.name,
id: val.id,
checked: false,
type: val.resourceDTO.type,
resourceId: val.resourceId,
createDate: val.createDate,
description: val.resourceDTO.description,
delFlag: val.resourceDTO.delFlag,
}
if (checkedList.value.indexOf(val.id) == -1) {
checkAll.value = false
} else {
obj.checked = true
}
list.value.push(obj)
})
})
}
const onShowSizeChange = (current, pageSize) => {
console.log(current, pageSize)
// pageNum.value = current
// pageSize.value = pageSize
// getList()
}
//
const pageChange = (val) => {
pageNum.value = val
pageNum.value = val
// checkedList.value = []
getList()
}
//
const onSearch = () => {
console.log('search======================>', name.value)
}
//id
const dataResourceId = ref([])
const arr = ref([])
//
const checkedItem = (item) => {
checkAll.value = true
list.value.forEach((val) => {
if (val.id === item.id) {
console.log(val)
val.checked = !val.checked
if (val.checked) {
checkedList.value.push(val.id)
dataResourceId.value.push(val.id)
arr.value.push(val.name)
} else {
checkedList.value.splice(checkedList.value.indexOf(val.id), 1)
dataResourceId.value.splice(checkedList.value.indexOf(val.id), 1)
arr.value.splice(arr.value.indexOf(val.name), 1)
}
}
console.log(checkedList.value, val.id)
if (checkedList.value.indexOf(val.id) == -1) {
checkAll.value = false
console.log('不存在', checkAll.value)
}
})
showKey.value++
}
//
const tabIndex = ref(-1)
const changeTab = (index) => {
console.log('tabIndex', tabIndex.value, index, tabList)
if (tabIndex.value == index) {
tabIndex.value = -1
type.value = ''
} else {
tabIndex.value = index
type.value = tabList.value[index]
}
getList()
}
//
const delList = () => {
if (checkedList.value.length == 0) {
message.error('请先选择需要操作的数据!')
} else {
BsDel(checkedList.value).then((res) => {
console.log('checkedList.value', checkedList.value)
if (res.data.msg === 'success') {
message.success('删除成功')
console.log('删除申购车列表================>', res)
checkAll.value = false
checkedList.value = []
dataResourceId.value = []
pageNum.value = '1'
showKey.value++
mybus.emit('getSgcNum')
getList()
}
})
}
}
const cancel = (e) => {
console.log(e)
}
//
const showItem = (id, type, delFlag) => {
if (delFlag == 0) {
console.log('进入详情')
mybus.emit('tabsChange', { flag: id })
router.push({
path: '/details',
query: {
id: id,
},
})
}
}
</script>
<style lang="less" scoped>
.ant-list {
height: 540px;
overflow-y: scroll;
.ant-list-item-meta {
align-items: center;
:deep(.ant-list-item-meta-avatar) {
padding-left: 20px;
margin-right: 30px;
}
.time {
margin-left: 30px;
font-size: 12px;
color: #ccc;
}
:deep(.ant-list-item-meta-description) {
max-height: 44px;
overflow: hidden;
margin-right: 10px;
}
}
:deep(.ant-list-item-meta-title) {
display: flex;
justify-content: space-between;
span {
margin-right: 0.3rem;
}
}
}
.ant-list::-webkit-scrollbar {
width: 0 !important;
}
.bottom {
margin: 10px;
display: flex;
justify-content: space-between;
align-items: center;
.left span {
margin-left: 10px;
}
}
.title {
font-size: 20px;
color: #000000;
font-family: 'Alibaba PuHuiTi';
font-weight: 500;
margin-top: 20px;
margin-left: 20px;
}
.sousuokuang {
margin: 10px 0px 21px 20px;
.ant-input-search {
max-width: 490px;
}
:deep(.ant-input) {
width: 400px;
height: 36px;
font-size: 14px;
color: #b2b2b2;
background: #f5f5f5;
}
:deep(.ant-input-group-addon) {
display: inline-block;
margin-left: 10px;
.ant-input-search-button {
width: 80px;
height: 36px;
border-radius: 4px;
font-size: 14px;
}
}
}
.tab {
margin-top: 10px;
margin-left: 20px;
margin-bottom: 10px;
display: flex;
font-size: 14px;
color: #999999;
div {
width: 70px;
height: 24px;
border: 1px solid #cccccc;
border-radius: 12px;
margin-left: 10px;
text-align: center;
color: #666666;
cursor: pointer;
}
.tabclass {
border: 1px solid #0087ff;
color: #0087ff;
}
}
.name:hover {
color: #0087ff;
}
</style>

View File

@ -58,6 +58,12 @@
imgActive: require('@/assets/personalCenter/collectactive.png'),
key: 'collect',
},
{
title: '我的浏览',
img: require('@/assets/personalCenter/recent.png'),
imgActive: require('@/assets/personalCenter/recentactive.png'),
key: 'recent',
},
{
title: '我的需求',
img: require('@/assets/personalCenter/demand.png'),
@ -70,12 +76,6 @@
imgActive: require('@/assets/personalCenter/remarkactive.png'),
key: 'remark',
},
// {
// title: '',
// img: require('@/assets/personalCenter/recent.png'),
// imgActive: require('@/assets/personalCenter/recentactive.png'),
// key: 'recent',
// },
]
const selectedKeys = ref(['PurchaseVehicle'])
const type = JSON.parse(window.sessionStorage.getItem('type'))

View File

@ -18,6 +18,7 @@
<collection v-else-if="showFlag === 'collect'"></collection>
<my-application v-else-if="showFlag === 'demand'"></my-application>
<my-comments v-else-if="showFlag === 'remark'"></my-comments>
<my-browse v-else-if="showFlag === 'recent'"></my-browse>
</div>
</article>
</div>
@ -32,7 +33,7 @@
import MyApplication from '@/views/personalCenter/components/MyApplication'
import MyComments from '@/views/personalCenter/components/MyComments'
import MyPublish from '@/views/personalCenter/components/MyPublish'
// MyPublish.vue
import MyBrowse from '@/views/personalCenter/components/MyBrowse'
import PurchaseVehicle from '@/views/personalCenter/components/PurchaseVehicle'
import Collection from '@/views/personalCenter/components/Collection'
import mybus from '@/myplugins/mybus'