算法PK隐藏全选
This commit is contained in:
a0049873
parent
08b971c411
commit
f2921a0227
|
|
@ -20,8 +20,8 @@
|
|||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%;">
|
||||
<el-table-column prop="orderId" :label="$t('dataresources.resourcesName')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="productName" :label="$t('dataresources.resourcesCode')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="productName" :label="$t('dataresources.resourcesName')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="orderId" :label="$t('dataresources.resourcesCode')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="payAmount" :label="$t('dataresources.resourcesProvide')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="status" :label="$t('dataresources.resourcesAbstract')" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="payAt" :label="$t('dataresources.putOnDate')" header-align="center" align="center"></el-table-column>
|
||||
|
|
@ -50,8 +50,8 @@
|
|||
<script>
|
||||
import mixinViewModule from '@/mixins/view-module'
|
||||
// import AddOrUpdate from './order-add-or-update'
|
||||
import {addDynamicRoute} from "@/router";
|
||||
import RelateApplication from "./bsabilityai-relate-application.vue"
|
||||
import { addDynamicRoute } from '@/router'
|
||||
import RelateApplication from './bsabilityai-relate-application.vue'
|
||||
|
||||
export default {
|
||||
mixins: [mixinViewModule],
|
||||
|
|
@ -79,31 +79,31 @@ export default {
|
|||
},
|
||||
components: {
|
||||
// AddOrUpdate,
|
||||
RelateApplication,
|
||||
RelateApplication
|
||||
},
|
||||
methods: {
|
||||
//重置
|
||||
resetDataList(){
|
||||
this.dataForm=this.noDataForm;
|
||||
this.page=1; // 当前页码
|
||||
this.query();
|
||||
// 重置
|
||||
resetDataList () {
|
||||
this.dataForm = this.noDataForm
|
||||
this.page = 1 // 当前页码
|
||||
this.query()
|
||||
},
|
||||
// 点击关联应用按钮
|
||||
showRelateApplication(row){
|
||||
showRelateApplication (row) {
|
||||
this.$http.get(`dataResourceRel/queryApplicationRelByResourceId?referenceId=${row.id}`).then(({ data: res }) => {
|
||||
if( res && res.data ) {
|
||||
this.relateApplicationVisible = true;
|
||||
if (res && res.data) {
|
||||
this.relateApplicationVisible = true
|
||||
this.relateInfo = {
|
||||
id: row.id,
|
||||
responseData: res.data,
|
||||
linkType: '2'
|
||||
};
|
||||
}
|
||||
}
|
||||
}).catch(() => { })
|
||||
},
|
||||
// 是否展示关联应用弹窗
|
||||
handleIsShowRelatePopup(type) {
|
||||
this.relateApplicationVisible = type;
|
||||
handleIsShowRelatePopup (type) {
|
||||
this.relateApplicationVisible = type
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,12 @@
|
|||
<div class="bg">
|
||||
<home-header></home-header>
|
||||
<div class="box-container">
|
||||
<a-spin size="large" v-if="loadingPage" class="loading-box" :spinning="loadingPage" />
|
||||
<a-spin
|
||||
size="large"
|
||||
v-if="loadingPage"
|
||||
class="loading-box"
|
||||
:spinning="loadingPage"
|
||||
/>
|
||||
<div class="nav-box">
|
||||
<a-breadcrumb>
|
||||
<a-breadcrumb-item>能力集市</a-breadcrumb-item>
|
||||
|
|
@ -10,9 +15,20 @@
|
|||
</a-breadcrumb>
|
||||
</div>
|
||||
<div class="content">
|
||||
<a-anchor :affix="false" class="left" :getContainer="getId" @click="handleClickTab">
|
||||
<a-anchor-link class="left-item" :href="`#${data}`" :title="data" v-for="(data, i) in leftNav"
|
||||
:key="i" :data-title="data" />
|
||||
<a-anchor
|
||||
:affix="false"
|
||||
class="left"
|
||||
:getContainer="getId"
|
||||
@click="handleClickTab"
|
||||
>
|
||||
<a-anchor-link
|
||||
class="left-item"
|
||||
:href="`#${data}`"
|
||||
:title="data"
|
||||
v-for="(data, i) in leftNav"
|
||||
:key="i"
|
||||
:data-title="data"
|
||||
/>
|
||||
</a-anchor>
|
||||
<div class="right">
|
||||
<div class="top no-border-right">
|
||||
|
|
@ -22,30 +38,55 @@
|
|||
</div>
|
||||
<div class="td" v-for="(item, k) in detailArray" :key="k">
|
||||
<span v-if="item">{{ item.name || '--' }}</span>
|
||||
<span v-if="item" @click="deleteList(k)" class="icon-delete">
|
||||
</span>
|
||||
<span class="add-img" @click="addList"
|
||||
v-if="!item && k === detailArray.filter(v => v).length">
|
||||
</span>
|
||||
<span
|
||||
v-if="item"
|
||||
@click="deleteList(k)"
|
||||
class="icon-delete"
|
||||
></span>
|
||||
<span
|
||||
class="add-img"
|
||||
@click="addList"
|
||||
v-if="!item && k === detailArray.filter((v) => v).length"
|
||||
></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom bottomRef" id="bottomRef" ref="bottomRef">
|
||||
<div class="bottom-item" v-for="(data, i) in tableData" :key="i">
|
||||
<div class="title" :id="data.title" :title="data.title" :ref="data.title">{{ data.title }}
|
||||
<div
|
||||
class="title"
|
||||
:id="data.title"
|
||||
:title="data.title"
|
||||
:ref="data.title"
|
||||
>
|
||||
{{ data.title }}
|
||||
</div>
|
||||
<!-- 算法优势 -->
|
||||
<div class="group-data" v-if="data.groupName">
|
||||
<!-- <compare-group-view :dataList="data.groupList"></compare-group-view> -->
|
||||
<div v-if="data.groupList.length > 0">
|
||||
<div class="group-box" v-for="(data, i) in data.groupList" :key="i">
|
||||
<div class="flex-row-start row-tr" v-for="(item, j) in Object.keys(data)"
|
||||
:key="j" :class="j == Object.keys(data).length - 1 ? 'border-bottom' : ''">
|
||||
<div
|
||||
class="group-box"
|
||||
v-for="(data, i) in data.groupList"
|
||||
:key="i"
|
||||
>
|
||||
<div
|
||||
class="flex-row-start row-tr"
|
||||
v-for="(item, j) in Object.keys(data)"
|
||||
:key="j"
|
||||
:class="
|
||||
j == Object.keys(data).length - 1 ? 'border-bottom' : ''
|
||||
"
|
||||
>
|
||||
<div class="td-name" :style="{ height: getHeight(item) }">
|
||||
<span class="td-text td-name-text">{{ item }}</span>
|
||||
</div>
|
||||
<div class="flex-row-start">
|
||||
<div class="td" :style="{ height: getHeight(item) }"
|
||||
v-for="(d, k) in data[item]" :key="k">
|
||||
<div
|
||||
class="td"
|
||||
:style="{ height: getHeight(item) }"
|
||||
v-for="(d, k) in data[item]"
|
||||
:key="k"
|
||||
>
|
||||
<a-tooltip placement="top" :title="d">
|
||||
<span class="td-text">{{ d }}</span>
|
||||
</a-tooltip>
|
||||
|
|
@ -54,20 +95,39 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="data.groupList.length == 0" class="no-data">暂无数据</div>
|
||||
<div v-if="data.groupList.length == 0" class="no-data">
|
||||
暂无数据
|
||||
</div>
|
||||
<div class="flex-row-start row-tr" v-else v-for="(rowData, j) in data.list" :key="j"
|
||||
:class="j == data.list.length - 1 ? 'border-bottom' : ''">
|
||||
<div class="td-name" :style="{ height: getHeight(rowData.name) }">
|
||||
</div>
|
||||
<div
|
||||
class="flex-row-start row-tr"
|
||||
v-else
|
||||
v-for="(rowData, j) in data.list"
|
||||
:key="j"
|
||||
:class="j == data.list.length - 1 ? 'border-bottom' : ''"
|
||||
>
|
||||
<div
|
||||
class="td-name"
|
||||
:style="{ height: getHeight(rowData.name) }"
|
||||
>
|
||||
<span class="td-text td-name-text">
|
||||
{{ rowData.name }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex-row-start">
|
||||
<div class="td" v-for="(item, k) in rowData.infoList" :key="k"
|
||||
:style="{ height: getHeight(rowData.name) }">
|
||||
<video v-if="showVideo(rowData.name) && item" width="240" height="180" controls>
|
||||
<source :src="item" type="video/mp4">
|
||||
<div
|
||||
class="td"
|
||||
v-for="(item, k) in rowData.infoList"
|
||||
:key="k"
|
||||
:style="{ height: getHeight(rowData.name) }"
|
||||
>
|
||||
<video
|
||||
v-if="showVideo(rowData.name) && item"
|
||||
width="240"
|
||||
height="180"
|
||||
controls
|
||||
>
|
||||
<source :src="item" type="video/mp4" />
|
||||
您的浏览器不支持 HTML5 video 标签。
|
||||
</video>
|
||||
<a-tooltip v-else placement="top" :title="item">
|
||||
|
|
@ -82,10 +142,20 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<a-modal class="modal-box" title="请选择" :visible="showAddModal" :onOk='handleOk' :onCancel='handleCancel'>
|
||||
<a-table :columns="columns" :data-source="dataList" style="height:610px;overflow-y:scroll"
|
||||
:row-selection="rowSelection" rowKey="id">
|
||||
</a-table>
|
||||
<a-modal
|
||||
class="modal-box"
|
||||
title="请选择"
|
||||
:visible="showAddModal"
|
||||
:onOk="handleOk"
|
||||
:onCancel="handleCancel"
|
||||
>
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="dataList"
|
||||
style="height: 610px; overflow-y: scroll"
|
||||
:row-selection="rowSelection"
|
||||
rowKey="id"
|
||||
></a-table>
|
||||
</a-modal>
|
||||
|
||||
<!-- <HomeFooter></HomeFooter> -->
|
||||
|
|
@ -93,23 +163,33 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import CompareGroupView from '@/views/home/components/CompareGroupView'
|
||||
import { pageWithAttrs } from '@/api/abilityStatistics'
|
||||
import { defineComponent, ref, onMounted, getCurrentInstance, computed, unref, reactive, nextTick, onCreated } from 'vue';
|
||||
import { selectOne } from '@/api/home'
|
||||
import { message, Tooltip, Table, Spin } from 'ant-design-vue'
|
||||
import { useRouter } from 'vue-router';
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import CompareGroupView from '@/views/home/components/CompareGroupView'
|
||||
import { pageWithAttrs } from '@/api/abilityStatistics'
|
||||
import {
|
||||
defineComponent,
|
||||
ref,
|
||||
onMounted,
|
||||
getCurrentInstance,
|
||||
computed,
|
||||
unref,
|
||||
reactive,
|
||||
nextTick,
|
||||
onCreated,
|
||||
} from 'vue'
|
||||
import { selectOne } from '@/api/home'
|
||||
import { message, Tooltip, Table, Spin } from 'ant-design-vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
|
||||
const router = useRouter()
|
||||
let queryId = router.currentRoute.value.query.id;
|
||||
const ctx = getCurrentInstance();
|
||||
const router = useRouter()
|
||||
let queryId = router.currentRoute.value.query.id
|
||||
const ctx = getCurrentInstance()
|
||||
|
||||
// 最大4列
|
||||
const pagination = ref([])
|
||||
// 表格列名
|
||||
const columns = ref([
|
||||
// 最大4列
|
||||
const pagination = ref([])
|
||||
// 表格列名
|
||||
const columns = ref([
|
||||
{
|
||||
title: '算法名称',
|
||||
dataIndex: 'name',
|
||||
|
|
@ -118,14 +198,15 @@ const columns = ref([
|
|||
title: '算法类型',
|
||||
dataIndex: 'type',
|
||||
},
|
||||
])
|
||||
// 详情列表
|
||||
const detailArray = ref(['', '', '', ''])
|
||||
])
|
||||
// 详情列表
|
||||
const detailArray = ref(['', '', '', ''])
|
||||
|
||||
const titleInfoObj = {
|
||||
'基本信息': [
|
||||
const titleInfoObj = {
|
||||
基本信息: [
|
||||
{
|
||||
text: '算法名称', key: 'name'
|
||||
text: '算法名称',
|
||||
key: 'name',
|
||||
},
|
||||
{
|
||||
text: '算法类别',
|
||||
|
|
@ -134,38 +215,47 @@ const titleInfoObj = {
|
|||
text: '部署位置',
|
||||
},
|
||||
{
|
||||
text: '应用领域', key: '应用领域'
|
||||
text: '应用领域',
|
||||
key: '应用领域',
|
||||
},
|
||||
{
|
||||
text: '共享条件', key: 'shareCondition'
|
||||
text: '共享条件',
|
||||
key: 'shareCondition',
|
||||
},
|
||||
{
|
||||
text: '共享类型', key: 'shareType'
|
||||
text: '共享类型',
|
||||
key: 'shareType',
|
||||
},
|
||||
{
|
||||
text: '算法描述', key: 'description'
|
||||
text: '算法描述',
|
||||
key: 'description',
|
||||
},
|
||||
{
|
||||
text: '算法介绍视频', key: '算法介绍视频'
|
||||
text: '算法介绍视频',
|
||||
key: '算法介绍视频',
|
||||
},
|
||||
],
|
||||
'算法优势': [
|
||||
算法优势: [
|
||||
{
|
||||
text: '算法优势名称', key: 'name'
|
||||
text: '算法优势名称',
|
||||
key: 'name',
|
||||
},
|
||||
{
|
||||
text: '算法优势描述', key: 'desc'
|
||||
text: '算法优势描述',
|
||||
key: 'desc',
|
||||
},
|
||||
],
|
||||
'应用场景': [
|
||||
应用场景: [
|
||||
{
|
||||
text: '场景名称', key: '场景名称'
|
||||
text: '场景名称',
|
||||
key: '场景名称',
|
||||
},
|
||||
{
|
||||
text: '场景描述', key: '场景描述'
|
||||
text: '场景描述',
|
||||
key: '场景描述',
|
||||
},
|
||||
],
|
||||
'应用案例': [
|
||||
应用案例: [
|
||||
{
|
||||
text: '关联应用',
|
||||
},
|
||||
|
|
@ -176,7 +266,7 @@ const titleInfoObj = {
|
|||
text: '算法应用期望达成效果',
|
||||
},
|
||||
],
|
||||
'计费标准信息': [
|
||||
计费标准信息: [
|
||||
{
|
||||
text: '是否收费',
|
||||
},
|
||||
|
|
@ -190,27 +280,31 @@ const titleInfoObj = {
|
|||
// text: '计费标准信息', key: ''
|
||||
// },
|
||||
],
|
||||
'使用方式': [
|
||||
使用方式: [
|
||||
{
|
||||
text: '服务接口',
|
||||
},
|
||||
{
|
||||
text: '接口请求方式', key: 'apiMethodType'
|
||||
text: '接口请求方式',
|
||||
key: 'apiMethodType',
|
||||
},
|
||||
{
|
||||
text: '技术文档', key: ''
|
||||
text: '技术文档',
|
||||
key: '',
|
||||
},
|
||||
{
|
||||
text: '是否支持试用', key: ''
|
||||
text: '是否支持试用',
|
||||
key: '',
|
||||
},
|
||||
{
|
||||
text: '试用描述', key: ''
|
||||
text: '试用描述',
|
||||
key: '',
|
||||
},
|
||||
{
|
||||
text: '试用地址',
|
||||
},
|
||||
],
|
||||
'服务商': [
|
||||
服务商: [
|
||||
{
|
||||
text: '服务商名',
|
||||
},
|
||||
|
|
@ -221,80 +315,78 @@ const titleInfoObj = {
|
|||
text: '服务商联系电话',
|
||||
},
|
||||
],
|
||||
'常见问题': [
|
||||
常见问题: [
|
||||
{
|
||||
text: '常见问题',
|
||||
},
|
||||
{
|
||||
text: '回答',
|
||||
},
|
||||
]
|
||||
}
|
||||
// 左侧导航
|
||||
const leftNav = ref([])
|
||||
Object.keys(titleInfoObj).map(v => leftNav.value.push(v))
|
||||
],
|
||||
}
|
||||
// 左侧导航
|
||||
const leftNav = ref([])
|
||||
Object.keys(titleInfoObj).map((v) => leftNav.value.push(v))
|
||||
|
||||
// 可能会有多组的数据
|
||||
const arrayStr = [
|
||||
'算法优势', '应用场景', '计费标准信息', '常见问题'
|
||||
]
|
||||
// 可能会有多组的数据
|
||||
const arrayStr = ['算法优势', '应用场景', '计费标准信息', '常见问题']
|
||||
|
||||
let textObj = {
|
||||
'算法优势': {
|
||||
let textObj = {
|
||||
算法优势: {
|
||||
name: '算法优势名称',
|
||||
desc: '算法优势描述'
|
||||
desc: '算法优势描述',
|
||||
},
|
||||
'应用场景': {
|
||||
应用场景: {
|
||||
name: '场景名称',
|
||||
desc: '场景描述',
|
||||
},
|
||||
'计费标准信息': {
|
||||
计费标准信息: {
|
||||
type: '计费方式',
|
||||
price: '价格',
|
||||
desc: '计费描述信息',
|
||||
'是否收费': '是否收费'
|
||||
是否收费: '是否收费',
|
||||
},
|
||||
'常见问题': {
|
||||
常见问题: {
|
||||
question: '常见问题',
|
||||
answer: '回答'
|
||||
answer: '回答',
|
||||
},
|
||||
}
|
||||
|
||||
const showAddModal = ref(false)
|
||||
const dataList = ref([])
|
||||
const selectedRowKeys = ref([]);
|
||||
let tableData = ref([])
|
||||
const loadingPage = ref(false)
|
||||
|
||||
const getId = () => {
|
||||
return window.document.getElementById('bottomRef')
|
||||
}
|
||||
|
||||
const handleClickTab = (e, link) => {
|
||||
// 阻止点击的默认事件修改路由
|
||||
e.preventDefault();
|
||||
if (link.href) {
|
||||
let ele = document.getElementById(link.href);
|
||||
ele && ele.scrollIntoView({ block: 'start', behavior: 'smooth' });
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
const showAddModal = ref(false)
|
||||
const dataList = ref([])
|
||||
const selectedRowKeys = ref([])
|
||||
let tableData = ref([])
|
||||
const loadingPage = ref(false)
|
||||
|
||||
const getId = () => {
|
||||
return window.document.getElementById('bottomRef')
|
||||
}
|
||||
|
||||
const handleClickTab = (e, link) => {
|
||||
// 阻止点击的默认事件修改路由
|
||||
e.preventDefault()
|
||||
if (link.href) {
|
||||
let ele = document.getElementById(link.href)
|
||||
ele && ele.scrollIntoView({ block: 'start', behavior: 'smooth' })
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
selectedRowKeys.value.push(queryId)
|
||||
nextTick(() => {
|
||||
getList().then(res => {
|
||||
getList().then((res) => {
|
||||
initData()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
const initData = () => {
|
||||
loadingPage.value = true;
|
||||
const initData = () => {
|
||||
loadingPage.value = true
|
||||
// queryId
|
||||
// 获取详情
|
||||
Promise.all(selectedRowKeys.value.map(id => getDetail(id))).then(data => {
|
||||
Promise.all(selectedRowKeys.value.map((id) => getDetail(id)))
|
||||
.then((data) => {
|
||||
detailArray.value = []
|
||||
for (let index = 0; index < 4; index++) {
|
||||
if (data[index] == undefined) {
|
||||
|
|
@ -310,28 +402,29 @@ const initData = () => {
|
|||
})
|
||||
|
||||
loadingPage.value = false
|
||||
}).catch(err => {
|
||||
})
|
||||
.catch((err) => {
|
||||
loadingPage.value = false
|
||||
message.error(err || '获取算法详情失败，请重试！')
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 处理数组
|
||||
const getNewData = () => {
|
||||
// 处理数组
|
||||
const getNewData = () => {
|
||||
tableData.value = []
|
||||
Object.keys(titleInfoObj).map((titleKey, i) => {
|
||||
// 标题
|
||||
let _newObj = {
|
||||
'title': titleKey,
|
||||
title: titleKey,
|
||||
}
|
||||
if (arrayStr.includes(titleKey)) {
|
||||
_newObj.groupName = titleKey;
|
||||
_newObj.groupName = titleKey
|
||||
_newObj.groupList = []
|
||||
} else {
|
||||
_newObj.list = []
|
||||
}
|
||||
let list = [];
|
||||
titleInfoObj[titleKey].map(trName => {
|
||||
let list = []
|
||||
titleInfoObj[titleKey].map((trName) => {
|
||||
let obj = {
|
||||
name: trName.text,
|
||||
}
|
||||
|
|
@ -343,33 +436,33 @@ const getNewData = () => {
|
|||
}
|
||||
})
|
||||
if (!arrayStr.includes(titleKey)) {
|
||||
_newObj.list = list;
|
||||
_newObj.list = list
|
||||
}
|
||||
tableData.value.push(_newObj)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 基本信息等
|
||||
const getInfoList = (rowItem) => {
|
||||
// 基本信息等
|
||||
const getInfoList = (rowItem) => {
|
||||
let arr = []
|
||||
detailArray.value.map(item => {
|
||||
let val = undefined;
|
||||
detailArray.value.map((item) => {
|
||||
let val = undefined
|
||||
val = item[rowItem.key || rowItem.text]
|
||||
arr.push(val)
|
||||
})
|
||||
return arr;
|
||||
}
|
||||
return arr
|
||||
}
|
||||
|
||||
// 算法优势：分组信息数组getGroupList
|
||||
const getGroupList = (titleKey, trName) => {
|
||||
// 算法优势：分组信息数组getGroupList
|
||||
const getGroupList = (titleKey, trName) => {
|
||||
let arr = []
|
||||
detailArray.value.map(item => {
|
||||
detailArray.value.map((item) => {
|
||||
if (arrayStr.includes(titleKey)) {
|
||||
let groupItemObj = {}
|
||||
let _list = item[titleKey] || [];
|
||||
let _list = item[titleKey] || []
|
||||
let textInfo = textObj[titleKey]
|
||||
_list.map(v => {
|
||||
Object.keys(v).map(d => {
|
||||
_list.map((v) => {
|
||||
Object.keys(v).map((d) => {
|
||||
if (textInfo[d] !== undefined) {
|
||||
groupItemObj[textInfo[d]] = v[d]
|
||||
}
|
||||
|
|
@ -379,37 +472,35 @@ const getGroupList = (titleKey, trName) => {
|
|||
}
|
||||
})
|
||||
let _arr = translateArray(arr)
|
||||
return _arr;
|
||||
}
|
||||
return _arr
|
||||
}
|
||||
|
||||
// 数组转化
|
||||
const translateArray = (list) => {
|
||||
// 数组转化
|
||||
const translateArray = (list) => {
|
||||
let arr = []
|
||||
if (list.every(v => JSON.stringify(v) == '{}')) {
|
||||
if (list.every((v) => JSON.stringify(v) == '{}')) {
|
||||
arr = []
|
||||
} else {
|
||||
let itemObj = list.find(v => JSON.stringify(v) !== '{}')
|
||||
let itemObj = list.find((v) => JSON.stringify(v) !== '{}')
|
||||
let obj = {}
|
||||
Object.keys(itemObj).map(v => {
|
||||
Object.keys(itemObj).map((v) => {
|
||||
let arr2 = []
|
||||
list.map(item => {
|
||||
list.map((item) => {
|
||||
arr2.push(item[v] || '')
|
||||
})
|
||||
obj[v] = arr2
|
||||
})
|
||||
arr.push(obj);
|
||||
arr.push(obj)
|
||||
}
|
||||
return arr
|
||||
}
|
||||
return arr;
|
||||
}
|
||||
|
||||
// 获取算法列表
|
||||
const getList = () => {
|
||||
// 获取算法列表
|
||||
const getList = () => {
|
||||
const data = {
|
||||
deptIds: [],
|
||||
districtId: '',
|
||||
infoList: [
|
||||
{ attrType: "组件类型", attrValue: "智能算法" }
|
||||
],
|
||||
infoList: [{ attrType: '组件类型', attrValue: '智能算法' }],
|
||||
name: '',
|
||||
orderField: 'total',
|
||||
orderType: 'DESC',
|
||||
|
|
@ -419,7 +510,8 @@ const getList = () => {
|
|||
type: '',
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
pageWithAttrs(data).then((res) => {
|
||||
pageWithAttrs(data)
|
||||
.then((res) => {
|
||||
dataList.value = res.data.data.records || []
|
||||
nextTick(() => {
|
||||
// 默认前两个
|
||||
|
|
@ -427,14 +519,15 @@ const getList = () => {
|
|||
// selectedRowKeys.value.push(dataList.value[1].id)
|
||||
})
|
||||
resolve(res)
|
||||
}).catch(err => {
|
||||
})
|
||||
.catch((err) => {
|
||||
reject(err)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 删除算法
|
||||
const deleteList = (i) => {
|
||||
// 删除算法
|
||||
const deleteList = (i) => {
|
||||
selectedRowKeys.value.splice(i, 1)
|
||||
detailArray.value.splice(i, 1)
|
||||
nextTick(() => {
|
||||
|
|
@ -445,132 +538,132 @@ const deleteList = (i) => {
|
|||
}
|
||||
getNewData()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const addList = () => {
|
||||
const addList = () => {
|
||||
showAddModal.value = true
|
||||
}
|
||||
}
|
||||
|
||||
const handleOk = () => {
|
||||
if (selectedRowKeys.length > 4) {
|
||||
const handleOk = () => {
|
||||
if (selectedRowKeys.value.length > 4) {
|
||||
message.error('最多选择四个算法！')
|
||||
return false;
|
||||
return false
|
||||
}
|
||||
initData()
|
||||
showAddModal.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const handleCancel = () => {
|
||||
const handleCancel = () => {
|
||||
showAddModal.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const rowSelection = computed(() => {
|
||||
const rowSelection = computed(() => {
|
||||
return {
|
||||
selectedRowKeys: unref(selectedRowKeys),
|
||||
onChange: changableRowKeys => {
|
||||
onChange: (changableRowKeys) => {
|
||||
if (changableRowKeys.length > 4) {
|
||||
message.error('最多选择四个算法！')
|
||||
} else {
|
||||
selectedRowKeys.value = changableRowKeys;
|
||||
selectedRowKeys.value = changableRowKeys
|
||||
}
|
||||
if (selectedRowKeys.value.length > 4) {
|
||||
selectedRowKeys.value = selectedRowKeys.value.splice(4)
|
||||
}
|
||||
},
|
||||
hideDefaultSelections: true,
|
||||
};
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
// 动态获取高度
|
||||
const getHeight = (name) => {
|
||||
// 动态获取高度
|
||||
const getHeight = (name) => {
|
||||
if (name.indexOf('描述') != -1) {
|
||||
return '120px'
|
||||
}
|
||||
if (name.indexOf('视频') != -1) {
|
||||
return '230px'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 是否视频播放
|
||||
const showVideo = (name) => {
|
||||
// 是否视频播放
|
||||
const showVideo = (name) => {
|
||||
if (name.indexOf('视频') !== -1) {
|
||||
return true
|
||||
}
|
||||
return false;
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
|
||||
// 获取详情
|
||||
const getDetail = (id) => {
|
||||
// 获取详情
|
||||
const getDetail = (id) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
selectOne(id).then((res) => {
|
||||
selectOne(id)
|
||||
.then((res) => {
|
||||
resolve(res.data && res.data.data)
|
||||
}).catch(err => {
|
||||
})
|
||||
.catch((err) => {
|
||||
reject(err)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 判断是否json字符串
|
||||
const isJson = (str) => {
|
||||
// 判断是否json字符串
|
||||
const isJson = (str) => {
|
||||
if (typeof str == 'string') {
|
||||
try {
|
||||
let obj = JSON.parse(str)
|
||||
return true
|
||||
} catch (e) {
|
||||
return false;
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// infoList数组处理
|
||||
const formatterData = (obj) => {
|
||||
// infoList数组处理
|
||||
const formatterData = (obj) => {
|
||||
let _newObj = {}
|
||||
obj.infoList.map(v => {
|
||||
_newObj[v.attrType] = isJson(v.attrValue) ? JSON.parse(v.attrValue) : v.attrValue;
|
||||
obj.infoList.map((v) => {
|
||||
_newObj[v.attrType] = isJson(v.attrValue)
|
||||
? JSON.parse(v.attrValue)
|
||||
: v.attrValue
|
||||
})
|
||||
let _obj = Object.assign({}, obj, _newObj)
|
||||
return _obj
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="less" scoped>
|
||||
.bg {
|
||||
.bg {
|
||||
background: #fff;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
// @font-face {
|
||||
// font-family: 'num-typeface';
|
||||
// src: url('~@/assets/newHome/font/num-typeface.otf');
|
||||
// }
|
||||
// @font-face {
|
||||
// font-family: 'num-typeface';
|
||||
// src: url('~@/assets/newHome/font/num-typeface.otf');
|
||||
// }
|
||||
|
||||
.border {
|
||||
.border {
|
||||
border: 1px solid #dddee1;
|
||||
border-bottom: none;
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
.border-bottom {
|
||||
.border-bottom {
|
||||
border-bottom: 1px solid #dddee1;
|
||||
}
|
||||
}
|
||||
|
||||
.no-border-right {
|
||||
.no-border-right {
|
||||
border: 1px solid #dddee1;
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
.flex-row-start {
|
||||
.flex-row-start {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.box-container {
|
||||
.box-container {
|
||||
width: 1592px;
|
||||
margin: 0 auto;
|
||||
padding-top: 60px;
|
||||
|
|
@ -596,7 +689,6 @@ const formatterData = (obj) => {
|
|||
padding-left: 10px;
|
||||
}
|
||||
|
||||
|
||||
.left {
|
||||
width: 200px;
|
||||
height: 600px;
|
||||
|
|
@ -653,7 +745,6 @@ const formatterData = (obj) => {
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.icon-delete {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
|
|
@ -666,7 +757,6 @@ const formatterData = (obj) => {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
|
|
@ -675,17 +765,17 @@ const formatterData = (obj) => {
|
|||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
.title {
|
||||
font-size: 14px;
|
||||
padding: 20px 0 10px 10px;
|
||||
color: #212121;
|
||||
font-weight: bold;
|
||||
background: rgba(244, 245, 248, 0.8);
|
||||
}
|
||||
}
|
||||
|
||||
.td-name {
|
||||
.td-name {
|
||||
border-right: 1px solid #dddee1;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
|
|
@ -695,10 +785,9 @@ const formatterData = (obj) => {
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.td {
|
||||
.td {
|
||||
border-right: 1px solid #dddee1;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
|
|
@ -709,10 +798,9 @@ const formatterData = (obj) => {
|
|||
font-size: 14px;
|
||||
box-sizing: border-box;
|
||||
table-layout: fixed;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.td-text {
|
||||
.td-text {
|
||||
width: 290px;
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
|
|
@ -720,80 +808,78 @@ const formatterData = (obj) => {
|
|||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
}
|
||||
|
||||
.td-name-text {
|
||||
.td-name-text {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.row-tr {
|
||||
.row-tr {
|
||||
border: 1px solid #dddee1;
|
||||
border-right: none;
|
||||
border-bottom: none;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.border-bottom {
|
||||
.border-bottom {
|
||||
border-bottom: 1px solid #dddee1;
|
||||
}
|
||||
}
|
||||
|
||||
.modal-box {
|
||||
.modal-box {
|
||||
height: 650px;
|
||||
width: 800px;
|
||||
}
|
||||
}
|
||||
|
||||
.add-img {
|
||||
.add-img {
|
||||
height: 60px;
|
||||
width: 60px;
|
||||
background: url('~@/assets/newHome/add-on.png');
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.no-data {
|
||||
.no-data {
|
||||
height: 100px;
|
||||
width: 100%;
|
||||
;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1px solid #dddee1;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-box {
|
||||
.loading-box {
|
||||
width: 1592px;
|
||||
height: 500px;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.video-box {
|
||||
.video-box {
|
||||
height: 140px;
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-anchor-wrapper {
|
||||
.ant-anchor-wrapper {
|
||||
width: 200px;
|
||||
height: 600px;
|
||||
background: rgba(244, 245, 248, 0.8);
|
||||
padding-left: 0;
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-anchor-ink::before {
|
||||
.ant-anchor-ink::before {
|
||||
content: ' ';
|
||||
width: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ .ant-anchor {
|
||||
/deep/ .ant-anchor {
|
||||
position: static;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-anchor-link {
|
||||
.ant-anchor-link {
|
||||
padding: 0;
|
||||
margin: 0 14px;
|
||||
height: 60px;
|
||||
|
|
@ -803,5 +889,8 @@ const formatterData = (obj) => {
|
|||
font-size: 16px;
|
||||
color: #212121;
|
||||
border-bottom: 1px solid #dddee1;
|
||||
}
|
||||
}
|
||||
:deep(.ant-checkbox-indeterminate) {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue