赋能场景
This commit is contained in:
gaoyuanwei
parent
748b3b72ea
commit
d7d2c56ec7
|
|
@ -0,0 +1,92 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="CanCase">
|
||||
<div
|
||||
class="caseBox"
|
||||
v-for="(item, index) in caseList"
|
||||
:key="index"
|
||||
@click="toView('details', item)"
|
||||
>
|
||||
<a-image
|
||||
:preview="false"
|
||||
:src="
|
||||
item.fuseAttrList.filter((val) => val.attrType == '服务图片')[0]
|
||||
.attrValue
|
||||
"
|
||||
/>
|
||||
<h3>{{ item.name }}</h3>
|
||||
<p>发布时间 {{ item.updateDate }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
||||
import { defineProps } from 'vue'
|
||||
|
||||
import { useRouter } from 'vue-router'
|
||||
const router = useRouter()
|
||||
const props = defineProps({
|
||||
resourceList: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
resourceTotal: {
|
||||
type: String,
|
||||
default: '0',
|
||||
},
|
||||
selectCardsname: {
|
||||
type: String,
|
||||
default: '组件服务',
|
||||
},
|
||||
})
|
||||
const caseList = ref([])
|
||||
|
||||
onMounted(() => {
|
||||
caseList.value = props.resourceList.data
|
||||
console.log(caseList.value, 'caseList.value')
|
||||
})
|
||||
onBeforeUnmount(() => {})
|
||||
function toView(type, item) {
|
||||
router.push({
|
||||
path: '/integrationServicesDetails',
|
||||
query: {
|
||||
id: item.id,
|
||||
},
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.box {
|
||||
.CanCase {
|
||||
margin-top: 0.2rem;
|
||||
display: grid;
|
||||
grid-template-columns: 33.33% 33.33% 33.33%;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
.caseBox {
|
||||
width: 3.5rem;
|
||||
height: 3rem;
|
||||
box-shadow: 1px 1px 5px 5px rgba(222, 222, 222, 0.152);
|
||||
background: #ffffff;
|
||||
border-radius: 0.05rem;
|
||||
padding: 0.2rem;
|
||||
margin-bottom: 0.2rem;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 3rem;
|
||||
height: 1.8rem;
|
||||
}
|
||||
h3 {
|
||||
font-size: 0.18rem;
|
||||
font-weight: bold;
|
||||
margin-top: 0.1rem;
|
||||
}
|
||||
p {
|
||||
font-size: 0.16rem;
|
||||
color: #797979;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -5,51 +5,87 @@
|
|||
<div class="top">
|
||||
<div class="top-title">
|
||||
全部：
|
||||
<div v-for="(item, index) in titleName" :key="index" class="tabAll" @click="changeCards(index)"
|
||||
:class="{ sel: index == number }">
|
||||
<div
|
||||
v-for="(item, index) in titleName"
|
||||
:key="index"
|
||||
class="tabAll"
|
||||
@click="changeCards(index)"
|
||||
:class="{ sel: index == number }"
|
||||
>
|
||||
<span>{{ item.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="resultListSearchInput-father">
|
||||
<div class="resultListSearchInput-father" v-if="number === 0">
|
||||
<div class="resultListSearchInput-son">
|
||||
模糊搜索
|
||||
<a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large"
|
||||
@search="getAppResources" @change="onSearch" class="resultListSearchInput" />
|
||||
<a-input-search
|
||||
v-model:value="searchValue"
|
||||
placeholder="请输入关键词"
|
||||
enter-button="搜索"
|
||||
size="large"
|
||||
@search="getAppResources"
|
||||
@change="onSearch"
|
||||
class="resultListSearchInput"
|
||||
/>
|
||||
<button class="button-reset" @click="chongzhi()">重置</button>
|
||||
<div class="hengxian"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-loading="loadingData">
|
||||
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2"
|
||||
:resourceList="resourceList" :resourceTotal="resourceTotal"
|
||||
:selectCardsname="number == 0 ? '融合服务' : '赋能场景'" />
|
||||
<searchResultList
|
||||
v-if="number === 0"
|
||||
v-show="resourceList.data && resourceList.data.length > 0"
|
||||
:key="listKey2"
|
||||
:resourceList="resourceList"
|
||||
:resourceTotal="resourceTotal"
|
||||
:selectCardsname="number == 0 ? '融合服务' : '赋能场景'"
|
||||
/>
|
||||
<CanAssignCase
|
||||
v-else
|
||||
v-show="resourceList.data && resourceList.data.length > 0"
|
||||
:key="listKey2"
|
||||
:resourceList="resourceList"
|
||||
:resourceTotal="resourceTotal"
|
||||
:selectCardsname="number == 0 ? '融合服务' : '赋能场景'"
|
||||
/>
|
||||
<div class="pagination">
|
||||
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage"
|
||||
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper
|
||||
:total="resourceTotal" :page-size-options="pageSizeOptions" @change="pageChange"
|
||||
@showSizeChange="onShowSizeChange" />
|
||||
<a-pagination
|
||||
v-if="resourceList.data && resourceList.data.length > 0"
|
||||
v-model:current="currentPage"
|
||||
v-model:pageSize="currentPageSize"
|
||||
show-size-changer
|
||||
show-less-items
|
||||
show-quick-jumper
|
||||
:total="resourceTotal"
|
||||
:page-size-options="pageSizeOptions"
|
||||
@change="pageChange"
|
||||
@showSizeChange="onShowSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem">
|
||||
<div
|
||||
v-if="resourceList.data && resourceList.data.length <= 0"
|
||||
style="margin-top: 2rem"
|
||||
>
|
||||
<a-empty />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<home-footer></home-footer>
|
||||
</template>
|
||||
<script>
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
import mybus from '@/myplugins/mybus'
|
||||
import { defineComponent, reactive, ref, toRefs, onMounted, watch } from 'vue'
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
import mybus from '@/myplugins/mybus'
|
||||
import { defineComponent, reactive, ref, toRefs, onMounted, watch } from 'vue'
|
||||
|
||||
import { getIntegrationServicesList } from '@/api/home.js'
|
||||
import { useRouter } from 'vue-router'
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import searchResultList from '@/views/home/components/searchResultList.vue'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { getIntegrationServicesList } from '@/api/home.js'
|
||||
import { useRouter } from 'vue-router'
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import searchResultList from '@/views/home/components/searchResultList.vue'
|
||||
import CanAssignCase from '@/views/home/components/CanAssignCase.vue'
|
||||
import { message } from 'ant-design-vue'
|
||||
|
||||
export default defineComponent({
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
// 分页
|
||||
const loading = ref(true)
|
||||
|
|
@ -126,8 +162,8 @@ export default defineComponent({
|
|||
|
||||
// 获取融合服务列表
|
||||
const getIntegrationList = () => {
|
||||
loadingData.value = true;
|
||||
console.log('获取融合服务列表------------>');
|
||||
loadingData.value = true
|
||||
console.log('获取融合服务列表------------>')
|
||||
let postData = {
|
||||
limit: currentPageSize.value,
|
||||
page: currentPage.value,
|
||||
|
|
@ -138,17 +174,17 @@ export default defineComponent({
|
|||
}
|
||||
getIntegrationServicesList(postData).then(
|
||||
(res) => {
|
||||
loadingData.value = false;
|
||||
loadingData.value = false
|
||||
if (res.data.code !== 0) {
|
||||
return message.error(res.data.msg)
|
||||
}
|
||||
console.log('res.data------------>', res.data);
|
||||
console.log('res.data------------>', res.data)
|
||||
|
||||
resourceList.data = res.data.data.list || []
|
||||
resourceTotal.value = res.data.data.total || 0
|
||||
},
|
||||
(err) => {
|
||||
loadingData.value = false;
|
||||
loadingData.value = false
|
||||
message.error(err)
|
||||
}
|
||||
)
|
||||
|
|
@ -192,7 +228,7 @@ export default defineComponent({
|
|||
}
|
||||
|
||||
onMounted(() => {
|
||||
console.log('222----onMounted-------->', 222);
|
||||
console.log('222----onMounted-------->', 222)
|
||||
listKey2.value++
|
||||
getAppResources()
|
||||
})
|
||||
|
|
@ -235,6 +271,7 @@ export default defineComponent({
|
|||
HomeHeader,
|
||||
HomeFooter,
|
||||
searchResultList,
|
||||
CanAssignCase,
|
||||
},
|
||||
beforeUnmount() {
|
||||
mybus.off('paramsGetResources')
|
||||
|
|
@ -242,10 +279,10 @@ export default defineComponent({
|
|||
mybus.off('refresh')
|
||||
mybus.off('changePage')
|
||||
},
|
||||
})
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.resultListSearchInput-father {
|
||||
.resultListSearchInput-father {
|
||||
background: #f3f5f9;
|
||||
padding: 0.2rem;
|
||||
|
||||
|
|
@ -262,9 +299,9 @@ export default defineComponent({
|
|||
margin-top: 0.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.resultListSearchInput {
|
||||
.resultListSearchInput {
|
||||
margin-left: 0.1rem;
|
||||
|
||||
:deep(.ant-input) {
|
||||
|
|
@ -289,9 +326,9 @@ export default defineComponent({
|
|||
:deep(.ant-input-group-addon) {
|
||||
left: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.button-reset {
|
||||
.button-reset {
|
||||
border: 0;
|
||||
outline: none;
|
||||
width: 0.8rem;
|
||||
|
|
@ -304,9 +341,9 @@ export default defineComponent({
|
|||
line-height: 0.34rem;
|
||||
margin-left: 2.5rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.details-pageconetent {
|
||||
.details-pageconetent {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
|
@ -365,13 +402,13 @@ export default defineComponent({
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-card-grid) {
|
||||
:deep(.ant-card-grid) {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 1;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue