Compare commits
71 Commits
8a58e70fc6
...
307bd6c020
Author | SHA1 | Date |
---|---|---|
wuhongjian | 307bd6c020 | |
wuhongjian | 1f3774255a | |
a0049873 | 82249450c4 | |
gaoyuanwei | 36b161da4c | |
gaoyuanwei | de04c8ce33 | |
a0049873 | 331924e14e | |
gaoyuanwei | f45974d654 | |
a0049873 | e50dc1ad1f | |
a0049873 | 0b972d7bb9 | |
a0049873 | 55693b880f | |
a0049873 | 5f3c8d3556 | |
a0049873 | 91d3622d77 | |
gaoyuanwei | 3befb49a12 | |
gaoyuanwei | c4597f6cbd | |
wuhongjian | a2267a59bb | |
wuhongjian | ce3f7ec183 | |
a0049873 | 1e7aca42fd | |
a0049873 | f78f2f1292 | |
851673013@qq.com | bc55f39d38 | |
zhangzhuliang | b1aae6175b | |
guoyue | 810e183611 | |
guoyue | 0b718307d8 | |
guoyue | 3f3fc65ff5 | |
a0049873 | dc1b55de29 | |
guoyue | 607e119c61 | |
a0049873 | b99ec35e90 | |
851673013@qq.com | 6e2d146ca8 | |
wuhongjian | 2fe6aed0df | |
wuhongjian | 94cc9163cf | |
851673013@qq.com | f6bd2ba3ad | |
851673013@qq.com | 12bee09773 | |
851673013@qq.com | 469c6afd61 | |
gaoyuanwei | e1d18f8b27 | |
851673013@qq.com | 8bfae0915d | |
a0049873 | 1775286039 | |
851673013@qq.com | f21d694200 | |
a0049873 | 3160a0710f | |
851673013@qq.com | c4155bb364 | |
a0049873 | cdc3b9c215 | |
wuhongjian | e026c97a73 | |
wuhongjian | 5a32f96150 | |
851673013@qq.com | 31fd3b2511 | |
a0049873 | b91625bae2 | |
a0049873 | 33243a5e00 | |
gaoyuanwei | 60d8b97335 | |
a0049873 | 4c4de0abea | |
851673013@qq.com | b4268c9961 | |
a0049873 | cbbcc43549 | |
a0049873 | 56b781cdfc | |
a0049873 | 27573355d2 | |
851673013@qq.com | 064b71c6fc | |
guoyue | b3769f2415 | |
guoyue | 2e79549ae1 | |
851673013@qq.com | c449977b34 | |
851673013@qq.com | 5cfffccfe8 | |
851673013@qq.com | 7e61899d24 | |
gaoyuanwei | d2d18fc0a6 | |
guoyue | b7afa338a6 | |
guoyue | a9e3582db2 | |
guoyue | 141378eaee | |
a0049873 | ca4c907d8a | |
851673013@qq.com | b1c6383f31 | |
851673013@qq.com | cfa2f69b80 | |
851673013@qq.com | 11a555200c | |
851673013@qq.com | 2ee3a34b94 | |
guoyue | 635f25cb8d | |
guoyue | 0864e8a1ca | |
851673013@qq.com | 01f36b7586 | |
guoyue | b90e3377a2 | |
guoyue | dae78b5513 | |
851673013@qq.com | 06e9ade25d |
|
@ -53,10 +53,8 @@
|
||||||
<div class="title">
|
<div class="title">
|
||||||
组合能力
|
组合能力
|
||||||
</div>
|
</div>
|
||||||
<!-- <combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="基础设施" ref="jcssDom"
|
|
||||||
:getDataParams="getListParams['基础设施']"></combine-ability> -->
|
|
||||||
<InfrastructureModal v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="基础设施"
|
<InfrastructureModal v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="基础设施"
|
||||||
ref="jcssDom"></InfrastructureModal>
|
:modalType="modalType" ref="jcssDom"></InfrastructureModal>
|
||||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="数据资源" ref="sjzyDom"
|
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="数据资源" ref="sjzyDom"
|
||||||
:getDataParams="getListParams['数据资源']"></combine-ability>
|
:getDataParams="getListParams['数据资源']"></combine-ability>
|
||||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="组件服务" ref="zjfwDom"
|
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="组件服务" ref="zjfwDom"
|
||||||
|
@ -279,6 +277,17 @@ export default {
|
||||||
}
|
}
|
||||||
let _imgObj = data.fuseAttrList.find(v => v.attrType == '服务图片') || {};
|
let _imgObj = data.fuseAttrList.find(v => v.attrType == '服务图片') || {};
|
||||||
this.imageUrl = _imgObj.attrValue;
|
this.imageUrl = _imgObj.attrValue;
|
||||||
|
|
||||||
|
// 组合能力
|
||||||
|
Object.keys(this.getListParams).map(k => {
|
||||||
|
let arr = data.fuseResourceList.filter(v => v.type == k);
|
||||||
|
let arr2 = [];
|
||||||
|
arr.map(v => {
|
||||||
|
arr2.push(v.resourceId)
|
||||||
|
})
|
||||||
|
this.abilityListObj[k] = arr2
|
||||||
|
})
|
||||||
|
|
||||||
console.log('this.dataForm----详情-------->', this.dataForm);
|
console.log('this.dataForm----详情-------->', this.dataForm);
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
@ -287,14 +296,10 @@ export default {
|
||||||
file.type === 'image/jpeg' ||
|
file.type === 'image/jpeg' ||
|
||||||
file.type === 'image/jpg' ||
|
file.type === 'image/jpg' ||
|
||||||
file.type === 'image/png'
|
file.type === 'image/png'
|
||||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
|
||||||
|
|
||||||
if (!isImage) {
|
if (!isImage) {
|
||||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||||
}
|
}
|
||||||
// if (!isLt2M) {
|
|
||||||
// this.$message.error('上传头像图片大小不能超过 2MB!')
|
|
||||||
// }
|
|
||||||
return isImage
|
return isImage
|
||||||
},
|
},
|
||||||
addUploadRemoveFile(file, fileList) {
|
addUploadRemoveFile(file, fileList) {
|
||||||
|
@ -306,14 +311,9 @@ export default {
|
||||||
file.type === 'image/jpeg' ||
|
file.type === 'image/jpeg' ||
|
||||||
file.type === 'image/jpg' ||
|
file.type === 'image/jpg' ||
|
||||||
file.type === 'image/png'
|
file.type === 'image/png'
|
||||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
|
||||||
|
|
||||||
if (!isImage) {
|
if (!isImage) {
|
||||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||||
}
|
}
|
||||||
// if (!isLt2M) {
|
|
||||||
// this.$message.error('上传头像图片大小不能超过 2MB!')
|
|
||||||
// }
|
|
||||||
return isImage
|
return isImage
|
||||||
},
|
},
|
||||||
editUploadRemoveFile(file, fileList) {
|
editUploadRemoveFile(file, fileList) {
|
||||||
|
|
|
@ -55,8 +55,8 @@ import qs from "qs";
|
||||||
import { type } from "os";
|
import { type } from "os";
|
||||||
|
|
||||||
export const tableColumns = {
|
export const tableColumns = {
|
||||||
'name': '融合服务名称',
|
'name': '名称',
|
||||||
'description': '融合服务描述',
|
'description': '描述',
|
||||||
'applicationArea': '应用领域',
|
'applicationArea': '应用领域',
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -140,7 +140,7 @@ export default {
|
||||||
},
|
},
|
||||||
// 详情
|
// 详情
|
||||||
showDetail(val) {
|
showDetail(val) {
|
||||||
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + val.id)
|
window.open(window.SITE_CONFIG.previewUrl + '#/packagingDetails?id=' + val.id)
|
||||||
},
|
},
|
||||||
// showDocument(val) {
|
// showDocument(val) {
|
||||||
// console.log(val);
|
// console.log(val);
|
||||||
|
|
|
@ -62,7 +62,7 @@
|
||||||
组合能力
|
组合能力
|
||||||
</div>
|
</div>
|
||||||
<InfrastructureModal v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="基础设施"
|
<InfrastructureModal v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="基础设施"
|
||||||
ref="jcssDom"></InfrastructureModal>
|
:modalType="modalType" ref="jcssDom"></InfrastructureModal>
|
||||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="数据资源" ref="sjzyDom"
|
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="数据资源" ref="sjzyDom"
|
||||||
:getDataParams="getListParams['数据资源']"></combine-ability>
|
:getDataParams="getListParams['数据资源']"></combine-ability>
|
||||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="组件服务" ref="zjfwDom"
|
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="组件服务" ref="zjfwDom"
|
||||||
|
@ -269,6 +269,7 @@ export default {
|
||||||
handler(newVal) {
|
handler(newVal) {
|
||||||
this.addOrUpdateVisibleCopy = newVal;
|
this.addOrUpdateVisibleCopy = newVal;
|
||||||
if (this.modalType == 'add' && newVal) {
|
if (this.modalType == 'add' && newVal) {
|
||||||
|
localStorage.setItem('InfrastructureSearchData', JSON.stringify({}))
|
||||||
this.getDetail(this.dataForm)
|
this.getDetail(this.dataForm)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -333,6 +334,7 @@ export default {
|
||||||
let _obj = Object.assign({}, this.dataForm, {
|
let _obj = Object.assign({}, this.dataForm, {
|
||||||
type: '赋能场景'
|
type: '赋能场景'
|
||||||
})
|
})
|
||||||
|
console.log('this.dataForm------表单提交------>', this.dataForm);
|
||||||
this.$http
|
this.$http
|
||||||
[methodsObj[this.modalType]]("/fuse", _obj)
|
[methodsObj[this.modalType]]("/fuse", _obj)
|
||||||
.then(({ data: res }) => {
|
.then(({ data: res }) => {
|
||||||
|
@ -360,14 +362,24 @@ export default {
|
||||||
),
|
),
|
||||||
// 详情
|
// 详情
|
||||||
getDetail(data) {
|
getDetail(data) {
|
||||||
|
console.log('data---详情--------->', data);
|
||||||
this.dataForm = data;
|
this.dataForm = data;
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
for (const key in this.refsParseArray) {
|
for (const key in this.refsParseArray) {
|
||||||
this.$refs[key] && this.$refs[key].getDataInfo && this.$refs[key].getDataInfo(data)
|
this.$refs[key] && this.$refs[key].getDataInfo && this.$refs[key].getDataInfo(data)
|
||||||
}
|
}
|
||||||
let _imgObj = data.fuseAttrList.find(v => v.attrType == '服务图片') || {};
|
let _imgObj = data.fuseAttrList.find(v => v.attrType == '服务图片') || {};
|
||||||
this.imageUrl = _imgObj.attrValue
|
this.imageUrl = _imgObj.attrValue;
|
||||||
console.log('this.dataForm----详情-------->', this.dataForm);
|
|
||||||
|
// 组合能力--特殊处理
|
||||||
|
Object.keys(this.getListParams).map(k => {
|
||||||
|
let arr = data.fuseResourceList.filter(v => v.type == k);
|
||||||
|
let arr2 = [];
|
||||||
|
arr.map(v => {
|
||||||
|
arr2.push(v.resourceId)
|
||||||
|
})
|
||||||
|
this.abilityListObj[k] = arr2
|
||||||
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
handleAvatarSuccess(res, file) {
|
handleAvatarSuccess(res, file) {
|
||||||
|
@ -381,14 +393,9 @@ export default {
|
||||||
file.type === 'image/jpeg' ||
|
file.type === 'image/jpeg' ||
|
||||||
file.type === 'image/jpg' ||
|
file.type === 'image/jpg' ||
|
||||||
file.type === 'image/png'
|
file.type === 'image/png'
|
||||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
|
||||||
|
|
||||||
if (!isImage) {
|
if (!isImage) {
|
||||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||||
}
|
}
|
||||||
// if (!isLt2M) {
|
|
||||||
// this.$message.error('上传头像图片大小不能超过 2MB!')
|
|
||||||
// }
|
|
||||||
return isImage
|
return isImage
|
||||||
},
|
},
|
||||||
addUploadRemoveFile(file, fileList) {
|
addUploadRemoveFile(file, fileList) {
|
||||||
|
@ -400,14 +407,10 @@ export default {
|
||||||
file.type === 'image/jpeg' ||
|
file.type === 'image/jpeg' ||
|
||||||
file.type === 'image/jpg' ||
|
file.type === 'image/jpg' ||
|
||||||
file.type === 'image/png'
|
file.type === 'image/png'
|
||||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
|
||||||
|
|
||||||
if (!isImage) {
|
if (!isImage) {
|
||||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||||
}
|
}
|
||||||
// if (!isLt2M) {
|
|
||||||
// this.$message.error('上传头像图片大小不能超过 2MB!')
|
|
||||||
// }
|
|
||||||
return isImage
|
return isImage
|
||||||
},
|
},
|
||||||
editUploadRemoveFile(file, fileList) {
|
editUploadRemoveFile(file, fileList) {
|
||||||
|
@ -419,7 +422,6 @@ export default {
|
||||||
return this.$message.error(res.msg)
|
return this.$message.error(res.msg)
|
||||||
}
|
}
|
||||||
this.imageUrl = res.data
|
this.imageUrl = res.data
|
||||||
// this.imageUrl = URL.createObjectURL(file.raw);
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
|
|
|
@ -2,7 +2,8 @@
|
||||||
<div>
|
<div>
|
||||||
<div class="top flex-row-start">
|
<div class="top flex-row-start">
|
||||||
<div class="type">{{ type }}</div>
|
<div class="type">{{ type }}</div>
|
||||||
<el-button type="primary" size="small" @click="showModal = true">添加</el-button>
|
<el-button type="primary" size="small" @click="showModal = true">{{ modalType == 'add' ? '添加' : '编辑' }}
|
||||||
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
<el-dialog class="modal-box" :visible.sync="showModal" title="请选择" @close="close" :close-on-click-modal="false"
|
<el-dialog class="modal-box" :visible.sync="showModal" title="请选择" @close="close" :close-on-click-modal="false"
|
||||||
:close-on-press-escape="false" :key="showKey" append-to-body>
|
:close-on-press-escape="false" :key="showKey" append-to-body>
|
||||||
|
@ -34,8 +35,8 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-row-start" style="margin-bottom:10px;align-items: flex-start;">
|
<div class="flex-row-start" style="margin-bottom:10px;align-items: flex-start;">
|
||||||
<div class="left-text" style="margin-top: 10px;">关键词</div>
|
<div class="left-text" style="margin-top: 10px;">关键词</div>
|
||||||
<el-input style="margin-left:10px;width: 200px;" v-model="cameraName" placeholder="名称"
|
<el-input style="margin-left:10px;width: 200px;" v-model="searchData.cameraName"
|
||||||
clearable>
|
placeholder="名称" clearable>
|
||||||
</el-input>
|
</el-input>
|
||||||
<el-button type="primary" style="margin-left:10px;margin-top:4px" size="small" @click="getData">
|
<el-button type="primary" style="margin-left:10px;margin-top:4px" size="small" @click="getData">
|
||||||
搜索
|
搜索
|
||||||
|
@ -59,8 +60,8 @@
|
||||||
<el-table-column prop="nodeName" label="归属" header-align="center" align="center">
|
<el-table-column prop="nodeName" label="归属" header-align="center" align="center">
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
<el-pagination style="justify-content: center;display: flex;" :current-page="pageData.page"
|
<el-pagination style="justify-content: center;display: flex;" :current-page="searchData.pageNum"
|
||||||
:page-sizes="[10, 20, 50, 100]" :page-size="pageData.limit" :total="pageData.total"
|
:page-sizes="[10, 20, 50, 100]" :page-size="searchData.pageSize" :total="pageData.total"
|
||||||
layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
|
layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
|
||||||
@current-change="pageCurrentChangeHandle">
|
@current-change="pageCurrentChangeHandle">
|
||||||
</el-pagination>
|
</el-pagination>
|
||||||
|
@ -75,7 +76,7 @@
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
<DisplayList :displayList="displayList"></DisplayList>
|
<DisplayList :displayList="displayList" showKey="channelName"></DisplayList>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -98,6 +99,10 @@ export default {
|
||||||
type: String,
|
type: String,
|
||||||
default: "基础设施"
|
default: "基础设施"
|
||||||
},
|
},
|
||||||
|
modalType: {
|
||||||
|
type: String,
|
||||||
|
default: 'add'
|
||||||
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
const getYunList = () => {
|
const getYunList = () => {
|
||||||
|
@ -109,9 +114,7 @@ export default {
|
||||||
return {
|
return {
|
||||||
showKey: 0,
|
showKey: 0,
|
||||||
showModal: false,
|
showModal: false,
|
||||||
transferData: [], // 穿梭框所有数据
|
|
||||||
selectedArray: [], // 已选择的数据id
|
selectedArray: [], // 已选择的数据id
|
||||||
allData: [],
|
|
||||||
displayList: [], // 用于展示的list
|
displayList: [], // 用于展示的list
|
||||||
btnList: ['视频资源', '云资源', '感知资源'],
|
btnList: ['视频资源', '云资源', '感知资源'],
|
||||||
showText: {
|
showText: {
|
||||||
|
@ -133,35 +136,41 @@ export default {
|
||||||
list: []
|
list: []
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
activeBtn: '视频资源',
|
|
||||||
checkList: [],
|
|
||||||
currentList: [],
|
currentList: [],
|
||||||
dataListLoading: false,
|
dataListLoading: false,
|
||||||
dataList: [],
|
dataList: [],
|
||||||
pageData: {
|
pageData: {
|
||||||
limit: 10,
|
|
||||||
page: 1,
|
|
||||||
total: 0,
|
total: 0,
|
||||||
},
|
},
|
||||||
cameraName: '',
|
cameraName: '',
|
||||||
|
postData: {},
|
||||||
|
activeBtn: '视频资源',
|
||||||
|
checkList: [],
|
||||||
|
searchData: {
|
||||||
|
cameraName: '',
|
||||||
|
pageSize: 10,
|
||||||
|
pageNum: 1,
|
||||||
|
parentId: ''
|
||||||
|
},
|
||||||
|
dataFormCopy: {}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
async showModal(newVal) {
|
async showModal(newVal) {
|
||||||
if (newVal) {
|
if (newVal) {
|
||||||
await this.getData();
|
|
||||||
// 默认选中复选框
|
// 默认选中复选框
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.selectCheckbox()
|
this.selectCheckbox()
|
||||||
})
|
})
|
||||||
|
if (this.modalType == 'add') {
|
||||||
|
this.clear()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
// 获取视频资源
|
// 获取视频资源
|
||||||
this.getVideoBtn()
|
this.getVideoBtn()
|
||||||
// 获取列表
|
|
||||||
this.getData()
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
selectCheckbox() {
|
selectCheckbox() {
|
||||||
|
@ -176,24 +185,24 @@ export default {
|
||||||
})
|
})
|
||||||
if (list.length) {
|
if (list.length) {
|
||||||
list.forEach((row) => {
|
list.forEach((row) => {
|
||||||
this.$refs.dataTable.toggleRowSelection(row, true)
|
this.$refs.dataTable && this.$refs.dataTable.toggleRowSelection(row, true)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
showAction() {
|
||||||
|
this.showModal = true;
|
||||||
|
},
|
||||||
|
// 详情
|
||||||
async getDataInfo(dataForm) {
|
async getDataInfo(dataForm) {
|
||||||
|
this.modalType == 'edit'
|
||||||
|
this.dataFormCopy = dataForm;
|
||||||
await this.getVideoBtn();
|
await this.getVideoBtn();
|
||||||
await this.getData();
|
|
||||||
let arr = [];
|
let arr = [];
|
||||||
let attrValue = dataForm.fuseResourceList.filter(v => v.type == this.type);
|
let attrValue = dataForm.fuseResourceList.filter(v => v.type == this.type);
|
||||||
if (attrValue.length > 0) {
|
if (attrValue.length > 0) {
|
||||||
attrValue.map(val => {
|
attrValue.map(val => {
|
||||||
let item = this.dataList.find(v => v.idtCameraChannel == val.resourceId) || {};
|
let _obj = Object.assign({}, val, val.resource)
|
||||||
let _obj = {
|
|
||||||
type: val.type,
|
|
||||||
idtCameraChannel: val.resourceId,
|
|
||||||
name: item.channelName
|
|
||||||
};
|
|
||||||
arr.push(_obj);
|
arr.push(_obj);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -201,28 +210,31 @@ export default {
|
||||||
this.displayList = JSON.parse(JSON.stringify(arr));
|
this.displayList = JSON.parse(JSON.stringify(arr));
|
||||||
// 已选中
|
// 已选中
|
||||||
this.selectedArray = arr.map(v => v.idtCameraChannel);
|
this.selectedArray = arr.map(v => v.idtCameraChannel);
|
||||||
},
|
this.dataList = JSON.parse(JSON.stringify(arr));
|
||||||
handleShowModal() {
|
this.pageData.total = arr.length;
|
||||||
this.showModal = true;
|
// 默认选中复选框
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.selectCheckbox()
|
||||||
|
})
|
||||||
},
|
},
|
||||||
// 点击复选框
|
// 点击复选框
|
||||||
dataListSelectionChangeHandle(data) {
|
dataListSelectionChangeHandle(data) {
|
||||||
this.selectedArray = data;
|
this.selectedArray = data;
|
||||||
},
|
},
|
||||||
pageCurrentChangeHandle(page) {
|
pageCurrentChangeHandle(pageNum) {
|
||||||
this.pageData.page = page;
|
this.searchData.pageNum = pageNum;
|
||||||
this.getData()
|
this.getData()
|
||||||
},
|
},
|
||||||
pageSizeChangeHandle(limit) {
|
pageSizeChangeHandle(pageSize) {
|
||||||
this.pageData.limit = limit;
|
this.searchData.pageSize = pageSize;
|
||||||
this.getData()
|
this.getData()
|
||||||
},
|
},
|
||||||
changeBtn(btn) {
|
changeBtn(btn) {
|
||||||
this.activeBtn = btn;
|
this.activeBtn = btn;
|
||||||
|
this.currentList = this.tabData.find(v => v.tabName == btn).list || [];
|
||||||
this.checkList = [];
|
this.checkList = [];
|
||||||
this.cameraName = '';
|
this.searchData.cameraName = '';
|
||||||
this.getData()
|
this.getData()
|
||||||
this.currentList = this.tabData.find(v => v.tabName == btn).list || []
|
|
||||||
},
|
},
|
||||||
// 获取视频标签列表
|
// 获取视频标签列表
|
||||||
getVideoBtn() {
|
getVideoBtn() {
|
||||||
|
@ -234,7 +246,12 @@ export default {
|
||||||
}
|
}
|
||||||
this.tabData[0].list = res.data.data || [];
|
this.tabData[0].list = res.data.data || [];
|
||||||
|
|
||||||
this.changeBtn(this.activeBtn)
|
this.$nextTick(() => {
|
||||||
|
this.currentList = this.tabData.find(v => v.tabName == this.activeBtn).list || [];
|
||||||
|
if (this.modalType == 'add') {
|
||||||
|
this.clear()
|
||||||
|
}
|
||||||
|
})
|
||||||
}).catch(err => {
|
}).catch(err => {
|
||||||
reject(err)
|
reject(err)
|
||||||
this.$message.error(err);
|
this.$message.error(err);
|
||||||
|
@ -255,23 +272,19 @@ export default {
|
||||||
} else {
|
} else {
|
||||||
this.checkList.push(item.labelCode)
|
this.checkList.push(item.labelCode)
|
||||||
}
|
}
|
||||||
console.log('this.checkList------------>', this.checkList);
|
this.$nextTick(() => {
|
||||||
this.getData()
|
this.getData()
|
||||||
|
})
|
||||||
},
|
},
|
||||||
// 获取列表
|
// 获取列表
|
||||||
getData(parentId = '') {
|
getData() {
|
||||||
this.allData = [];
|
let postData = Object.assign({}, {
|
||||||
let postData = {
|
|
||||||
parentId: parentId,
|
|
||||||
cameraName: this.cameraName,
|
|
||||||
checkStatus: 1,
|
checkStatus: 1,
|
||||||
pageNum: this.pageData.page,
|
|
||||||
pageSize: this.pageData.limit,
|
|
||||||
gpsX: '',
|
gpsX: '',
|
||||||
gpsY: '',
|
gpsY: '',
|
||||||
radius: '',
|
radius: '',
|
||||||
labelCodes: this.checkList.join(),
|
labelCodes: this.checkList.join(),
|
||||||
}
|
}, this.searchData);
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
this.$http.get('/api/project/selectByParentIdNew', { params: postData }).then(res => {
|
this.$http.get('/api/project/selectByParentIdNew', { params: postData }).then(res => {
|
||||||
resolve(res)
|
resolve(res)
|
||||||
|
@ -285,10 +298,9 @@ export default {
|
||||||
this.$message.error(err);
|
this.$message.error(err);
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
},
|
},
|
||||||
changeParentId(parentId) {
|
changeParentId(parentId) {
|
||||||
console.log('parentId------------>', parentId);
|
this.searchData.parentId = parentId;
|
||||||
this.getData(parentId)
|
this.getData(parentId)
|
||||||
},
|
},
|
||||||
confirmSubmitHandle() {
|
confirmSubmitHandle() {
|
||||||
|
@ -301,7 +313,7 @@ export default {
|
||||||
this.dataList.map(v => {
|
this.dataList.map(v => {
|
||||||
if (idtCameraChannelArray.includes(v.idtCameraChannel)) {
|
if (idtCameraChannelArray.includes(v.idtCameraChannel)) {
|
||||||
this.displayList.push({
|
this.displayList.push({
|
||||||
name: v.channelName
|
channelName: v.channelName
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
@ -312,16 +324,12 @@ export default {
|
||||||
},
|
},
|
||||||
close() {
|
close() {
|
||||||
this.showModal = false;
|
this.showModal = false;
|
||||||
this.cameraName = ''
|
this.searchData.cameraName = ''
|
||||||
this.selectedArray = [];
|
this.selectedArray = [];
|
||||||
this.allData = [];
|
|
||||||
this.transferData = [];
|
|
||||||
this.$emit('closeModal');
|
this.$emit('closeModal');
|
||||||
},
|
},
|
||||||
clear() {
|
clear() {
|
||||||
this.cameraName = ''
|
this.changeBtn('视频资源')
|
||||||
this.selectedArray = [];
|
|
||||||
this.getData()
|
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -130,7 +130,7 @@ export default {
|
||||||
},
|
},
|
||||||
// 详情
|
// 详情
|
||||||
showDetail(val) {
|
showDetail(val) {
|
||||||
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + val.id)
|
window.open(window.SITE_CONFIG.previewUrl + '#/integrationServicesDetails?id=' + val.id)
|
||||||
},
|
},
|
||||||
fullScreen() {
|
fullScreen() {
|
||||||
if (window.outerHeight === screen.availHeight) {
|
if (window.outerHeight === screen.availHeight) {
|
||||||
|
|
|
@ -129,13 +129,13 @@
|
||||||
width="150"
|
width="150"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<!-- <el-button
|
<el-button
|
||||||
v-if="$hasPermission('ability:bsabilityai:update')"
|
v-if="scope.row.infoList.filter(val=>val.attrType=='组件类型')[0].attrValue == '智能算法'"
|
||||||
type="text"
|
type="text"
|
||||||
size="small"
|
size="small"
|
||||||
@click="UpdateHandle(scope.row)"
|
@click="toppingCapacity(scope.row)"
|
||||||
>{{ $t("update") }}</el-button
|
>置顶</el-button
|
||||||
> -->
|
>
|
||||||
<el-button
|
<el-button
|
||||||
v-if="$hasPermission('ability:bsabilityai:update')"
|
v-if="$hasPermission('ability:bsabilityai:update')"
|
||||||
type="text"
|
type="text"
|
||||||
|
@ -314,6 +314,23 @@ export default {
|
||||||
// this.fullScreen()
|
// this.fullScreen()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 置顶
|
||||||
|
toppingCapacity (item) {
|
||||||
|
this.$http.put('/resource/pin_top/' + item.id).then(res => {
|
||||||
|
console.log('置顶', res.data.code)
|
||||||
|
if (res.data.code == 0) {
|
||||||
|
this.$message({
|
||||||
|
message: '置顶成功',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.$message({
|
||||||
|
message: '置顶失败',
|
||||||
|
type: 'warning'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
reset () {
|
reset () {
|
||||||
this.$http
|
this.$http
|
||||||
.get(
|
.get(
|
||||||
|
|
|
@ -23,20 +23,7 @@
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
<DisplayList></DisplayList>
|
<DisplayList :displayList="displayList" showKey="name"></DisplayList>
|
||||||
|
|
||||||
<div class="show-box" v-if="displayList.length > 0">
|
|
||||||
<div class="list-box">
|
|
||||||
<div v-for="(item, i) in displayList" :key="i">
|
|
||||||
<el-tooltip popper-class="testTooltip" effect="dark" :content="item.name || '--'" placement="top">
|
|
||||||
<div class="list-item">
|
|
||||||
{{ item.name || '--' }}
|
|
||||||
</div>
|
|
||||||
</el-tooltip>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -149,8 +136,8 @@ let keyObj = {
|
||||||
nameKey: 'zyname'
|
nameKey: 'zyname'
|
||||||
},
|
},
|
||||||
'组件服务': {
|
'组件服务': {
|
||||||
idKey: 'zycode',
|
idKey: 'id',
|
||||||
nameKey: 'zyname'
|
nameKey: 'name'
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -204,15 +191,15 @@ export default {
|
||||||
let attrValue = dataForm.fuseResourceList.filter(v => v.type == this.type);
|
let attrValue = dataForm.fuseResourceList.filter(v => v.type == this.type);
|
||||||
if (attrValue.length > 0) {
|
if (attrValue.length > 0) {
|
||||||
attrValue.map(val => {
|
attrValue.map(val => {
|
||||||
let item = this.allData.find(v => v.id == val.resourceId) || {};
|
|
||||||
let _obj = {
|
let _obj = {
|
||||||
type: val.type,
|
type: val.type,
|
||||||
id: val.resourceId,
|
id: val.resourceId,
|
||||||
name: item.name
|
name: val.resource && val.resource.name
|
||||||
};
|
};
|
||||||
arr.push(_obj);
|
arr.push(_obj);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// 展示
|
// 展示
|
||||||
this.displayList = JSON.parse(JSON.stringify(arr));
|
this.displayList = JSON.parse(JSON.stringify(arr));
|
||||||
// 已选中
|
// 已选中
|
||||||
|
@ -223,27 +210,17 @@ export default {
|
||||||
},
|
},
|
||||||
// 获取列表
|
// 获取列表
|
||||||
getData() {
|
getData() {
|
||||||
// this.allData = [];
|
|
||||||
// this.transferData = [];
|
|
||||||
// let arr = JSON.parse(JSON.stringify(sjzyArray));
|
|
||||||
// arr.map(v => {
|
|
||||||
// this.transferData.push({
|
|
||||||
// type: this.type,
|
|
||||||
// id: v[keyObj[this.type].idKey],
|
|
||||||
// name: v[keyObj[this.type].nameKey] || "--"
|
|
||||||
// });
|
|
||||||
// });
|
|
||||||
// this.allData = JSON.parse(JSON.stringify(this.transferData));
|
|
||||||
// return;
|
|
||||||
if (this.getDataParams.url === '') {
|
if (this.getDataParams.url === '') {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.$http[this.getDataParams.methods](this.getDataParams.url, this.getDataParams.postData).then(res => {
|
this.$http[this.getDataParams.methods](this.getDataParams.url, {
|
||||||
|
params: this.getDataParams.postData
|
||||||
|
}).then(res => {
|
||||||
console.log('res.data----获取列表-------->', res.data);
|
console.log('res.data----获取列表-------->', res.data);
|
||||||
if (res.data.code !== 0) {
|
if (res.data.code !== 0) {
|
||||||
return this.$message.error(res.msg);
|
return this.$message.error(res.msg);
|
||||||
}
|
}
|
||||||
this.transferData = []; // allData
|
this.transferData = [];
|
||||||
this.allData = [];
|
this.allData = [];
|
||||||
(res.data.data || []).map(v => {
|
(res.data.data || []).map(v => {
|
||||||
this.transferData.push({
|
this.transferData.push({
|
||||||
|
|
|
@ -0,0 +1,330 @@
|
||||||
|
<template>
|
||||||
|
<el-card shadow="never" class="roomBox">
|
||||||
|
<div class="roomExamineSearch">
|
||||||
|
<el-input
|
||||||
|
v-model="roomName"
|
||||||
|
style="width: 160px"
|
||||||
|
placeholder="请输入会议室名称"
|
||||||
|
></el-input>
|
||||||
|
<el-select
|
||||||
|
v-model="value"
|
||||||
|
style="width: 160px"
|
||||||
|
clearable
|
||||||
|
placeholder="请选择审核状态"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in options"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
>
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
<el-button type="primary" @click="searchData">查询</el-button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<el-table border style="width: 100%" :data="tableData">
|
||||||
|
<el-table-column
|
||||||
|
label="申请人"
|
||||||
|
prop="name"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
label="申请部门"
|
||||||
|
prop="dept"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
label="申请会议室"
|
||||||
|
prop="roomName"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
label="申请时段"
|
||||||
|
prop="bookDate"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
label="申请状态"
|
||||||
|
prop="state"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
:formatter="formatter"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
:label="$t('handle')"
|
||||||
|
fixed="right"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
width="150"
|
||||||
|
>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
@click="taskDetails(scope.row, scope.row.state)"
|
||||||
|
>{{ scope.row.state == '1' ? '处理' : '详情' }}</el-button
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<el-pagination
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="handleCurrentChange"
|
||||||
|
:page-sizes="[10, 20, 50]"
|
||||||
|
:page-size="100"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper"
|
||||||
|
:total="total"
|
||||||
|
>
|
||||||
|
</el-pagination>
|
||||||
|
</div>
|
||||||
|
<el-dialog
|
||||||
|
:title="lookData.roomName"
|
||||||
|
:visible.sync="dialogVisible"
|
||||||
|
width="50%"
|
||||||
|
>
|
||||||
|
<div class="modalResult" style="margin-bottom: 20px">处理结果</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
width: 100%;
|
||||||
|
height: 0.01rem;
|
||||||
|
border-top: 1px solid #ccc;
|
||||||
|
transform: scaleY(0.5);
|
||||||
|
"
|
||||||
|
></div>
|
||||||
|
<div
|
||||||
|
class="modalExamine"
|
||||||
|
style="display: flex; flex-direction: column; margin-top: 20px"
|
||||||
|
>
|
||||||
|
<span style="margin-bottom: 20px">
|
||||||
|
审核结果:{{ lookData.state === '2' ? '通过' : '不通过' }}
|
||||||
|
</span>
|
||||||
|
<span style="width: 90%; margin-bottom: 20px">
|
||||||
|
审核意见:{{ lookData.auditViem }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="modalYuyue" style="margin-bottom: 20px">预约信息</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
width: 100%;
|
||||||
|
height: 0.01rem;
|
||||||
|
border-top: 1px solid #ccc;
|
||||||
|
transform: scaleY(0.5);
|
||||||
|
"
|
||||||
|
></div>
|
||||||
|
<div class="modalTime" style="margin-bottom: 20px">
|
||||||
|
<div style="margin: 20px 0 20px 0">
|
||||||
|
预约日期:{{ lookData.bookDate }}
|
||||||
|
</div>
|
||||||
|
<div>预约时段:{{ lookData.startTime }}-{{ lookData.endTime }}</div>
|
||||||
|
<div
|
||||||
|
class="modalContent"
|
||||||
|
style="
|
||||||
|
width: 85%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin: 15px 0 15px 0;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<span>预约人:{{ lookData.name }}</span>
|
||||||
|
<span>联系方式:{{ lookData.phone }}</span>
|
||||||
|
<span>预约部门:{{ lookData.dept }}</span>
|
||||||
|
</div>
|
||||||
|
<div style="width: 800px; margin-bottom: 30px">
|
||||||
|
使用事项:{{ lookData.matter }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div style="display: flex; align-items: center">
|
||||||
|
<span>附件:</span>
|
||||||
|
<el-button
|
||||||
|
v-show="file != ''"
|
||||||
|
size="mini"
|
||||||
|
@click="downloadTemplate(file)"
|
||||||
|
>下载</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<el-dialog
|
||||||
|
:title="lookData.roomName"
|
||||||
|
:visible.sync="dialogVisibleChuli"
|
||||||
|
width="50%"
|
||||||
|
>
|
||||||
|
<div class="modalResult" style="margin-bottom: 10px">预约信息</div>
|
||||||
|
<div
|
||||||
|
style="
|
||||||
|
width: 100%;
|
||||||
|
height: 0.01rem;
|
||||||
|
border-top: 1px solid #ccc;
|
||||||
|
transform: scaleY(0.5);
|
||||||
|
"
|
||||||
|
></div>
|
||||||
|
<el-row style="display: flex; margin-top: 20px">
|
||||||
|
<el-col :span="8">预约日期:{{ lookData.bookDate }}</el-col>
|
||||||
|
<el-col :span="8"
|
||||||
|
>预约时段:{{ lookData.startTime }}-{{ lookData.endTime }}</el-col
|
||||||
|
>
|
||||||
|
</el-row>
|
||||||
|
<div class="modalTime">
|
||||||
|
<el-row class="modalContent" style="margin: 15px 0 15px 0">
|
||||||
|
<el-col :span="8">申请人:{{ lookData.name }}</el-col>
|
||||||
|
<el-col :span="8">联系方式:{{ lookData.phone }}</el-col>
|
||||||
|
<el-col :span="8">申请部门:{{ lookData.dept }}</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row style="margin-bottom: 30px">
|
||||||
|
<el-col :span="24"> 使用事项:{{ lookData.matter }} </el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="2">审核结果:</el-col>
|
||||||
|
<el-col :span="8" style="display: flex">
|
||||||
|
<el-radio v-model="radio" label="2">通过</el-radio>
|
||||||
|
<el-radio v-model="radio" label="3">不通过</el-radio>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row style="display: flex; margin-top: 20px">
|
||||||
|
<el-col :span="2">审核意见:</el-col>
|
||||||
|
<el-col :span="16">
|
||||||
|
<el-input type="textarea" v-model="desc"></el-input>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="No">取 消</el-button>
|
||||||
|
<el-button type="primary" @click="ok">确 定</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</el-card>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import Cookies from 'js-cookie'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
value: '1',
|
||||||
|
label: '待审核',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '0',
|
||||||
|
label: '审核完成',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
value: '',
|
||||||
|
limit: 10,
|
||||||
|
page: 1,
|
||||||
|
total: 0,
|
||||||
|
roomName: '',
|
||||||
|
tableData: [],
|
||||||
|
dialogVisible: false,
|
||||||
|
dialogVisibleChuli: false,
|
||||||
|
lookData: {},
|
||||||
|
radio: '2',
|
||||||
|
desc: '',
|
||||||
|
id: '',
|
||||||
|
num: '',
|
||||||
|
file: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getSerach()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getSerach() {
|
||||||
|
this.$http
|
||||||
|
.get(
|
||||||
|
`/bookMeeting/auditPage?page=${this.page}&limit=${this.limit}&roomName=${this.roomName}&state=${this.value}`
|
||||||
|
)
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
console.log(res, 7777777)
|
||||||
|
this.tableData = res.data.list
|
||||||
|
this.total = res.data.total
|
||||||
|
})
|
||||||
|
},
|
||||||
|
downloadTemplate(file) {
|
||||||
|
// window.SITE_CONFIG.apiURL +
|
||||||
|
window.open(`${file}?token=` + Cookies.get('ucsToken'))
|
||||||
|
},
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.limit = val
|
||||||
|
this.getSerach()
|
||||||
|
},
|
||||||
|
handleCurrentChange(val) {
|
||||||
|
this.page = val
|
||||||
|
this.getSerach()
|
||||||
|
},
|
||||||
|
searchData() {
|
||||||
|
this.getSerach()
|
||||||
|
},
|
||||||
|
taskDetails(item, num) {
|
||||||
|
if (num == '1') {
|
||||||
|
this.dialogVisibleChuli = true
|
||||||
|
this.id = item.id
|
||||||
|
} else {
|
||||||
|
this.dialogVisible = true
|
||||||
|
this.$http.get(`bookMeeting/${item.id}`).then(({ data: res }) => {
|
||||||
|
console.log(55555555)
|
||||||
|
this.file = res.data.file
|
||||||
|
})
|
||||||
|
}
|
||||||
|
this.lookData = item
|
||||||
|
},
|
||||||
|
|
||||||
|
ok() {
|
||||||
|
let query = {
|
||||||
|
auditViem: this.desc,
|
||||||
|
state: this.radio,
|
||||||
|
id: this.id,
|
||||||
|
}
|
||||||
|
this.$http.put('/bookMeeting', query).then(({ data: res }) => {
|
||||||
|
this.dialogVisibleChuli = false
|
||||||
|
this.radio = '2'
|
||||||
|
this.desc = ''
|
||||||
|
this.getSerach()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
No() {
|
||||||
|
this.radio = '2'
|
||||||
|
this.desc = ''
|
||||||
|
this.dialogVisibleChuli = false
|
||||||
|
},
|
||||||
|
formatter(row, column) {
|
||||||
|
return row.state == '1' ? '待审核' : '审核完成'
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.roomBox {
|
||||||
|
min-height: calc(calc(100vh - 50px - 38px - 30px));
|
||||||
|
.roomHeadSpan {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.roomExamineSearch {
|
||||||
|
display: flex;
|
||||||
|
width: 410px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.dialog-footer {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 40px;
|
||||||
|
}
|
||||||
|
// ::v-deep .el-input {
|
||||||
|
// margin-right: 15px;
|
||||||
|
// display: inline-block;
|
||||||
|
// }
|
||||||
|
// ::v-deep .el-select {
|
||||||
|
// margin-right: 20px;
|
||||||
|
// display: inline-block;
|
||||||
|
// }
|
||||||
|
</style>
|
|
@ -86,11 +86,8 @@
|
||||||
width="150"
|
width="150"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||||
type="text"
|
>详情</el-button
|
||||||
size="small"
|
|
||||||
@click="showDetail(scope.row)"
|
|
||||||
>{{ $t('process.viewFlowImage') }}</el-button
|
|
||||||
>
|
>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
|
@ -86,11 +86,8 @@
|
||||||
width="150"
|
width="150"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||||
type="text"
|
>详情</el-button
|
||||||
size="small"
|
|
||||||
@click="showDetail(scope.row)"
|
|
||||||
>{{ $t('process.viewFlowImage') }}</el-button
|
|
||||||
>
|
>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
|
@ -86,11 +86,8 @@
|
||||||
width="150"
|
width="150"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||||
type="text"
|
>详情</el-button
|
||||||
size="small"
|
|
||||||
@click="showDetail(scope.row)"
|
|
||||||
>{{ $t('process.viewFlowImage') }}</el-button
|
|
||||||
>
|
>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
|
@ -86,11 +86,8 @@
|
||||||
width="150"
|
width="150"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||||
type="text"
|
>详情</el-button
|
||||||
size="small"
|
|
||||||
@click="showDetail(scope.row)"
|
|
||||||
>{{ $t('process.viewFlowImage') }}</el-button
|
|
||||||
>
|
>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
|
@ -86,11 +86,8 @@
|
||||||
width="150"
|
width="150"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||||
type="text"
|
>详情</el-button
|
||||||
size="small"
|
|
||||||
@click="showDetail(scope.row)"
|
|
||||||
>{{ $t('process.viewFlowImage') }}</el-button
|
|
||||||
>
|
>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
|
@ -0,0 +1,381 @@
|
||||||
|
<template>
|
||||||
|
<el-card shadow="never" class="roomBox">
|
||||||
|
<div>
|
||||||
|
<div slot="header" class="roomHeadSpan">
|
||||||
|
<span>会议室管理</span>
|
||||||
|
<el-button
|
||||||
|
style="float: right; padding: 5px 5px"
|
||||||
|
type="primary"
|
||||||
|
icon="el-icon-circle-plus-outline"
|
||||||
|
@click="addRooom"
|
||||||
|
>新增</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<el-table border style="width: 100%" :data="tableData">
|
||||||
|
<el-table-column
|
||||||
|
label="会议室名称"
|
||||||
|
prop="name"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
label="房间号"
|
||||||
|
prop="num"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
label="面积(m²)"
|
||||||
|
prop="area"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
label="可容纳人数(人)"
|
||||||
|
prop="capacity"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
:label="$t('handle')"
|
||||||
|
fixed="right"
|
||||||
|
header-align="center"
|
||||||
|
align="center"
|
||||||
|
width="150"
|
||||||
|
>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button type="text" size="small" @click="taskDetails(scope.row)"
|
||||||
|
>详情</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
@click="taskUpdate(scope.row)"
|
||||||
|
>{{ $t('update') }}</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
@click="taskDelete(scope.row)"
|
||||||
|
>{{ $t('delete') }}</el-button
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<el-dialog
|
||||||
|
@close="outDialog"
|
||||||
|
:title="
|
||||||
|
flge === 'add'
|
||||||
|
? '会议室新增'
|
||||||
|
: flge === 'look'
|
||||||
|
? '会议室详情'
|
||||||
|
: '会议室修改'
|
||||||
|
"
|
||||||
|
:visible.sync="dialogFormVisible"
|
||||||
|
>
|
||||||
|
<el-form
|
||||||
|
:model="ruleForm"
|
||||||
|
:label-position="labelPosition"
|
||||||
|
size="small"
|
||||||
|
:rules="rules"
|
||||||
|
ref="ruleForm"
|
||||||
|
:disabled="flge === 'look' ? true : flge === 'edit' ? false : false"
|
||||||
|
>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item
|
||||||
|
label="会议室名称"
|
||||||
|
prop="name"
|
||||||
|
:label-width="formLabelWidth"
|
||||||
|
>
|
||||||
|
<el-input v-model="ruleForm.name" style="width: 90%"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item
|
||||||
|
label="房间号"
|
||||||
|
prop="num"
|
||||||
|
:label-width="formLabelWidth"
|
||||||
|
>
|
||||||
|
<el-input v-model="ruleForm.num" style="width: 90%"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item
|
||||||
|
label="会议室面积"
|
||||||
|
prop="area"
|
||||||
|
:label-width="formLabelWidth"
|
||||||
|
>
|
||||||
|
<el-input v-model="ruleForm.area" style="width: 90%"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item
|
||||||
|
label="可容纳人数"
|
||||||
|
prop="capacity"
|
||||||
|
:label-width="formLabelWidth"
|
||||||
|
>
|
||||||
|
<el-input
|
||||||
|
v-model="ruleForm.capacity"
|
||||||
|
style="width: 90%"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col>
|
||||||
|
<el-form-item
|
||||||
|
label="描述"
|
||||||
|
prop="description"
|
||||||
|
:label-width="formLabelWidth"
|
||||||
|
>
|
||||||
|
<el-input
|
||||||
|
type="textarea"
|
||||||
|
v-model="ruleForm.description"
|
||||||
|
style="width: 96%"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col>
|
||||||
|
<el-form-item
|
||||||
|
label="会议室图片"
|
||||||
|
prop="pic"
|
||||||
|
:label-width="formLabelWidth"
|
||||||
|
>
|
||||||
|
<div v-if="flge != 'look'">
|
||||||
|
<span slot="tip" class="el-upload__tip">
|
||||||
|
支持图片类型,且不超过500kb
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<!-- :file-list="fileList" -->
|
||||||
|
<el-upload
|
||||||
|
v-if="flge != 'look'"
|
||||||
|
class="upload-demo"
|
||||||
|
accept=".jpg, .jpeg, .png"
|
||||||
|
:action="apiURL"
|
||||||
|
:on-preview="handlePictureCardPreview"
|
||||||
|
:on-success="onSuccess"
|
||||||
|
:on-remove="onRemove"
|
||||||
|
:file-list="fileList"
|
||||||
|
list-type="picture-card"
|
||||||
|
:limit="1"
|
||||||
|
>
|
||||||
|
<i class="el-icon-plus"></i>
|
||||||
|
</el-upload>
|
||||||
|
<el-dialog :visible.sync="dialogVisible">
|
||||||
|
<img width="100%" :src="picImg" alt="" />
|
||||||
|
</el-dialog>
|
||||||
|
<div
|
||||||
|
class="block"
|
||||||
|
style="width: 15rem; height: 10rem"
|
||||||
|
v-if="flge == 'look' && picImg != ''"
|
||||||
|
>
|
||||||
|
<el-image :src="picImg"></el-image>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<!-- <el-button @click="dialogFormVisible = false">取 消</el-button> -->
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
v-if="flge != 'look'"
|
||||||
|
@click="submitForm('ruleForm', flge)"
|
||||||
|
>保 存</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
<el-pagination
|
||||||
|
:current-page="page"
|
||||||
|
:page-sizes="[10, 20, 50, 100]"
|
||||||
|
:page-size="limit"
|
||||||
|
:total="total"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper"
|
||||||
|
@size-change="handleSizeChange"
|
||||||
|
@current-change="handleCurrentChange"
|
||||||
|
>
|
||||||
|
</el-pagination>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import Cookies from 'js-cookie'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
// let validatorImg = (rule, value, callback) => {
|
||||||
|
// console.log(value, 11111111)
|
||||||
|
// //验证器
|
||||||
|
// if (!this.checkImgSuccess) {
|
||||||
|
// //为true代表图片在 false报错
|
||||||
|
// callback(new Error('请上传图片'))
|
||||||
|
// } else {
|
||||||
|
// callback()
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
return {
|
||||||
|
apiURL:
|
||||||
|
window.SITE_CONFIG.apiURL + '/upload?token=' + Cookies.get('ucsToken'),
|
||||||
|
labelPosition: 'left',
|
||||||
|
dialogFormVisible: false,
|
||||||
|
// dialogImageUrl: '',
|
||||||
|
ruleForm: {
|
||||||
|
name: '',
|
||||||
|
num: '',
|
||||||
|
area: '',
|
||||||
|
capacity: '',
|
||||||
|
pic: '',
|
||||||
|
id: '',
|
||||||
|
},
|
||||||
|
limit: 10,
|
||||||
|
page: 1,
|
||||||
|
total: 0,
|
||||||
|
picImg: '',
|
||||||
|
tableData: [],
|
||||||
|
fileList: [],
|
||||||
|
rules: {
|
||||||
|
name: [
|
||||||
|
{ required: true, message: '请输入会议室名称', trigger: 'blur' },
|
||||||
|
{ min: 1, trigger: 'blur' },
|
||||||
|
],
|
||||||
|
area: [
|
||||||
|
{ required: true, message: '请输入会议室面积', trigger: 'blur' },
|
||||||
|
{ min: 1, trigger: 'blur' },
|
||||||
|
],
|
||||||
|
description: [
|
||||||
|
{ required: true, message: '请填写描述内容', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
formLabelWidth: '100px',
|
||||||
|
checkImgSuccess: true,
|
||||||
|
dialogVisible: false,
|
||||||
|
flge: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.queryData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 页面查询接口
|
||||||
|
queryData() {
|
||||||
|
this.$http
|
||||||
|
.get(`/meeting/page?limit=${this.limit}&page=${this.page}`)
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
this.total = res.data.total
|
||||||
|
this.tableData = res.data.list
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 分页
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.limit = val
|
||||||
|
this.queryData()
|
||||||
|
},
|
||||||
|
handleCurrentChange(val) {
|
||||||
|
this.page = val
|
||||||
|
this.queryData()
|
||||||
|
},
|
||||||
|
// 新增
|
||||||
|
addRooom() {
|
||||||
|
this.dialogFormVisible = true
|
||||||
|
this.flge = 'add'
|
||||||
|
this.ruleForm = {}
|
||||||
|
this.fileList = []
|
||||||
|
},
|
||||||
|
handlePictureCardPreview(file) {
|
||||||
|
this.dialogImageUrl = file.url
|
||||||
|
this.dialogVisible = true
|
||||||
|
},
|
||||||
|
//图片上传成功时钩子
|
||||||
|
onSuccess(response, file, fileList) {
|
||||||
|
this.ruleForm.pic = response.data
|
||||||
|
// this.$refs.ruleForm.clearValidate() //上传成功清除校验
|
||||||
|
this.checkImgSuccess = true
|
||||||
|
},
|
||||||
|
//图片删除时钩子
|
||||||
|
onRemove(file, fileList) {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
if (fileList.length == 0) {
|
||||||
|
this.checkImgSuccess = false //检查图片是否加载成功
|
||||||
|
// this.$refs.ruleForm.validate() //删除图片,重新触发校验
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 保存
|
||||||
|
submitForm(formName, i) {
|
||||||
|
console.log(i, 9999999)
|
||||||
|
this.$refs[formName].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
if (i === 'add') {
|
||||||
|
this.dialogFormVisible = false
|
||||||
|
this.$http.post('/meeting', this.ruleForm).then(({ data: res }) => {
|
||||||
|
this.queryData()
|
||||||
|
})
|
||||||
|
} else if (i === 'edit') {
|
||||||
|
this.dialogFormVisible = false
|
||||||
|
this.$http.put(`/meeting`, this.ruleForm).then(({ data: res }) => {
|
||||||
|
this.ruleForm = res.data
|
||||||
|
let imgUrl = { name: res.data.name, url: res.data.pic }
|
||||||
|
this.fileList.push(imgUrl)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.log('error submit!!')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 详情
|
||||||
|
taskDetails(row) {
|
||||||
|
this.ruleForm = {}
|
||||||
|
this.fileList = []
|
||||||
|
this.flge = 'look'
|
||||||
|
this.$http.get(`/meeting/${row.id}`).then(({ data: res }) => {
|
||||||
|
this.dialogFormVisible = true
|
||||||
|
this.ruleForm = res.data
|
||||||
|
if (res.data.pic != null) {
|
||||||
|
// let imgUrl = { name: res.data.name, url: res.data.pic }
|
||||||
|
// this.fileList.push(imgUrl)
|
||||||
|
this.picImg = res.data.pic
|
||||||
|
} else {
|
||||||
|
this.picImg = ''
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//修改
|
||||||
|
taskUpdate(row) {
|
||||||
|
this.dialogFormVisible = true
|
||||||
|
this.fileList = []
|
||||||
|
this.flge = 'edit'
|
||||||
|
this.ruleForm = row
|
||||||
|
if (row.pic != null) {
|
||||||
|
let imgUrl = { name: row.name, url: row.pic }
|
||||||
|
this.fileList.push(imgUrl)
|
||||||
|
} else {
|
||||||
|
this.fileList = []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//删除图片
|
||||||
|
taskDelete(row) {
|
||||||
|
console.log(row, '点击了删除')
|
||||||
|
this.$http
|
||||||
|
.put(`/meeting`, { delFlag: 1, id: row.id })
|
||||||
|
.then(({ data: res }) => {
|
||||||
|
this.queryData()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//监听关闭按钮时间
|
||||||
|
outDialog() {},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.roomBox {
|
||||||
|
min-height: calc(calc(100vh - 50px - 38px - 30px));
|
||||||
|
.roomHeadSpan {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .el-dialog__footer {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -48,14 +48,14 @@
|
||||||
{{ dataForm.content.applicationBackground || '--' }}</span
|
{{ dataForm.content.applicationBackground || '--' }}</span
|
||||||
></span>
|
></span>
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<!-- <p>
|
||||||
<span>
|
<span>
|
||||||
能力应用期望效果:<span>
|
能力应用期望效果:<span>
|
||||||
{{ dataForm.content.effectWish || '--' }}</span
|
{{ dataForm.content.effectWish || '--' }}</span
|
||||||
></span
|
></span
|
||||||
>
|
>
|
||||||
</p>
|
</p> -->
|
||||||
<p v-if="dataForm.content.enclosure" class="lastP">
|
<!-- <p v-if="dataForm.content.enclosure" class="lastP">
|
||||||
<span>
|
<span>
|
||||||
申请附件:<span>
|
申请附件:<span>
|
||||||
{{ dataForm.content.enclosure || '--'
|
{{ dataForm.content.enclosure || '--'
|
||||||
|
@ -64,7 +64,7 @@
|
||||||
</button></span
|
</button></span
|
||||||
></span
|
></span
|
||||||
>
|
>
|
||||||
</p>
|
</p> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -167,7 +167,8 @@ export default {
|
||||||
|
|
||||||
.dynamic-box {
|
.dynamic-box {
|
||||||
width: 770px;
|
width: 770px;
|
||||||
height: 335px;
|
height: 285px;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dynamicView {
|
.dynamicView {
|
||||||
|
@ -223,6 +224,9 @@ export default {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
color: #2b2b2b;
|
color: #2b2b2b;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
position: absolute;
|
||||||
|
right: 15px;
|
||||||
|
bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.recommendView {
|
.recommendView {
|
||||||
|
|
|
@ -1,56 +1,111 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="dept-box" :class="dataInfo.noMarginleft ? 'no-margin-left' : ''">
|
<div class="dept-box" :class="dataInfo.noMarginleft ? 'no-margin-left' : ''">
|
||||||
<div class="left-box"
|
<div
|
||||||
:style="{ 'background': dataInfo.bgColor, 'border-right': `1px solid ${dataInfo.borderColor}` }">
|
class="left-box"
|
||||||
<div class="content">
|
:style="{
|
||||||
<img class="img" :src="dataInfo.imgSrc" />
|
background: dataInfo.bgColor,
|
||||||
<div class="title">{{ title }}</div>
|
'border-right': `1px solid ${dataInfo.borderColor}`
|
||||||
<div class="flex-row-bottom">
|
}"
|
||||||
<span class="num" :style="{ 'color': dataInfo.textColor }">{{ formatNum(dataInfo.num) }}</span>
|
>
|
||||||
<span class="unit" :style="{ 'color': dataInfo.textColor }">{{ dataInfo.unit || '个' }}</span>
|
<div class="content">
|
||||||
</div>
|
<img class="img" :src="dataInfo.imgSrc" />
|
||||||
</div>
|
<div class="title">{{ title }}</div>
|
||||||
</div>
|
<div class="flex-row-bottom">
|
||||||
<div class="list-box" v-if="dataInfo.list.length > 0">
|
<span class="num" :style="{ color: dataInfo.textColor }">{{
|
||||||
<div v-for="(item, i) in dataInfo.list" :key="i">
|
formatNum(dataInfo.num)
|
||||||
<!-- 待办 -->
|
}}</span>
|
||||||
<el-tooltip effect="dark" v-if="dataInfo.type === 'todo'"
|
<span class="unit" :style="{ color: dataInfo.textColor }">{{
|
||||||
:content="(item.userName || '--')+'提交的'+(item.processDefinitionName|| '--')+(item.processDefinitionName!=='能力申请'&&item.processDefinitionName!=='能力需求申请'?'申请':'')"
|
dataInfo.unit || '个'
|
||||||
placement="top">
|
}}</span>
|
||||||
<div class="list-item ellipsis">
|
|
||||||
<!-- {{ `${(item.processDefinitionName || '--')}${item.taskName ? ('—' + item.taskName) : ''}` }} -->
|
|
||||||
{{(item.userName || '--')+'提交的'+(item.processDefinitionName|| '--')+(item.processDefinitionName!=='能力申请'&&item.processDefinitionName!=='能力需求申请'?'申请':'')}}
|
|
||||||
</div>
|
|
||||||
</el-tooltip>
|
|
||||||
<!-- 已办 -->
|
|
||||||
<el-tooltip effect="dark" v-else
|
|
||||||
:content="(item.startUserName||'--')+'提交的'+(item.processDefinitionName|| '--')+(item.processDefinitionName!=='能力申请'&&item.processDefinitionName!=='能力需求申请'?'申请':'')"
|
|
||||||
placement="top">
|
|
||||||
<div class="list-item ellipsis">
|
|
||||||
{{ (item.startUserName||'--')+'提交的'+(item.processDefinitionName|| '--')+(item.processDefinitionName!=='能力申请'&&item.processDefinitionName!=='能力需求申请'?'申请':'')}}
|
|
||||||
</div>
|
|
||||||
</el-tooltip>
|
|
||||||
</div>
|
|
||||||
<div class="more" @click="goPage(dataInfo.url)">
|
|
||||||
查看更多 >
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="list-box flex-row-center no-data" v-else>
|
|
||||||
暂无数据
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="list-box" v-if="dataInfo.list.length > 0">
|
||||||
|
<div v-for="(item, i) in dataInfo.list" :key="i">
|
||||||
|
<!-- 待办 -->
|
||||||
|
<el-tooltip
|
||||||
|
effect="dark"
|
||||||
|
v-if="dataInfo.type === 'todo'"
|
||||||
|
:content="
|
||||||
|
(item.userDeptName || '--') +
|
||||||
|
'提交“' +
|
||||||
|
(item.applyTitle || '--') +
|
||||||
|
'”' +
|
||||||
|
(item.processDefinitionName || '--') +
|
||||||
|
(item.processDefinitionName !== '能力申请' &&
|
||||||
|
item.processDefinitionName !== '能力需求申请'
|
||||||
|
? '申请'
|
||||||
|
: '')
|
||||||
|
"
|
||||||
|
placement="top"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="list-item ellipsis"
|
||||||
|
@click="workbenchFunction(item, item.processDefinitionName, '待办')"
|
||||||
|
>
|
||||||
|
<!-- {{ `${(item.processDefinitionName || '--')}${item.taskName ? ('—' + item.taskName) : ''}` }} -->
|
||||||
|
{{
|
||||||
|
(item.userDeptName || '--') +
|
||||||
|
'提交“' +
|
||||||
|
(item.applyTitle || '--') +
|
||||||
|
'”' +
|
||||||
|
(item.processDefinitionName || '--') +
|
||||||
|
(item.processDefinitionName !== '能力申请' &&
|
||||||
|
item.processDefinitionName !== '能力需求申请'
|
||||||
|
? '申请'
|
||||||
|
: '')
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
</el-tooltip>
|
||||||
|
<!-- 已办 -->
|
||||||
|
<el-tooltip
|
||||||
|
effect="dark"
|
||||||
|
v-else
|
||||||
|
:content="
|
||||||
|
(item.startUserDeptName || '--') +
|
||||||
|
'提交的' +
|
||||||
|
(item.processDefinitionName || '--') +
|
||||||
|
(item.processDefinitionName !== '能力申请' &&
|
||||||
|
item.processDefinitionName !== '能力需求申请'
|
||||||
|
? '申请'
|
||||||
|
: '')
|
||||||
|
"
|
||||||
|
placement="top"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="list-item ellipsis"
|
||||||
|
@click="workbenchFunction(item, item.processDefinitionName, '已办')"
|
||||||
|
>
|
||||||
|
{{
|
||||||
|
(item.startUserDeptName || '--') +
|
||||||
|
'提交的' +
|
||||||
|
(item.processDefinitionName || '--') +
|
||||||
|
(item.processDefinitionName !== '能力申请' &&
|
||||||
|
item.processDefinitionName !== '能力需求申请'
|
||||||
|
? '申请'
|
||||||
|
: '')
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
</el-tooltip>
|
||||||
|
</div>
|
||||||
|
<div class="more" @click="goPage(dataInfo.url)">查看更多 ></div>
|
||||||
|
</div>
|
||||||
|
<div class="list-box flex-row-center no-data" v-else>暂无数据</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
import bus from '@/views/bus.js'
|
||||||
|
import mixinViewModule from '@/mixins/view-module'
|
||||||
|
import processModule from '@/mixins/process-module'
|
||||||
export default {
|
export default {
|
||||||
|
mixins: [mixinViewModule, processModule],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {}
|
||||||
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
dataInfo: {
|
dataInfo: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: () => { }
|
default: () => {}
|
||||||
},
|
},
|
||||||
title: {
|
title: {
|
||||||
type: String,
|
type: String,
|
||||||
|
@ -58,6 +113,17 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 点击部门待办数据打开弹窗
|
||||||
|
workbenchFunction (item, name, nameSwitch) {
|
||||||
|
const data = item
|
||||||
|
data.taskName = name
|
||||||
|
data.activityId = data.startUserId
|
||||||
|
if (nameSwitch === '待办') {
|
||||||
|
this.getProcDefRouteSet(item, this.forwardHandleUrl)
|
||||||
|
} else {
|
||||||
|
this.getProcDefRouteSet(item, this.forwardDetail)
|
||||||
|
}
|
||||||
|
},
|
||||||
formatNum (num) {
|
formatNum (num) {
|
||||||
return num || num === 0 ? num : '--'
|
return num || num === 0 ? num : '--'
|
||||||
},
|
},
|
||||||
|
@ -155,6 +221,7 @@ export default {
|
||||||
border-bottom: 1px dashed #c6c6c6;
|
border-bottom: 1px dashed #c6c6c6;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: #212121;
|
color: #212121;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.more {
|
.more {
|
||||||
|
|
|
@ -18,6 +18,7 @@
|
||||||
"@ant-design/icons-vue": "^6.1.0",
|
"@ant-design/icons-vue": "^6.1.0",
|
||||||
"@element-plus/icons-vue": "^2.0.1",
|
"@element-plus/icons-vue": "^2.0.1",
|
||||||
"@turf/turf": "^6.5.0",
|
"@turf/turf": "^6.5.0",
|
||||||
|
"animate.css": "^4.1.1",
|
||||||
"ant-design-vue": "^3.1.0-rc.5",
|
"ant-design-vue": "^3.1.0-rc.5",
|
||||||
"axios": "^0.21.1",
|
"axios": "^0.21.1",
|
||||||
"clipboard": "^2.0.8",
|
"clipboard": "^2.0.8",
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
* @Author: hisense.wuhongjian
|
* @Author: hisense.wuhongjian
|
||||||
* @Date: 2022-03-29 16:45:25
|
* @Date: 2022-03-29 16:45:25
|
||||||
* @LastEditors: hisense.wuhongjian
|
* @LastEditors: hisense.wuhongjian
|
||||||
* @LastEditTime: 2022-08-08 09:19:02
|
* @LastEditTime: 2022-08-16 09:56:58
|
||||||
* @Description: 告诉大家这是什么
|
* @Description: 告诉大家这是什么
|
||||||
-->
|
-->
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
|
@ -33,7 +33,8 @@
|
||||||
// window.SITE_CONFIG['previewUrl'] = 'http://15.72.183.90:7008/';
|
// window.SITE_CONFIG['previewUrl'] = 'http://15.72.183.90:7008/';
|
||||||
// window.SITE_CONFIG['frontUrl'] = 'http://15.72.183.90:7008/document/#/devModelFile/';
|
// window.SITE_CONFIG['frontUrl'] = 'http://15.72.183.90:7008/document/#/devModelFile/';
|
||||||
// window.SITE_CONFIG['apiURL'] = 'http://15.72.183.90:8000/renren-admin';
|
// window.SITE_CONFIG['apiURL'] = 'http://15.72.183.90:8000/renren-admin';
|
||||||
// window.SITE_CONFIG['POI_URL'] = 'http://15.72.178.129:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
|
// window.SITE_CONFIG['websocketURL'] = '15.72.183.90:8000/renren-admin';
|
||||||
|
window.SITE_CONFIG['POI_URL'] = 'http://15.72.178.129:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
|
||||||
// 包头
|
// 包头
|
||||||
// window.SITE_CONFIG['backUrl'] = 'http://10.110.205.1:8001';
|
// window.SITE_CONFIG['backUrl'] = 'http://10.110.205.1:8001';
|
||||||
// window.SITE_CONFIG['previewUrl'] = 'http://10.110.205.1:8002/';
|
// window.SITE_CONFIG['previewUrl'] = 'http://10.110.205.1:8002/';
|
||||||
|
@ -53,18 +54,11 @@
|
||||||
// window.SITE_CONFIG['frontUrl'] = 'http://10.134.135.9:9796/document/#/devModelFile/';
|
// window.SITE_CONFIG['frontUrl'] = 'http://10.134.135.9:9796/document/#/devModelFile/';
|
||||||
// window.SITE_CONFIG['apiURL'] = 'http://10.134.135.9:8888/renren-admin';
|
// window.SITE_CONFIG['apiURL'] = 'http://10.134.135.9:8888/renren-admin';
|
||||||
// 开发
|
// 开发
|
||||||
// window.SITE_CONFIG['backUrl'] = 'http://localhost:8001';
|
window.SITE_CONFIG['backUrl'] = 'http://localhost:8001';
|
||||||
// window.SITE_CONFIG['previewUrl'] = 'http://15.2.21.236:9796/';
|
window.SITE_CONFIG['previewUrl'] = 'http://192.168.124.236:9796/';
|
||||||
// window.SITE_CONFIG['frontUrl'] = 'http://15.2.21.236:9796/document/#/devModelFile/';
|
window.SITE_CONFIG['frontUrl'] = 'http://192.168.124.236:9796/document/#/devModelFile/';
|
||||||
// window.SITE_CONFIG['apiURL'] = 'http://15.2.21.236:8888/renren-admin';
|
window.SITE_CONFIG['apiURL'] = 'http://192.168.124.236:8888/renren-admin';
|
||||||
// window.SITE_CONFIG['websocketURL'] = '15.2.21.236:8888/renren-admin';
|
window.SITE_CONFIG['websocketURL'] = '192.168.124.236:8888/renren-admin';
|
||||||
// window.SITE_CONFIG['POI_URL'] = 'http://15.2.21.238:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
|
|
||||||
// window.SITE_CONFIG['backUrl'] = 'http://15.2.21.238:9797';
|
|
||||||
// window.SITE_CONFIG['backUrl'] = 'http://localhost:8001';
|
|
||||||
// window.SITE_CONFIG['previewUrl'] = 'http://192.168.124.236:9796/';
|
|
||||||
// window.SITE_CONFIG['frontUrl'] = 'http://192.168.124.236:9796/document/#/devModelFile/';
|
|
||||||
// window.SITE_CONFIG['apiURL'] = 'http://192.168.124.236:8888/renren-admin';
|
|
||||||
// window.SITE_CONFIG['websocketURL'] = '192.168.124.236:8888/renren-admin';
|
|
||||||
window.SITE_CONFIG['POI_URL'] = 'http://192.168.124.236:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
|
window.SITE_CONFIG['POI_URL'] = 'http://192.168.124.236:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address';
|
||||||
// 穿透版本
|
// 穿透版本
|
||||||
// window.SITE_CONFIG['backUrl'] = 'http://124.222.94.39:9797';
|
// window.SITE_CONFIG['backUrl'] = 'http://124.222.94.39:9797';
|
||||||
|
|
|
@ -1,13 +1,13 @@
|
||||||
/*
|
/*
|
||||||
* @Author: hisense.wuhongjian
|
* @Author: hisense.wuhongjian
|
||||||
* @Date: 2020-07-07 16:03:23
|
* @Date: 2020-07-07 16:03:23
|
||||||
* @LastEditors: hisense.liangjunhua
|
* @LastEditors: hisense.wuhongjian
|
||||||
* @LastEditTime: 2022-08-01 11:02:21
|
* @LastEditTime: 2022-08-16 09:57:33
|
||||||
* @Description: 数据资源参数配置
|
* @Description: 数据资源参数配置
|
||||||
*/
|
*/
|
||||||
const newLocation = 'qingdao'
|
//const newLocation = 'qingdao'
|
||||||
// const newLocation = 'baotou'
|
// const newLocation = 'baotou'
|
||||||
// const newLocation = 'xihaian'
|
const newLocation = 'qingdao'
|
||||||
|
|
||||||
// 数据资源数据
|
// 数据资源数据
|
||||||
const whoShow = {}
|
const whoShow = {}
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
* @Author: hisense.wuhongjian
|
* @Author: hisense.wuhongjian
|
||||||
* @Date: 2021-06-15 18:50:17
|
* @Date: 2021-06-15 18:50:17
|
||||||
* @LastEditors: hisense.wuhongjian
|
* @LastEditors: hisense.wuhongjian
|
||||||
* @LastEditTime: 2022-07-06 10:54:11
|
* @LastEditTime: 2022-08-12 16:20:45
|
||||||
* @Description: 告诉大家这是什么
|
* @Description: 告诉大家这是什么
|
||||||
*/
|
*/
|
||||||
;(function (doc, win) {
|
;(function (doc, win) {
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
* @Author: hisense.wuhongjian
|
* @Author: hisense.wuhongjian
|
||||||
* @Date: 2022-04-01 19:19:40
|
* @Date: 2022-04-01 19:19:40
|
||||||
* @LastEditors: hisense.liangjunhua
|
* @LastEditors: hisense.liangjunhua
|
||||||
* @LastEditTime: 2022-07-18 16:24:44
|
* @LastEditTime: 2022-08-13 14:54:04
|
||||||
* @Description: 告诉大家这是什么
|
* @Description: 告诉大家这是什么
|
||||||
*/
|
*/
|
||||||
import request from '@/utils/request'
|
import request from '@/utils/request'
|
||||||
|
@ -353,6 +353,14 @@ export function getIntegrationServicesList(params) {
|
||||||
params,
|
params,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// 全局搜索
|
||||||
|
export function getCountByFuzzyQuery(params) {
|
||||||
|
return request({
|
||||||
|
url: '/resource/getCountByFuzzyQuery?keyWorld=' + params,
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
// 融合服务--详情
|
// 融合服务--详情
|
||||||
export function getIntegrationDetail(id) {
|
export function getIntegrationDetail(id) {
|
||||||
|
@ -370,3 +378,44 @@ export function getDevelopDocTree(params) {
|
||||||
params,
|
params,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//会议室查询接口
|
||||||
|
export function getRoomSearch(params) {
|
||||||
|
return request({
|
||||||
|
url: '/bookMeeting/list',
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
//预约弹框选择日期接口
|
||||||
|
export function getDate(params) {
|
||||||
|
return request({
|
||||||
|
url: '/bookMeeting/availableDate',
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
//预约提交
|
||||||
|
export function setSubmit(data) {
|
||||||
|
return request({
|
||||||
|
url: '/bookMeeting',
|
||||||
|
method: 'post',
|
||||||
|
data,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
//预约结果查询按钮
|
||||||
|
export function getYuyue(params) {
|
||||||
|
return request({
|
||||||
|
url: '/bookMeeting/page',
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 能力广场 应用资源
|
||||||
|
export function selectAppList(params) {
|
||||||
|
return request({
|
||||||
|
url: '/resource/selectAppList',
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
After Width: | Height: | Size: 110 KiB |
After Width: | Height: | Size: 122 KiB |
After Width: | Height: | Size: 346 KiB |
After Width: | Height: | Size: 641 B |
After Width: | Height: | Size: 379 B |
After Width: | Height: | Size: 1.3 MiB |
After Width: | Height: | Size: 641 B |
After Width: | Height: | Size: 4.9 KiB |
After Width: | Height: | Size: 60 KiB |
After Width: | Height: | Size: 14 KiB |
After Width: | Height: | Size: 263 B |
After Width: | Height: | Size: 536 B |
After Width: | Height: | Size: 471 KiB |
After Width: | Height: | Size: 784 B |
After Width: | Height: | Size: 883 B |
After Width: | Height: | Size: 898 B |
After Width: | Height: | Size: 692 B |
After Width: | Height: | Size: 705 B |
After Width: | Height: | Size: 38 KiB |
After Width: | Height: | Size: 48 KiB |
After Width: | Height: | Size: 31 KiB |
After Width: | Height: | Size: 62 KiB |
|
@ -64,6 +64,15 @@ export const constantRoutes = [
|
||||||
icon: 'error-warning-line',
|
icon: 'error-warning-line',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/capacitySquare',
|
||||||
|
name: 'capacitySquare',
|
||||||
|
component: () => import('@/views/capacitySquare'),
|
||||||
|
meta: {
|
||||||
|
title: '能力广场',
|
||||||
|
icon: 'error-warning-line',
|
||||||
|
},
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: '/mapTest',
|
path: '/mapTest',
|
||||||
name: 'mapTest',
|
name: 'mapTest',
|
||||||
|
|
|
@ -0,0 +1,187 @@
|
||||||
|
<!-- 智能算法 -->
|
||||||
|
<template>
|
||||||
|
<div class="algorithm">
|
||||||
|
<div class="algorithm-class">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in dataList"
|
||||||
|
:key="`algorithm-${index}`"
|
||||||
|
class="algorithm-card"
|
||||||
|
>
|
||||||
|
<a-image
|
||||||
|
:src="algorithmCardPhoto(item.infoList, item)"
|
||||||
|
:width="525"
|
||||||
|
:height="275"
|
||||||
|
:fallback="imgSrc"
|
||||||
|
:preview="false"
|
||||||
|
></a-image>
|
||||||
|
|
||||||
|
<a-tooltip>
|
||||||
|
<template #title>{{ item.name }}</template>
|
||||||
|
<div class="algorithm-card-title" @click="detailFunction(item.id)">
|
||||||
|
<span>{{ item.name }}</span>
|
||||||
|
<span>{{ item.deptName }}</span>
|
||||||
|
</div>
|
||||||
|
</a-tooltip>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { pageWithAttrs } from '@/api/abilityStatistics'
|
||||||
|
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
||||||
|
const dataList = ref([])
|
||||||
|
const params = {
|
||||||
|
deptIds: [],
|
||||||
|
districtId: '',
|
||||||
|
infoList: [{ attrType: '组件类型', attrValue: '智能算法' }],
|
||||||
|
orderField: 'pin_top',
|
||||||
|
orderType: 'DESC',
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 9,
|
||||||
|
type: '组件服务',
|
||||||
|
}
|
||||||
|
let algorithmclass = null
|
||||||
|
const imgSrc = ref(require('@/assets/capacitySquare/algorithm-photo.jpg'))
|
||||||
|
const dataLength = ref(true)
|
||||||
|
const isNoMore = ref(false)
|
||||||
|
let url = ref('')
|
||||||
|
const pageWithAttrsFunction = () => {
|
||||||
|
pageWithAttrs(params).then((res) => {
|
||||||
|
dataList.value = res.data.data.records
|
||||||
|
if (res.data.data.records.length < 9) {
|
||||||
|
dataLength.value = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
pageWithAttrsFunction()
|
||||||
|
//图片显示
|
||||||
|
const algorithmCardPhoto = (List, item) => {
|
||||||
|
let obj = List.filter((item) => item.attrType === '应用场景')[0]
|
||||||
|
if (obj && obj.attrValue != '') {
|
||||||
|
console.log(
|
||||||
|
item.name,
|
||||||
|
item.id,
|
||||||
|
obj.attrValue,
|
||||||
|
'----------------------------'
|
||||||
|
)
|
||||||
|
obj = JSON.parse(obj.attrValue)[0].img
|
||||||
|
}
|
||||||
|
return obj || ''
|
||||||
|
}
|
||||||
|
//跳转详情页
|
||||||
|
const detailFunction = (id) => {
|
||||||
|
window.open(window.SITE_CONFIG.previewUrl + `#/details?id=${id}`)
|
||||||
|
}
|
||||||
|
const algorithmFunction = (e) => {
|
||||||
|
var scrollTop = e.currentTarget.scrollTop
|
||||||
|
var windowHeight = e.currentTarget.clientHeight
|
||||||
|
var scrollHeight = e.currentTarget.scrollHeight
|
||||||
|
console.log(scrollTop, windowHeight, scrollHeight, '123')
|
||||||
|
if (
|
||||||
|
scrollTop + windowHeight <= scrollHeight + 1 &&
|
||||||
|
scrollTop + windowHeight >= scrollHeight - 1
|
||||||
|
) {
|
||||||
|
// 当前滚动条已经触底
|
||||||
|
isNoMore.value = true
|
||||||
|
params.pageNum++
|
||||||
|
pageWithAttrs(params).then((res) => {
|
||||||
|
dataList.value.push(...res.data.data.records)
|
||||||
|
if (res.data.data.records.length < 9) {
|
||||||
|
dataLength.value = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
isNoMore.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
algorithmclass = document.querySelector('.algorithm-class')
|
||||||
|
if (dataLength.value) {
|
||||||
|
//监听滚动事件
|
||||||
|
algorithmclass.addEventListener('scroll', algorithmFunction, true)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
algorithmclass.removeEventListener('scroll', algorithmFunction, true)
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.algorithm {
|
||||||
|
.algorithm-class {
|
||||||
|
margin-top: 0.6rem;
|
||||||
|
margin-bottom: 0.59rem;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 33%);
|
||||||
|
height: 8.8rem;
|
||||||
|
overflow: auto;
|
||||||
|
margin-left: 1.15rem;
|
||||||
|
margin-right: 0.15rem;
|
||||||
|
.algorithm-card {
|
||||||
|
height: 2.75rem;
|
||||||
|
width: 5.25rem;
|
||||||
|
background: url('~@/assets/capacitySquare/algorithm-bg.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
margin-bottom: 0.4rem;
|
||||||
|
margin-right: 0.65rem;
|
||||||
|
position: relative;
|
||||||
|
:deep(.ant-image) {
|
||||||
|
img {
|
||||||
|
margin-top: 0.15rem;
|
||||||
|
height: 2.45rem;
|
||||||
|
width: 5.05rem;
|
||||||
|
margin-left: 0.1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.algorithm-card-photo {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
background: url('~@/assets/capacitySquare/algorithm-photo.jpg')
|
||||||
|
no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
}
|
||||||
|
.algorithm-card-title {
|
||||||
|
position: absolute;
|
||||||
|
height: 0.6rem;
|
||||||
|
margin-left: 0.08rem;
|
||||||
|
width: 97%;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 0.22rem;
|
||||||
|
font-family: alibaba;
|
||||||
|
bottom: 0.15rem;
|
||||||
|
padding-left: 0.22rem;
|
||||||
|
background: url('~@/assets/capacitySquare/algorithm-title-bg.png')
|
||||||
|
no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
span {
|
||||||
|
line-height: 0.24rem;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
span:last-child {
|
||||||
|
font-size: 0.14rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.algorithm-class::-webkit-scrollbar-track-piece {
|
||||||
|
background: #a5bcdb;
|
||||||
|
border-radius: 0.08rem;
|
||||||
|
}
|
||||||
|
.algorithm-class::-webkit-scrollbar-thumb {
|
||||||
|
height: 3.2rem;
|
||||||
|
background: linear-gradient(to bottom, #47d7f5, #3dc6e3);
|
||||||
|
}
|
||||||
|
.algorithm-class::-webkit-scrollbar {
|
||||||
|
height: 8.8rem;
|
||||||
|
width: 0.08rem;
|
||||||
|
border-radius: 0.08rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,271 @@
|
||||||
|
<!--
|
||||||
|
* @Author: hisense.liangjunhua
|
||||||
|
* @Date: 2022-08-09 09:31:25
|
||||||
|
* @LastEditors: hisense.liangjunhua
|
||||||
|
* @LastEditTime: 2022-08-10 14:29:05
|
||||||
|
* @Description: 应用资源
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="application">
|
||||||
|
<div class="select">
|
||||||
|
<div class="top" @click="selectFlag = true">
|
||||||
|
{{ typeName }}
|
||||||
|
<div class="light"></div>
|
||||||
|
</div>
|
||||||
|
<div class="bottom" v-show="selectFlag">
|
||||||
|
<span class="light"></span>
|
||||||
|
<div @click="getList('全市')">全市</div>
|
||||||
|
<div @click="getList('市级')">市级</div>
|
||||||
|
<div @click="getList('区级')">区级</div>
|
||||||
|
<div @click="getList('企业')">企业</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="item-box">
|
||||||
|
<div class="item" v-for="item in data.list" :key="item.id">
|
||||||
|
<a-image
|
||||||
|
:width="510"
|
||||||
|
:height="270"
|
||||||
|
:preview="false"
|
||||||
|
:src="item.pic"
|
||||||
|
:fallback="item.pic2"
|
||||||
|
/>
|
||||||
|
<div class="bottom" @click="goToView(item.id)">
|
||||||
|
<div class="name">{{ item.name }}</div>
|
||||||
|
<div class="dept">{{ item.deptName || '--' }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { onMounted, reactive, onBeforeUnmount, ref, nextTick } from 'vue'
|
||||||
|
import { selectAppList } from '@/api/home'
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
|
const router = useRouter()
|
||||||
|
const pageNum = ref(1)
|
||||||
|
const flag = ref(true)
|
||||||
|
const type = ref(null)
|
||||||
|
const typeName = ref('全市')
|
||||||
|
const data = reactive({ list: [] })
|
||||||
|
const selectFlag = ref(false)
|
||||||
|
let dom = null
|
||||||
|
const goToView = (id) => {
|
||||||
|
const newpage = router.resolve({
|
||||||
|
path: '/details',
|
||||||
|
query: {
|
||||||
|
id: id,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
window.open(newpage.href, '_blank')
|
||||||
|
}
|
||||||
|
const getList = (str) => {
|
||||||
|
if (str) {
|
||||||
|
dom.scrollTop = 0
|
||||||
|
switch (str) {
|
||||||
|
case '全市':
|
||||||
|
type.value = null
|
||||||
|
typeName.value = '全 市'
|
||||||
|
break
|
||||||
|
case '市级':
|
||||||
|
type.value = 2
|
||||||
|
typeName.value = '市 级'
|
||||||
|
break
|
||||||
|
case '区级':
|
||||||
|
type.value = 3
|
||||||
|
typeName.value = '区 级'
|
||||||
|
break
|
||||||
|
case '企业':
|
||||||
|
type.value = 4
|
||||||
|
typeName.value = '企 业'
|
||||||
|
break
|
||||||
|
}
|
||||||
|
pageNum.value = 1
|
||||||
|
data.list = []
|
||||||
|
}
|
||||||
|
selectAppList({ pageNum: pageNum.value, type: type.value }).then((res) => {
|
||||||
|
if (res.data.data.length < 9) {
|
||||||
|
dom.removeEventListener('scroll', viewMonitor, true)
|
||||||
|
}
|
||||||
|
res.data.data.map((val) => {
|
||||||
|
if (!val.pic) {
|
||||||
|
val.pic = require('@/assets/capacitySquare/yyzy.jpg')
|
||||||
|
}
|
||||||
|
val.pic2 = require('@/assets/capacitySquare/yyzy.jpg')
|
||||||
|
})
|
||||||
|
data.list.push(...res.data.data)
|
||||||
|
selectFlag.value = false
|
||||||
|
nextTick(() => {
|
||||||
|
dom = document.querySelector('.item-box')
|
||||||
|
flag.value = true
|
||||||
|
if (str) {
|
||||||
|
dom.removeEventListener('scroll', viewMonitor, true)
|
||||||
|
dom.addEventListener('scroll', viewMonitor, true)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
getList()
|
||||||
|
const viewMonitor = () => {
|
||||||
|
const clientHeight = dom.clientHeight
|
||||||
|
const scrollTop = dom.scrollTop
|
||||||
|
const scrollHeight = dom.scrollHeight
|
||||||
|
// console.log('滚动条滚动', clientHeight, scrollTop, scrollHeight, dom)
|
||||||
|
if (
|
||||||
|
clientHeight + scrollTop <= scrollHeight + 1 &&
|
||||||
|
clientHeight + scrollTop >= scrollHeight - 1
|
||||||
|
) {
|
||||||
|
console.log('竖向滚动条已经滚动到底部')
|
||||||
|
if (flag.value) {
|
||||||
|
flag.value = false
|
||||||
|
pageNum.value++
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
dom = document.querySelector('.item-box')
|
||||||
|
console.log('box============', dom)
|
||||||
|
dom.addEventListener('scroll', viewMonitor, true)
|
||||||
|
})
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
dom.removeEventListener('scroll', viewMonitor, true)
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
@font-face {
|
||||||
|
font-family: 'webfont';
|
||||||
|
src: url('~@/assets/capacitySquare/webfont.ttf');
|
||||||
|
}
|
||||||
|
.application {
|
||||||
|
padding: 0 0.15rem;
|
||||||
|
.select {
|
||||||
|
margin: 0.1rem 0 0.1rem 0.2rem;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 0.2rem;
|
||||||
|
font-family: webfont;
|
||||||
|
position: relative;
|
||||||
|
.top {
|
||||||
|
cursor: pointer;
|
||||||
|
width: 3.61rem;
|
||||||
|
height: 0.85rem;
|
||||||
|
font-weight: 600;
|
||||||
|
text-align: center;
|
||||||
|
padding-top: 0.1rem;
|
||||||
|
background: url('~@/assets/capacitySquare/select-bg.png') no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
position: relative;
|
||||||
|
.light {
|
||||||
|
width: 0.56rem;
|
||||||
|
height: 3px;
|
||||||
|
position: absolute;
|
||||||
|
top: 0.4rem;
|
||||||
|
left: 1.52rem;
|
||||||
|
background: url('~@/assets/capacitySquare/select-light1.png')
|
||||||
|
no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bottom {
|
||||||
|
cursor: pointer;
|
||||||
|
position: absolute;
|
||||||
|
top: 0.5rem;
|
||||||
|
left: 0.9rem;
|
||||||
|
z-index: 1000;
|
||||||
|
background: rgba(57, 134, 239, 0.68);
|
||||||
|
border: 1px solid #aed5ff;
|
||||||
|
.light {
|
||||||
|
display: inline-block;
|
||||||
|
width: 2.39rem;
|
||||||
|
height: 5px;
|
||||||
|
position: absolute;
|
||||||
|
top: -0.08rem;
|
||||||
|
left: -0.3rem;
|
||||||
|
background: url('~@/assets/capacitySquare/select-light2.png')
|
||||||
|
no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
}
|
||||||
|
& > div {
|
||||||
|
width: 1.8rem;
|
||||||
|
height: 0.4rem;
|
||||||
|
line-height: 0.4rem;
|
||||||
|
text-align: center;
|
||||||
|
border-top: 1px solid #aed5ff;
|
||||||
|
}
|
||||||
|
& > div:nth-of-type(1) {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item-box {
|
||||||
|
margin-bottom: 0.15rem;
|
||||||
|
height: 8.8rem;
|
||||||
|
padding: 0 0.9rem 0 1rem;
|
||||||
|
overflow-y: scroll;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
.item {
|
||||||
|
width: 5.25rem;
|
||||||
|
height: 2.75rem;
|
||||||
|
margin-bottom: 0.3rem;
|
||||||
|
position: relative;
|
||||||
|
background: url('~@/assets/capacitySquare/algorithm-bg.png') no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
background-position: center;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
:deep(.ant-image-img) {
|
||||||
|
width: 99%;
|
||||||
|
height: 99%;
|
||||||
|
margin-left: 0.03rem;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
.bottom {
|
||||||
|
cursor: pointer;
|
||||||
|
width: 98%;
|
||||||
|
height: 0.6rem;
|
||||||
|
padding-left: 0.3rem;
|
||||||
|
margin-left: 0.05rem;
|
||||||
|
margin-bottom: 0.05rem;
|
||||||
|
background: url('~@/assets/capacitySquare/bt-bg.png') no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
color: #fff;
|
||||||
|
font-family: webfont;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
.name {
|
||||||
|
height: 0.44rem;
|
||||||
|
line-height: 0.44rem;
|
||||||
|
font-size: 0.22rem;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-o-text-overflow: ellipsis;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
.dept {
|
||||||
|
height: 0.12rem;
|
||||||
|
line-height: 0.04rem;
|
||||||
|
font-size: 0.12rem;
|
||||||
|
color: #bbb;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item-box::-webkit-scrollbar-track-piece {
|
||||||
|
background: #a5bcdb;
|
||||||
|
border-radius: 0.08rem;
|
||||||
|
}
|
||||||
|
.item-box::-webkit-scrollbar-thumb {
|
||||||
|
height: 3.2rem;
|
||||||
|
background: linear-gradient(to bottom, #47d7f5, #3dc6e3);
|
||||||
|
}
|
||||||
|
.item-box::-webkit-scrollbar {
|
||||||
|
height: 8.8rem;
|
||||||
|
width: 0.08rem;
|
||||||
|
border-radius: 0.08rem;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,181 @@
|
||||||
|
<!-- 图层服务 -->
|
||||||
|
<template>
|
||||||
|
<div class="algorithm">
|
||||||
|
<div class="algorithm-class">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in dataList"
|
||||||
|
:key="`algorithm-${index}`"
|
||||||
|
class="algorithm-card"
|
||||||
|
>
|
||||||
|
<a-image
|
||||||
|
:src="algorithmCardPhoto(item.infoList)"
|
||||||
|
:width="525"
|
||||||
|
:height="275"
|
||||||
|
:fallback="imgSrc"
|
||||||
|
:preview="false"
|
||||||
|
></a-image>
|
||||||
|
|
||||||
|
<a-tooltip>
|
||||||
|
<template #title>{{ item.name }}</template>
|
||||||
|
<div class="algorithm-card-title" @click="detailFunction(item.id)">
|
||||||
|
<span>{{ item.name }}</span>
|
||||||
|
<span>{{ item.deptName }}</span>
|
||||||
|
</div>
|
||||||
|
</a-tooltip>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { pageWithAttrs } from '@/api/abilityStatistics'
|
||||||
|
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
||||||
|
const dataList = ref([])
|
||||||
|
let algorithmclass = null
|
||||||
|
const params = {
|
||||||
|
deptIds: [],
|
||||||
|
districtId: '',
|
||||||
|
infoList: [{ attrType: '组件类型', attrValue: '图层服务' }],
|
||||||
|
orderField: 'deptSort',
|
||||||
|
orderType: 'DESC',
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 9,
|
||||||
|
type: '组件服务',
|
||||||
|
}
|
||||||
|
const imgSrc = ref(require('@/assets/capacitySquare/algorithm-photo2.jpg'))
|
||||||
|
const dataLength = ref(true)
|
||||||
|
const isNoMore = ref(false)
|
||||||
|
const pageWithAttrsFunction = () => {
|
||||||
|
pageWithAttrs(params).then((res) => {
|
||||||
|
dataList.value = res.data.data.records
|
||||||
|
if (res.data.data.records.length < 9) {
|
||||||
|
dataLength.value = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
pageWithAttrsFunction()
|
||||||
|
//图片显示
|
||||||
|
const algorithmCardPhoto = (List) => {
|
||||||
|
let url = ''
|
||||||
|
List.map((item) => {
|
||||||
|
if (item.attrType === '图层缩略图') {
|
||||||
|
url = item.attrValue
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return url
|
||||||
|
}
|
||||||
|
//跳转详情页
|
||||||
|
const detailFunction = (id) => {
|
||||||
|
window.open(window.SITE_CONFIG.previewUrl + `#/details?id=${id}`)
|
||||||
|
}
|
||||||
|
const layerFunction = (e) => {
|
||||||
|
var scrollTop = e.currentTarget.scrollTop
|
||||||
|
var windowHeight = e.currentTarget.clientHeight
|
||||||
|
var scrollHeight = e.currentTarget.scrollHeight
|
||||||
|
console.log(scrollTop, windowHeight, scrollHeight, '123')
|
||||||
|
if (
|
||||||
|
scrollTop + windowHeight <= scrollHeight + 1 &&
|
||||||
|
scrollTop + windowHeight >= scrollHeight - 1
|
||||||
|
) {
|
||||||
|
// 当前滚动条已经触底
|
||||||
|
isNoMore.value = true
|
||||||
|
params.pageNum++
|
||||||
|
pageWithAttrs(params).then((res) => {
|
||||||
|
dataList.value.push(...res.data.data.records)
|
||||||
|
if (res.data.data.records.length < 9) {
|
||||||
|
dataLength.value = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
isNoMore.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
algorithmclass = document.querySelector('.algorithm-class')
|
||||||
|
if (dataLength.value) {
|
||||||
|
//监听滚动事件
|
||||||
|
algorithmclass.addEventListener('scroll', layerFunction, true)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
algorithmclass.removeEventListener('scroll', layerFunction, true)
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.algorithm {
|
||||||
|
.algorithm-class {
|
||||||
|
margin-top: 0.6rem;
|
||||||
|
margin-bottom: 0.59rem;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 33%);
|
||||||
|
height: 8.8rem;
|
||||||
|
overflow: auto;
|
||||||
|
margin-left: 1.15rem;
|
||||||
|
margin-right: 0.15rem;
|
||||||
|
.algorithm-card {
|
||||||
|
height: 2.75rem;
|
||||||
|
width: 5.23rem;
|
||||||
|
background: url('~@/assets/capacitySquare/algorithm-bg.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
margin-bottom: 0.4rem;
|
||||||
|
margin-right: 0.65rem;
|
||||||
|
position: relative;
|
||||||
|
:deep(.ant-image) {
|
||||||
|
img {
|
||||||
|
margin-top: 0.15rem;
|
||||||
|
height: 2.45rem;
|
||||||
|
width: 5.05rem;
|
||||||
|
margin-left: 0.1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.algorithm-card-photo {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
background: url('~@/assets/capacitySquare/algorithm-photo.jpg')
|
||||||
|
no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
}
|
||||||
|
.algorithm-card-title {
|
||||||
|
position: absolute;
|
||||||
|
height: 0.6rem;
|
||||||
|
margin-left: 0.08rem;
|
||||||
|
width: 97%;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 0.22rem;
|
||||||
|
font-family: alibaba;
|
||||||
|
bottom: 0.15rem;
|
||||||
|
padding-left: 0.22rem;
|
||||||
|
background: url('~@/assets/capacitySquare/algorithm-title-bg.png')
|
||||||
|
no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
span {
|
||||||
|
line-height: 0.24rem;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
span:last-child {
|
||||||
|
font-size: 0.14rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.algorithm-class::-webkit-scrollbar-track-piece {
|
||||||
|
background: #a5bcdb;
|
||||||
|
border-radius: 0.08rem;
|
||||||
|
}
|
||||||
|
.algorithm-class::-webkit-scrollbar-thumb {
|
||||||
|
height: 3.2rem;
|
||||||
|
background: linear-gradient(to bottom, #47d7f5, #3dc6e3);
|
||||||
|
}
|
||||||
|
.algorithm-class::-webkit-scrollbar {
|
||||||
|
height: 8.8rem;
|
||||||
|
width: 0.08rem;
|
||||||
|
border-radius: 0.08rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,118 @@
|
||||||
|
<!--
|
||||||
|
* @Author: hisense.liangjunhua
|
||||||
|
* @Date: 2022-08-09 11:32:47
|
||||||
|
* @LastEditors: hisense.liangjunhua
|
||||||
|
* @LastEditTime: 2022-08-09 15:26:57
|
||||||
|
* @Description: 告诉大家这是什么
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="capacitySquare">
|
||||||
|
<div class="header">
|
||||||
|
<div class="left">城市云脑通用能力服务平台(UCS)</div>
|
||||||
|
{{ squareType }}
|
||||||
|
<div class="right" @click="backClick">返回集市</div>
|
||||||
|
</div>
|
||||||
|
<div class="light"></div>
|
||||||
|
<div class="box">
|
||||||
|
<algorithm v-if="show === 'algorithm'"></algorithm>
|
||||||
|
<layer v-else-if="show === 'layer'"></layer>
|
||||||
|
<application v-else-if="show === 'application'"></application>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { ref } from 'vue'
|
||||||
|
import algorithm from './components/algorithm.vue'
|
||||||
|
import layer from './components/layer.vue'
|
||||||
|
import application from './components/application.vue'
|
||||||
|
import { useRouter } from 'vue-router'
|
||||||
|
const router = useRouter()
|
||||||
|
const abilityToType = router.currentRoute.value.query.abilityToType
|
||||||
|
const show = ref('algorithm')
|
||||||
|
const squareType = ref('应用广场')
|
||||||
|
if (abilityToType === '应用资源') {
|
||||||
|
show.value = 'application'
|
||||||
|
squareType.value = '应用广场'
|
||||||
|
} else if (abilityToType === '图层服务') {
|
||||||
|
show.value = 'layer'
|
||||||
|
squareType.value = 'GIS广场'
|
||||||
|
} else if (abilityToType === '智能算法') {
|
||||||
|
show.value = 'algorithm'
|
||||||
|
squareType.value = '算法广场'
|
||||||
|
} else {
|
||||||
|
console.log('no')
|
||||||
|
}
|
||||||
|
// 返回集市
|
||||||
|
const backClick = () => {
|
||||||
|
const newpage = router.resolve({
|
||||||
|
path: '/DetailsPageconetent',
|
||||||
|
query: {
|
||||||
|
select: '组件服务',
|
||||||
|
},
|
||||||
|
})
|
||||||
|
window.location.href = newpage.href
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
@font-face {
|
||||||
|
font-family: 'webfont';
|
||||||
|
src: url('~@/assets/capacitySquare/webfont.ttf');
|
||||||
|
}
|
||||||
|
.capacitySquare {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: url('~@/assets/capacitySquare/bg.png') no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
.header {
|
||||||
|
width: 100%;
|
||||||
|
height: 0.8rem;
|
||||||
|
background: url('~@/assets/capacitySquare/header-bg.png') no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
font-family: webfont;
|
||||||
|
font-size: 0.5rem;
|
||||||
|
font-weight: 600;
|
||||||
|
.left {
|
||||||
|
position: absolute;
|
||||||
|
top: 0.05rem;
|
||||||
|
left: 1.5rem;
|
||||||
|
font-size: 0.18rem;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
.right {
|
||||||
|
width: 1rem;
|
||||||
|
height: 0.3rem;
|
||||||
|
line-height: 0.3rem;
|
||||||
|
position: absolute;
|
||||||
|
top: 0.05rem;
|
||||||
|
right: 0.2rem;
|
||||||
|
font-size: 0.14rem;
|
||||||
|
font-weight: 500;
|
||||||
|
background: url('~@/assets/capacitySquare/backShop.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.light {
|
||||||
|
position: absolute;
|
||||||
|
top: 0.25rem;
|
||||||
|
left: 6.25rem;
|
||||||
|
z-index: 10;
|
||||||
|
width: 6.64rem;
|
||||||
|
height: 1.64rem;
|
||||||
|
background: url('~@/assets/capacitySquare/header-light.png') no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
.box {
|
||||||
|
flex: 1;
|
||||||
|
// padding: 0.5rem 0;
|
||||||
|
font-family: alibaba;
|
||||||
|
src: url('~@/assets/capacitySquare/webfont.ttf');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -10,7 +10,7 @@
|
||||||
<div
|
<div
|
||||||
v-for="(itemSonTitle, indexSonTitle) in dataFrom.attrValue"
|
v-for="(itemSonTitle, indexSonTitle) in dataFrom.attrValue"
|
||||||
:key="itemSonTitle.name"
|
:key="itemSonTitle.name"
|
||||||
@click="tabSwitch(itemSonTitle.name)"
|
@click="tabSwitch(itemSonTitle.name, indexSonTitle)"
|
||||||
class="tab-son"
|
class="tab-son"
|
||||||
:class="
|
:class="
|
||||||
tabIndexClass(indexSonTitle, dataFrom.name, dataFrom.attrValue)
|
tabIndexClass(indexSonTitle, dataFrom.name, dataFrom.attrValue)
|
||||||
|
@ -21,7 +21,8 @@
|
||||||
<div
|
<div
|
||||||
class="tab-top"
|
class="tab-top"
|
||||||
:class="
|
:class="
|
||||||
tabInitialize() == itemSonTitle.name ? 'tab-top-down' : ''
|
(tabInitialize() == itemSonTitle.name ? 'tab-top-down' : '') &&
|
||||||
|
dataIndex == indexSonTitle
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
{{ itemSonTitle.name }}
|
{{ itemSonTitle.name }}
|
||||||
|
@ -29,12 +30,20 @@
|
||||||
</a-tooltip>
|
</a-tooltip>
|
||||||
<div
|
<div
|
||||||
class="tab-bottom"
|
class="tab-bottom"
|
||||||
v-if="tabInitialize() == itemSonTitle.name"
|
v-if="
|
||||||
|
tabInitialize() == itemSonTitle.name && dataIndex == indexSonTitle
|
||||||
|
"
|
||||||
></div>
|
></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<template v-for="itemSonTitle in dataFrom.attrValue" :key="itemSonTitle">
|
<template
|
||||||
<div class="content" v-if="tabindex == itemSonTitle.name">
|
v-for="(itemSonTitle, indexSonTitle) in dataFrom.attrValue"
|
||||||
|
:key="itemSonTitle"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="content"
|
||||||
|
v-if="tabindex == itemSonTitle.name && dataIndex == indexSonTitle"
|
||||||
|
>
|
||||||
<div class="content-left">
|
<div class="content-left">
|
||||||
<div class="content-left-scene" v-if="!itemSonTitle.img"></div>
|
<div class="content-left-scene" v-if="!itemSonTitle.img"></div>
|
||||||
<a-image
|
<a-image
|
||||||
|
@ -60,6 +69,7 @@
|
||||||
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
|
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
|
||||||
import { ref, defineProps, watch } from 'vue'
|
import { ref, defineProps, watch } from 'vue'
|
||||||
const flag = ref(true)
|
const flag = ref(true)
|
||||||
|
let dataIndex = ref(0)
|
||||||
let dataFrom = ref([])
|
let dataFrom = ref([])
|
||||||
// tab切换方法
|
// tab切换方法
|
||||||
let tabindex = ref('场景说明一')
|
let tabindex = ref('场景说明一')
|
||||||
|
@ -105,8 +115,9 @@
|
||||||
return tabindex.value
|
return tabindex.value
|
||||||
}
|
}
|
||||||
//tab切换点击事件
|
//tab切换点击事件
|
||||||
function tabSwitch(name) {
|
function tabSwitch(name, index) {
|
||||||
tabindex.value = name
|
tabindex.value = name
|
||||||
|
dataIndex.value = index
|
||||||
return tabindex.value
|
return tabindex.value
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
<!--
|
<!--
|
||||||
* @Author: hisense.liangjunhua
|
* @Author: hisense.liangjunhua
|
||||||
* @Date: 2022-06-08 11:56:28
|
* @Date: 2022-06-08 11:56:28
|
||||||
* @LastEditors: hisense.liangjunhua
|
* @LastEditors: hisense.wuhongjian
|
||||||
* @LastEditTime: 2022-07-19 15:04:02
|
* @LastEditTime: 2022-08-09 11:54:40
|
||||||
* @Description: 算法详情页头部
|
* @Description: 算法详情页头部
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
|
@ -54,7 +54,15 @@
|
||||||
<template #icon><form-outlined /></template>
|
<template #icon><form-outlined /></template>
|
||||||
申请使用
|
申请使用
|
||||||
</a-button>
|
</a-button>
|
||||||
<a-button type="primary" @click="addShoppingCart()">
|
<a-button
|
||||||
|
type="primary"
|
||||||
|
@click="addShoppingCart()"
|
||||||
|
v-show="
|
||||||
|
props.dataList.infoList.filter(
|
||||||
|
(val) => val.attrType == '外部服务地址'
|
||||||
|
).length === 0
|
||||||
|
"
|
||||||
|
>
|
||||||
<template #icon><shopping-cart-outlined /></template>
|
<template #icon><shopping-cart-outlined /></template>
|
||||||
加入申购车
|
加入申购车
|
||||||
</a-button>
|
</a-button>
|
||||||
|
@ -105,30 +113,37 @@
|
||||||
// 立即申请
|
// 立即申请
|
||||||
function toView() {
|
function toView() {
|
||||||
// window.open(newpage.href, '_blank')
|
// window.open(newpage.href, '_blank')
|
||||||
console.log('一键申请===================>', props.dataList)
|
const webUrl = props.dataList.infoList.filter(
|
||||||
localStorage.setItem(
|
(val) => val.attrType == '外部服务地址'
|
||||||
'applyList',
|
)[0]?.attrValue
|
||||||
JSON.stringify([
|
if (webUrl) {
|
||||||
{
|
window.open(webUrl)
|
||||||
arr: [
|
} else {
|
||||||
{
|
console.log('一键申请===================>', props.dataList)
|
||||||
delFlag: props.dataList.delFlag,
|
localStorage.setItem(
|
||||||
description: props.dataList.description,
|
'applyList',
|
||||||
resourceId: props.dataList.id,
|
JSON.stringify([
|
||||||
resourceName: props.dataList.name,
|
{
|
||||||
time: props.dataList.createDate,
|
arr: [
|
||||||
type: props.dataList.type,
|
{
|
||||||
componentType: '图层服务',
|
delFlag: props.dataList.delFlag,
|
||||||
},
|
description: props.dataList.description,
|
||||||
],
|
resourceId: props.dataList.id,
|
||||||
deptId: props.dataList.deptId,
|
resourceName: props.dataList.name,
|
||||||
deptName: props.dataList.deptName,
|
time: props.dataList.createDate,
|
||||||
},
|
type: props.dataList.type,
|
||||||
])
|
componentType: '图层服务',
|
||||||
)
|
},
|
||||||
router.push({
|
],
|
||||||
path: '/apply',
|
deptId: props.dataList.deptId,
|
||||||
})
|
deptName: props.dataList.deptName,
|
||||||
|
},
|
||||||
|
])
|
||||||
|
)
|
||||||
|
router.push({
|
||||||
|
path: '/apply',
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
// 收藏
|
// 收藏
|
||||||
const scFlag2 = ref(true)
|
const scFlag2 = ref(true)
|
||||||
|
|
|
@ -6,9 +6,40 @@
|
||||||
<detailsPageconetentTree />
|
<detailsPageconetentTree />
|
||||||
</div>
|
</div>
|
||||||
<div class="details-pageconetent-left" v-else>
|
<div class="details-pageconetent-left" v-else>
|
||||||
<detailsPageInfrastructureTree />
|
<detailsPageInfrastructureTree v-show="flag != '6'" />
|
||||||
</div>
|
</div>
|
||||||
<div class="top" v-if="Cardsname != '知识库' && Cardsname != '基础设施'">
|
<div class="top" v-if="Cardsname != '知识库' && Cardsname != '基础设施'">
|
||||||
|
<div class="resultListSearchInput-father">
|
||||||
|
<div class="resultListSearchInput-son">
|
||||||
|
模糊搜索
|
||||||
|
<a-input-search
|
||||||
|
v-model:value="searchValue"
|
||||||
|
placeholder="请输入关键词"
|
||||||
|
enter-button="搜索"
|
||||||
|
size="large"
|
||||||
|
@search="getAppResources2"
|
||||||
|
@change="onSearch"
|
||||||
|
class="resultListSearchInput"
|
||||||
|
/>
|
||||||
|
<button class="button-reset" @click="chongzhi()">重置</button>
|
||||||
|
<button
|
||||||
|
class="button-reset"
|
||||||
|
style="margin-left: 0.1rem"
|
||||||
|
@click="globalSearch()"
|
||||||
|
>
|
||||||
|
全局搜索
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
v-if="Cardsname == '应用资源'"
|
||||||
|
class="button-reset"
|
||||||
|
@click="applyAll()"
|
||||||
|
style="margin-left: 0.1rem"
|
||||||
|
>
|
||||||
|
全部申请
|
||||||
|
</button>
|
||||||
|
<div class="hengxian" style="background: transparent"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="top-title">
|
<div class="top-title">
|
||||||
<div
|
<div
|
||||||
v-for="item in titleName"
|
v-for="item in titleName"
|
||||||
|
@ -23,31 +54,18 @@
|
||||||
backgroundSize: 'cover',
|
backgroundSize: 'cover',
|
||||||
}"
|
}"
|
||||||
></span>
|
></span>
|
||||||
<span>{{ item.name }}</span>
|
<span v-if="globalData.data.length > 0">
|
||||||
</div>
|
{{
|
||||||
</div>
|
item.name +
|
||||||
<div class="resultListSearchInput-father">
|
'(' +
|
||||||
<div class="resultListSearchInput-son">
|
(globalData.data.filter((val) => val.type === item.name)[0]
|
||||||
模糊搜索
|
.count || '0') +
|
||||||
<a-input-search
|
')'
|
||||||
v-model:value="searchValue"
|
}}
|
||||||
placeholder="请输入关键词"
|
</span>
|
||||||
enter-button="搜索"
|
<span v-else>
|
||||||
size="large"
|
{{ item.name }}
|
||||||
@search="getAppResources"
|
</span>
|
||||||
@change="onSearch"
|
|
||||||
class="resultListSearchInput"
|
|
||||||
/>
|
|
||||||
<button class="button-reset" @click="chongzhi()">重置</button>
|
|
||||||
<button
|
|
||||||
v-if="Cardsname == '应用资源'"
|
|
||||||
class="button-reset"
|
|
||||||
@click="applyAll()"
|
|
||||||
style="margin-left: 0.1rem"
|
|
||||||
>
|
|
||||||
全部申请
|
|
||||||
</button>
|
|
||||||
<div class="hengxian"></div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="top-content-father" :key="listKey">
|
<div class="top-content-father" :key="listKey">
|
||||||
|
@ -160,46 +178,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="top" v-else-if="Cardsname === '基础设施'">
|
<div class="top" v-else-if="Cardsname === '基础设施'">
|
||||||
<div class="top-title">
|
<div class="resultListSearchInput-father">
|
||||||
<div
|
|
||||||
v-for="item in titleName"
|
|
||||||
:key="item.name"
|
|
||||||
:class="item.name === Cardsname ? 'sel' : ''"
|
|
||||||
@click="changeCards(item.name)"
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
class="photo"
|
|
||||||
:style="{
|
|
||||||
backgroundImage: `url(${item.photo}) `,
|
|
||||||
backgroundSize: 'cover',
|
|
||||||
}"
|
|
||||||
></span>
|
|
||||||
<span>{{ item.name }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="top-content-father">
|
|
||||||
<infrastructurePage />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="top" v-else>
|
|
||||||
<div class="top-title">
|
|
||||||
<div
|
|
||||||
v-for="item in titleName"
|
|
||||||
:key="item.name"
|
|
||||||
:class="item.name === Cardsname ? 'sel' : ''"
|
|
||||||
@click="changeCards(item.name)"
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
class="photo"
|
|
||||||
:style="{
|
|
||||||
backgroundImage: `url(${item.photo}) `,
|
|
||||||
backgroundSize: 'cover',
|
|
||||||
}"
|
|
||||||
></span>
|
|
||||||
<span>{{ item.name }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="resultListSearchInput-father" style="background: unset">
|
|
||||||
<div class="resultListSearchInput-son">
|
<div class="resultListSearchInput-son">
|
||||||
模糊搜索
|
模糊搜索
|
||||||
<a-input-search
|
<a-input-search
|
||||||
|
@ -207,11 +186,107 @@
|
||||||
placeholder="请输入关键词"
|
placeholder="请输入关键词"
|
||||||
enter-button="搜索"
|
enter-button="搜索"
|
||||||
size="large"
|
size="large"
|
||||||
@search="getAppResources"
|
@search="getAppResources2"
|
||||||
@change="onSearch"
|
@change="onSearch"
|
||||||
class="resultListSearchInput"
|
class="resultListSearchInput"
|
||||||
/>
|
/>
|
||||||
<button class="button-reset" @click="chongzhi()">重置</button>
|
<button class="button-reset" @click="chongzhi()">重置</button>
|
||||||
|
<button
|
||||||
|
class="button-reset"
|
||||||
|
style="margin-left: 0.1rem"
|
||||||
|
@click="globalSearch()"
|
||||||
|
>
|
||||||
|
全局搜索
|
||||||
|
</button>
|
||||||
|
<div class="hengxian" style="background: transparent"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="top-title">
|
||||||
|
<div
|
||||||
|
v-for="item in titleName"
|
||||||
|
:key="item.name"
|
||||||
|
:class="item.name === Cardsname ? 'sel' : ''"
|
||||||
|
@click="changeCards(item.name)"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="photo"
|
||||||
|
:style="{
|
||||||
|
backgroundImage: `url(${item.photo}) `,
|
||||||
|
backgroundSize: 'cover',
|
||||||
|
}"
|
||||||
|
></span>
|
||||||
|
<span v-if="globalData.data.length > 0">
|
||||||
|
{{
|
||||||
|
item.name +
|
||||||
|
'(' +
|
||||||
|
(globalData.data.filter((val) => val.type === item.name)[0]
|
||||||
|
.count || '0') +
|
||||||
|
')'
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
<span v-else>
|
||||||
|
{{ item.name }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="top-content-father">
|
||||||
|
<infrastructurePage
|
||||||
|
ref="camera"
|
||||||
|
@add="handleAdd"
|
||||||
|
:searchValue="searchValue"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="top" v-else>
|
||||||
|
<div class="resultListSearchInput-father">
|
||||||
|
<div class="resultListSearchInput-son">
|
||||||
|
模糊搜索
|
||||||
|
<a-input-search
|
||||||
|
v-model:value="searchValue"
|
||||||
|
placeholder="请输入关键词"
|
||||||
|
enter-button="搜索"
|
||||||
|
size="large"
|
||||||
|
@search="getAppResources2"
|
||||||
|
@change="onSearch"
|
||||||
|
class="resultListSearchInput"
|
||||||
|
/>
|
||||||
|
<button class="button-reset" @click="chongzhi()">重置</button>
|
||||||
|
<button
|
||||||
|
class="button-reset"
|
||||||
|
style="margin-left: 0.1rem"
|
||||||
|
@click="globalSearch()"
|
||||||
|
>
|
||||||
|
全局搜索
|
||||||
|
</button>
|
||||||
|
<div class="hengxian" style="background: transparent"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="top-title">
|
||||||
|
<div
|
||||||
|
v-for="item in titleName"
|
||||||
|
:key="item.name"
|
||||||
|
:class="item.name === Cardsname ? 'sel' : ''"
|
||||||
|
@click="changeCards(item.name)"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="photo"
|
||||||
|
:style="{
|
||||||
|
backgroundImage: `url(${item.photo}) `,
|
||||||
|
backgroundSize: 'cover',
|
||||||
|
}"
|
||||||
|
></span>
|
||||||
|
<span v-if="globalData.data.length > 0">
|
||||||
|
{{
|
||||||
|
item.name +
|
||||||
|
'(' +
|
||||||
|
(globalData.data.filter((val) => val.type === item.name)[0]
|
||||||
|
.count || '0') +
|
||||||
|
')'
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
<span v-else>
|
||||||
|
{{ item.name }}
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<KnowledgeBase
|
<KnowledgeBase
|
||||||
|
@ -225,6 +300,19 @@
|
||||||
<i></i>
|
<i></i>
|
||||||
</a-tooltip>
|
</a-tooltip>
|
||||||
</div>
|
</div>
|
||||||
|
<div @click="showAbilitySquare" class="abilitySquare">
|
||||||
|
<p></p>
|
||||||
|
<p>能力广场</p>
|
||||||
|
<ul v-show="visibleAbilitySquare">
|
||||||
|
<li
|
||||||
|
v-for="item in abilitySquare"
|
||||||
|
:key="item"
|
||||||
|
@click="abilitySquareFunction(item)"
|
||||||
|
>
|
||||||
|
{{ item }}
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 西海岸 -->
|
<!-- 西海岸 -->
|
||||||
<div
|
<div
|
||||||
|
@ -408,7 +496,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="top-content-father">
|
<div class="top-content-father">
|
||||||
<infrastructurePage />
|
<infrastructurePage ref="camera" :searchValue="searchValue" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="top" v-else>
|
<div class="top" v-else>
|
||||||
|
@ -708,6 +796,7 @@
|
||||||
pageWithAttrs,
|
pageWithAttrs,
|
||||||
getDataResource,
|
getDataResource,
|
||||||
getIntegrationServicesList,
|
getIntegrationServicesList,
|
||||||
|
getCountByFuzzyQuery,
|
||||||
} from '@/api/home.js'
|
} from '@/api/home.js'
|
||||||
import { getSgcList } from '@/api/personalCenter'
|
import { getSgcList } from '@/api/personalCenter'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
|
@ -729,6 +818,12 @@
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
setup() {
|
setup() {
|
||||||
|
//会议室传的标识6
|
||||||
|
const flag = ref('')
|
||||||
|
|
||||||
|
const handleAdd = (value) => {
|
||||||
|
flag.value = value
|
||||||
|
}
|
||||||
const titleName = ref(titleNameArray)
|
const titleName = ref(titleNameArray)
|
||||||
|
|
||||||
const openMonitor = () => {
|
const openMonitor = () => {
|
||||||
|
@ -748,7 +843,8 @@
|
||||||
const currentPageSize = ref(5)
|
const currentPageSize = ref(5)
|
||||||
const pageSizeOptions = ref(['5', '10', '20', '50'])
|
const pageSizeOptions = ref(['5', '10', '20', '50'])
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const select = router.currentRoute.value.query.select
|
let select = router.currentRoute.value.query.select || '组件服务'
|
||||||
|
const select2 = router.currentRoute.value.query.select
|
||||||
const str = router.currentRoute.value.query.str
|
const str = router.currentRoute.value.query.str
|
||||||
const searchValue = ref(str)
|
const searchValue = ref(str)
|
||||||
let tecHnosphere = router.currentRoute.value.query.tecHnosphere
|
let tecHnosphere = router.currentRoute.value.query.tecHnosphere
|
||||||
|
@ -772,7 +868,7 @@
|
||||||
type: Cardsname.value,
|
type: Cardsname.value,
|
||||||
name: '',
|
name: '',
|
||||||
infoList: [],
|
infoList: [],
|
||||||
orderField: 'visits', // total 综合 visits 访问量 applyCount 申请量 score 评分 collectCount 收藏量
|
orderField: '', // 传空为默认排序 total 综合 visits 访问量 applyCount 申请量 score 评分 collectCount 收藏量
|
||||||
orderType: 'DESC', // ASC 升序 DESC 降序
|
orderType: 'DESC', // ASC 升序 DESC 降序
|
||||||
}
|
}
|
||||||
//西海岸查询参数
|
//西海岸查询参数
|
||||||
|
@ -847,10 +943,14 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
// 重置数据
|
// 重置数据
|
||||||
const chongzhi = () => {
|
const chongzhi = (flag) => {
|
||||||
loading.value = true
|
loading.value = true
|
||||||
// 重置模糊查字段
|
// 重置模糊查字段
|
||||||
searchValue.value = ''
|
if (!flag) {
|
||||||
|
searchValue.value = ''
|
||||||
|
globalFlag.value = false
|
||||||
|
globalData.data = []
|
||||||
|
}
|
||||||
paramsGetResources.name = searchValue.value
|
paramsGetResources.name = searchValue.value
|
||||||
// 重置筛选条件
|
// 重置筛选条件
|
||||||
ListContent.records.forEach((val) => {
|
ListContent.records.forEach((val) => {
|
||||||
|
@ -873,7 +973,7 @@
|
||||||
paramsGetResources.name = ''
|
paramsGetResources.name = ''
|
||||||
paramsGetResources.shareCondition = ''
|
paramsGetResources.shareCondition = ''
|
||||||
paramsGetResources.infoList = []
|
paramsGetResources.infoList = []
|
||||||
paramsGetResources.orderField = 'total'
|
paramsGetResources.orderField = ''
|
||||||
paramsGetResources.orderType = 'DESC'
|
paramsGetResources.orderType = 'DESC'
|
||||||
mybus.emit('chongzhi')
|
mybus.emit('chongzhi')
|
||||||
getAppResources()
|
getAppResources()
|
||||||
|
@ -990,9 +1090,98 @@
|
||||||
const resourceList = reactive({ data: [] })
|
const resourceList = reactive({ data: [] })
|
||||||
const videoList = reactive({ data: [] })
|
const videoList = reactive({ data: [] })
|
||||||
const resourceTotal = ref('')
|
const resourceTotal = ref('')
|
||||||
|
// 全局搜索
|
||||||
|
const camera = ref(null)
|
||||||
|
const globalData = reactive({ data: [] })
|
||||||
|
const globalFlag = ref(false)
|
||||||
|
const globalSearch = () => {
|
||||||
|
if (searchValue.value) {
|
||||||
|
globalFlag.value = true
|
||||||
|
getCountByFuzzyQuery(searchValue.value || '').then((res) => {
|
||||||
|
console.log('全局搜索==========》', res.data.data)
|
||||||
|
globalData.data = res.data.data
|
||||||
|
if (paramsGetResources.type == '基础设施') {
|
||||||
|
console.log('camera1', camera.value)
|
||||||
|
camera.value.getCamera(true, searchValue.value)
|
||||||
|
} else {
|
||||||
|
getAppResources()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
message.warning('全局搜索必须输入关键词!')
|
||||||
|
}
|
||||||
|
}
|
||||||
// 校验
|
// 校验
|
||||||
const re = /^[0-9\u4E00-\u9FA5]*$/
|
const re = /^[0-9\u4E00-\u9FA5]*$/
|
||||||
|
const getAppResources2 = () => {
|
||||||
|
globalFlag.value = false
|
||||||
|
if (
|
||||||
|
whoShow1.value.itShowQingDao &&
|
||||||
|
paramsGetResources.type == '基础设施'
|
||||||
|
) {
|
||||||
|
console.log('camera2', camera)
|
||||||
|
camera.value.getCamera(true, searchValue.value)
|
||||||
|
} else {
|
||||||
|
getAppResources()
|
||||||
|
}
|
||||||
|
}
|
||||||
const getAppResources = (switchIndex) => {
|
const getAppResources = (switchIndex) => {
|
||||||
|
if (!globalFlag.value) {
|
||||||
|
globalData.data = []
|
||||||
|
}
|
||||||
|
select = router.currentRoute.value.query.select
|
||||||
|
console.log(
|
||||||
|
'url中的select',
|
||||||
|
router.currentRoute.value.query.select,
|
||||||
|
select == '应用资源' &&
|
||||||
|
(paramsGetResources.orderField == '' ||
|
||||||
|
paramsGetResources.orderField == 'deptSort' ||
|
||||||
|
paramsGetResources.orderField == 'pin_top'),
|
||||||
|
paramsGetResources.infoList.filter(
|
||||||
|
(val) => val.attrType == '组件类型'
|
||||||
|
)[0] &&
|
||||||
|
paramsGetResources.infoList.filter(
|
||||||
|
(val) => val.attrType == '组件类型'
|
||||||
|
)[0].attrValue == '图层服务' &&
|
||||||
|
(paramsGetResources.orderField == '' ||
|
||||||
|
paramsGetResources.orderField == 'deptSort' ||
|
||||||
|
paramsGetResources.orderField == 'pin_top')
|
||||||
|
)
|
||||||
|
if (
|
||||||
|
(select == '应用资源' &&
|
||||||
|
(paramsGetResources.orderField == '' ||
|
||||||
|
paramsGetResources.orderField == 'deptSort' ||
|
||||||
|
paramsGetResources.orderField == 'pin_top')) ||
|
||||||
|
(paramsGetResources.infoList.filter(
|
||||||
|
(val) => val.attrType == '组件类型'
|
||||||
|
)[0] &&
|
||||||
|
paramsGetResources.infoList.filter(
|
||||||
|
(val) => val.attrType == '组件类型'
|
||||||
|
)[0].attrValue == '图层服务' &&
|
||||||
|
(paramsGetResources.orderField == '' ||
|
||||||
|
paramsGetResources.orderField == 'deptSort' ||
|
||||||
|
paramsGetResources.orderField == 'pin_top'))
|
||||||
|
) {
|
||||||
|
paramsGetResources.orderField = 'deptSort'
|
||||||
|
} else if (
|
||||||
|
paramsGetResources.infoList.filter(
|
||||||
|
(val) => val.attrType == '组件类型'
|
||||||
|
)[0] &&
|
||||||
|
paramsGetResources.infoList.filter(
|
||||||
|
(val) => val.attrType == '组件类型'
|
||||||
|
)[0].attrValue == '智能算法' &&
|
||||||
|
(paramsGetResources.orderField == '' ||
|
||||||
|
paramsGetResources.orderField == 'deptSort' ||
|
||||||
|
paramsGetResources.orderField == 'pin_top')
|
||||||
|
) {
|
||||||
|
paramsGetResources.orderField = 'pin_top'
|
||||||
|
} else if (
|
||||||
|
paramsGetResources.orderField == '' ||
|
||||||
|
paramsGetResources.orderField == 'deptSort' ||
|
||||||
|
paramsGetResources.orderField == 'pin_top'
|
||||||
|
) {
|
||||||
|
paramsGetResources.orderField = ''
|
||||||
|
}
|
||||||
if (searchValue.value) {
|
if (searchValue.value) {
|
||||||
let str = ''
|
let str = ''
|
||||||
let r = null
|
let r = null
|
||||||
|
@ -1289,7 +1478,11 @@
|
||||||
getNewList()
|
getNewList()
|
||||||
|
|
||||||
if (!tecHnosphere && !appLiCation) {
|
if (!tecHnosphere && !appLiCation) {
|
||||||
getAppResources()
|
if (searchValue.value && !select2) {
|
||||||
|
globalSearch()
|
||||||
|
} else {
|
||||||
|
getAppResources2()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// 全部申请
|
// 全部申请
|
||||||
|
@ -1350,7 +1543,7 @@
|
||||||
)
|
)
|
||||||
// router.currentRoute.value.query.select
|
// router.currentRoute.value.query.select
|
||||||
tagFlag.value = false
|
tagFlag.value = false
|
||||||
chongzhi()
|
chongzhi(true)
|
||||||
getNewList()
|
getNewList()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -1359,6 +1552,40 @@
|
||||||
location.reload()
|
location.reload()
|
||||||
console.log('URL发生变化了')
|
console.log('URL发生变化了')
|
||||||
})
|
})
|
||||||
|
// 能力广场
|
||||||
|
const visibleAbilitySquare = ref(false)
|
||||||
|
let abilitySquare = ref(['应用广场', '算法广场', 'GIS广场'])
|
||||||
|
const showAbilitySquareNum = ref(0)
|
||||||
|
const showAbilitySquare = () => {
|
||||||
|
if (showAbilitySquareNum.value === 0) {
|
||||||
|
showAbilitySquareNum.value = 1
|
||||||
|
visibleAbilitySquare.value = true
|
||||||
|
} else if (showAbilitySquareNum.value === 1) {
|
||||||
|
showAbilitySquareNum.value = 0
|
||||||
|
visibleAbilitySquare.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let abilitySquareFunctionData = ref('智能算法')
|
||||||
|
const abilitySquareFunction = (e) => {
|
||||||
|
let snumSquare = ref({})
|
||||||
|
if (e === '应用广场') {
|
||||||
|
abilitySquareFunctionData.value = '应用资源'
|
||||||
|
} else if (e === '算法广场') {
|
||||||
|
abilitySquareFunctionData.value = '智能算法'
|
||||||
|
} else if (e === 'GIS广场') {
|
||||||
|
abilitySquareFunctionData.value = '图层服务'
|
||||||
|
}
|
||||||
|
snumSquare.value = {
|
||||||
|
abilityToType: abilitySquareFunctionData.value,
|
||||||
|
}
|
||||||
|
const applypage = router.resolve({
|
||||||
|
path: '/capacitySquare', // 跳转的页面路由
|
||||||
|
query: snumSquare.value,
|
||||||
|
})
|
||||||
|
window.open(applypage.href, '_blank')
|
||||||
|
visibleAbilitySquare.value = false
|
||||||
|
abilitySquareFunctionData.value = '智能算法'
|
||||||
|
}
|
||||||
return {
|
return {
|
||||||
listKey,
|
listKey,
|
||||||
ListContent,
|
ListContent,
|
||||||
|
@ -1375,6 +1602,7 @@
|
||||||
Cardsname,
|
Cardsname,
|
||||||
getNewList,
|
getNewList,
|
||||||
getAppResources,
|
getAppResources,
|
||||||
|
getAppResources2,
|
||||||
chongzhi,
|
chongzhi,
|
||||||
onSearch,
|
onSearch,
|
||||||
onShowSizeChange,
|
onShowSizeChange,
|
||||||
|
@ -1399,6 +1627,17 @@
|
||||||
getShoppingCartList,
|
getShoppingCartList,
|
||||||
whoShow1,
|
whoShow1,
|
||||||
applyAll,
|
applyAll,
|
||||||
|
handleAdd,
|
||||||
|
flag,
|
||||||
|
abilitySquare,
|
||||||
|
visibleAbilitySquare,
|
||||||
|
showAbilitySquare,
|
||||||
|
abilitySquareFunction,
|
||||||
|
abilitySquareFunctionData,
|
||||||
|
showAbilitySquareNum,
|
||||||
|
globalData,
|
||||||
|
globalSearch,
|
||||||
|
camera,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
@ -1427,6 +1666,10 @@
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
@font-face {
|
||||||
|
font-family: 'webfont';
|
||||||
|
src: url('~@/assets/capacitySquare/webfont.ttf');
|
||||||
|
}
|
||||||
.resultListSearchInput-father {
|
.resultListSearchInput-father {
|
||||||
background: #f3f5f9;
|
background: #f3f5f9;
|
||||||
padding: 0.2rem;
|
padding: 0.2rem;
|
||||||
|
@ -1696,13 +1939,13 @@
|
||||||
|
|
||||||
.top-title {
|
.top-title {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-around;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
font-size: 0.2rem;
|
font-size: 0.2rem;
|
||||||
font-family: 'Alibaba PuHuiTi';
|
font-family: 'Alibaba PuHuiTi';
|
||||||
color: #000000;
|
color: #000000;
|
||||||
line-height: 0.34rem;
|
line-height: 0.34rem;
|
||||||
|
margin-bottom: 0.2rem;
|
||||||
.photo {
|
.photo {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
height: 0.44rem;
|
height: 0.44rem;
|
||||||
|
@ -1711,7 +1954,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
div {
|
div {
|
||||||
margin: 0 0.2rem;
|
// margin: 0 0.2rem;
|
||||||
padding: 0 0.1rem;
|
padding: 0 0.1rem;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -1852,6 +2095,95 @@
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.abilitySquare {
|
||||||
|
width: 0.7rem;
|
||||||
|
height: 0.7rem;
|
||||||
|
border-radius: 0.04rem;
|
||||||
|
border: 0.01rem #94aac9 solid;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
// justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
padding-top: 0.05rem;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 10;
|
||||||
|
bottom: 1.56rem;
|
||||||
|
right: 0.1rem;
|
||||||
|
cursor: pointer;
|
||||||
|
background: #e3edfc;
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
p:nth-child(1) {
|
||||||
|
height: 0.35rem;
|
||||||
|
width: 0.36rem;
|
||||||
|
background: url('~@/assets/home/abilitysquare.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
background: #ffffff;
|
||||||
|
font-family: webfont;
|
||||||
|
width: 1.35rem;
|
||||||
|
height: 1rem;
|
||||||
|
border-radius: 0.03rem;
|
||||||
|
border: 0.01rem solid #dfd9d9;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0.9rem;
|
||||||
|
left: -0.62rem;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
li {
|
||||||
|
list-style: none;
|
||||||
|
color: #0061ec;
|
||||||
|
font-size: 0.18rem;
|
||||||
|
padding: 0.02rem;
|
||||||
|
padding-left: 0.4rem;
|
||||||
|
border-bottom: 0.01rem solid #dfd9d9;
|
||||||
|
}
|
||||||
|
li:nth-of-type(1) {
|
||||||
|
background: url('~@/assets/home/appIcon.png') no-repeat;
|
||||||
|
background-position: 0.18rem center;
|
||||||
|
}
|
||||||
|
li:nth-of-type(2) {
|
||||||
|
background: url('~@/assets/home/AiIcon.png') no-repeat;
|
||||||
|
background-position: 0.18rem center;
|
||||||
|
}
|
||||||
|
li:nth-of-type(3) {
|
||||||
|
border-bottom: none;
|
||||||
|
background: url('~@/assets/home/GisIcon.png') no-repeat;
|
||||||
|
background-position: 0.18rem center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ul::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0.98rem;
|
||||||
|
right: 0.12rem;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border: 0.13rem solid;
|
||||||
|
border-color: #fff transparent transparent transparent;
|
||||||
|
}
|
||||||
|
ul::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0.99rem;
|
||||||
|
right: 0.12rem;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border: 0.13rem solid;
|
||||||
|
border-color: #dfd9d9 transparent transparent transparent;
|
||||||
|
}
|
||||||
|
@keyframes ulShowTime {
|
||||||
|
0% {
|
||||||
|
transform: scale(0);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: scale(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.top-content-father {
|
.top-content-father {
|
||||||
width: 10.87rem;
|
width: 10.87rem;
|
||||||
|
|
|
@ -114,7 +114,10 @@
|
||||||
<a-form-item
|
<a-form-item
|
||||||
label="应用背景"
|
label="应用背景"
|
||||||
name="applicationBackground"
|
name="applicationBackground"
|
||||||
:rules="[{ required: true, message: '请输入应用背景' }]"
|
:rules="[
|
||||||
|
{ required: true, message: '请输入应用背景' },
|
||||||
|
{ min: 50, message: '应用背景最少为50个字' },
|
||||||
|
]"
|
||||||
>
|
>
|
||||||
<a-textarea
|
<a-textarea
|
||||||
placeholder="请输入应用背景"
|
placeholder="请输入应用背景"
|
||||||
|
@ -123,7 +126,7 @@
|
||||||
/>
|
/>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<!-- <div>
|
||||||
<a-form-item
|
<a-form-item
|
||||||
label="期望效果"
|
label="期望效果"
|
||||||
name="effectWish"
|
name="effectWish"
|
||||||
|
@ -135,8 +138,8 @@
|
||||||
:rows="4"
|
:rows="4"
|
||||||
/>
|
/>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</div>
|
</div> -->
|
||||||
<a-form-item
|
<!-- <a-form-item
|
||||||
style="color: #666; font-size: 16px"
|
style="color: #666; font-size: 16px"
|
||||||
label="申请单附件"
|
label="申请单附件"
|
||||||
name="applyDoc"
|
name="applyDoc"
|
||||||
|
@ -175,7 +178,7 @@
|
||||||
<div style="margin-top: 8px">上传限一个文件</div>
|
<div style="margin-top: 8px">上传限一个文件</div>
|
||||||
</div>
|
</div>
|
||||||
</a-upload>
|
</a-upload>
|
||||||
</a-form-item>
|
</a-form-item> -->
|
||||||
<div class="bottom-btn">
|
<div class="bottom-btn">
|
||||||
<a-button
|
<a-button
|
||||||
style="
|
style="
|
||||||
|
@ -799,11 +802,21 @@
|
||||||
console.log(`selected ${value}`)
|
console.log(`selected ${value}`)
|
||||||
}
|
}
|
||||||
const systemHandleSearch = (value) => {
|
const systemHandleSearch = (value) => {
|
||||||
console.log(`search ${value}`)
|
// console.log(`search ${value}`)
|
||||||
text.value = value
|
// text.value = value
|
||||||
systemOptions.value = systemOptions2.value.filter(
|
// systemOptions.value = systemOptions2.value.filter(
|
||||||
(item) => item.label.search(text.value) > -1
|
// (item) => item.label.search(text.value) > -1
|
||||||
)
|
// )
|
||||||
|
let valueArray = []
|
||||||
|
systemOptions.value.map((val) => {
|
||||||
|
valueArray.push(val.value)
|
||||||
|
})
|
||||||
|
if (valueArray.indexOf(value) == -1) {
|
||||||
|
systemOptions.value.push({
|
||||||
|
value: value,
|
||||||
|
label: value,
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
pageWithAttrs({
|
pageWithAttrs({
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
|
@ -835,7 +848,14 @@
|
||||||
console.log('focus')
|
console.log('focus')
|
||||||
// console.log(formName.applicationSystem)
|
// console.log(formName.applicationSystem)
|
||||||
// formName.applicationSystem = []
|
// formName.applicationSystem = []
|
||||||
systemOptions.value = systemOptions2.value
|
let arrId = []
|
||||||
|
for (var valueIndex of systemOptions2.value) {
|
||||||
|
if (arrId.indexOf(valueIndex['value']) == -1) {
|
||||||
|
arrId.push(valueIndex['value'])
|
||||||
|
systemOptions.value.push(valueIndex)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// systemOptions.value = systemOptions2.value
|
||||||
// systemOptions.value = []
|
// systemOptions.value = []
|
||||||
}
|
}
|
||||||
// const filterOption = (input, option) => {
|
// const filterOption = (input, option) => {
|
||||||
|
|
|
@ -6,10 +6,13 @@
|
||||||
props.showView === 'algorithm-details' ? 'blue' : '',
|
props.showView === 'algorithm-details' ? 'blue' : '',
|
||||||
]"
|
]"
|
||||||
>
|
>
|
||||||
<div class="name">
|
<div class="name" @click="goToHome">
|
||||||
<div class="name-bg" v-if="!whoShow1.itShowXiHaiAn"></div>
|
<div class="name-bg" v-if="!whoShow1.itShowXiHaiAn"></div>
|
||||||
<div class="name-bg-xihaian" v-else></div>
|
<div class="name-bg-xihaian" v-else></div>
|
||||||
城市云脑通用能力服务平台
|
<div class="name-content">
|
||||||
|
<p>城市云脑通用能力服务平台</p>
|
||||||
|
<p>(United Capacity System)</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-for="item in navList"
|
v-for="item in navList"
|
||||||
|
@ -175,6 +178,12 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
// 返回首页
|
||||||
|
const goToHome = () => {
|
||||||
|
router.push({
|
||||||
|
path: '/home',
|
||||||
|
})
|
||||||
|
}
|
||||||
// 跳转页面
|
// 跳转页面
|
||||||
const jumpPage = (item) => {
|
const jumpPage = (item) => {
|
||||||
// console.log(item)
|
// console.log(item)
|
||||||
|
@ -352,6 +361,7 @@
|
||||||
font-size: 0.16rem;
|
font-size: 0.16rem;
|
||||||
}
|
}
|
||||||
.name {
|
.name {
|
||||||
|
cursor: pointer;
|
||||||
font-size: 0.22rem;
|
font-size: 0.22rem;
|
||||||
font-family: header-typeface;
|
font-family: header-typeface;
|
||||||
margin-right: 0.2rem;
|
margin-right: 0.2rem;
|
||||||
|
@ -360,7 +370,7 @@
|
||||||
.name-bg {
|
.name-bg {
|
||||||
height: 0.6rem;
|
height: 0.6rem;
|
||||||
width: 0.6rem;
|
width: 0.6rem;
|
||||||
background: url('~@/assets/newHome/newHome-title-bg.png') no-repeat;
|
background: url('~@/assets/newHome/ucs-2.png') no-repeat;
|
||||||
background-size: 100%;
|
background-size: 100%;
|
||||||
margin-right: 0.15rem;
|
margin-right: 0.15rem;
|
||||||
}
|
}
|
||||||
|
@ -372,6 +382,16 @@
|
||||||
background-size: 100%;
|
background-size: 100%;
|
||||||
margin-right: 0.15rem;
|
margin-right: 0.15rem;
|
||||||
}
|
}
|
||||||
|
.name-content {
|
||||||
|
padding-top: 0.14rem;
|
||||||
|
p {
|
||||||
|
font-size: 0.2rem;
|
||||||
|
margin-bottom: 0;
|
||||||
|
&:nth-of-type(2) {
|
||||||
|
font-size: 0.12rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.nav {
|
.nav {
|
||||||
width: 1.2rem;
|
width: 1.2rem;
|
||||||
|
@ -432,6 +452,16 @@
|
||||||
box-shadow: 0 0.02rem 0.1rem rgba(0, 0, 0, 0.1);
|
box-shadow: 0 0.02rem 0.1rem rgba(0, 0, 0, 0.1);
|
||||||
.name {
|
.name {
|
||||||
color: #0058e1;
|
color: #0058e1;
|
||||||
|
.name-bg {
|
||||||
|
height: 0.6rem;
|
||||||
|
width: 0.6rem;
|
||||||
|
background: url('~@/assets/newHome/ucs-1.png') no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
margin-right: 0.15rem;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
color: #0058e1;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.icon {
|
.icon {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<div class="img" :style="{ 'background-image': `url(${abilityInfo.bgImg || ''})` }"></div>
|
<div class="img" :style="{ 'background-image': `url(${abilityInfo.bgImg || ''})` }"></div>
|
||||||
<div class="list-box" v-if="abilityInfo.list.length">
|
<div class="list-box" v-if="abilityInfo.list.length">
|
||||||
<div class="list-item" v-for="(item, i) in abilityInfo.list" :key="i" :class="i % 2 == 0 ? 'one' : ''">
|
<div class="list-item" v-for="(item, i) in abilityInfo.list" :key="i" :class="i % 2 == 0 ? 'one' : ''">
|
||||||
{{ item }}</div>
|
{{ (item || item === 0) ? item : '--' }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="no-data" v-else>
|
<div class="no-data" v-else>
|
||||||
<a-empty description="暂无数据" />
|
<a-empty description="暂无数据" />
|
||||||
|
@ -15,8 +15,6 @@ const props = defineProps({
|
||||||
abilityInfo: { type: Object, default: () => { } },
|
abilityInfo: { type: Object, default: () => { } },
|
||||||
})
|
})
|
||||||
|
|
||||||
console.log('abilityInfo------------>', props.abilityInfo);
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
|
@ -118,6 +118,7 @@
|
||||||
? 'ywzj'
|
? 'ywzj'
|
||||||
: ''
|
: ''
|
||||||
"
|
"
|
||||||
|
@click="toView('details', item)"
|
||||||
v-else-if="
|
v-else-if="
|
||||||
selectCardsname !== '基础设施' &&
|
selectCardsname !== '基础设施' &&
|
||||||
selectCardsname !== '融合服务' &&
|
selectCardsname !== '融合服务' &&
|
||||||
|
@ -131,7 +132,7 @@
|
||||||
selectCardsname === '融合服务' || selectCardsname === '赋能场景'
|
selectCardsname === '融合服务' || selectCardsname === '赋能场景'
|
||||||
"
|
"
|
||||||
></div>
|
></div>
|
||||||
<div class="right">
|
<div class="right" @click="toView('details', item)">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<span style="display: flex; align-items: center; width: 680px">
|
<span style="display: flex; align-items: center; width: 680px">
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
|
@ -163,6 +164,43 @@
|
||||||
p-id="3065"
|
p-id="3065"
|
||||||
></path>
|
></path>
|
||||||
</svg>
|
</svg>
|
||||||
|
<svg
|
||||||
|
t="1652322568870"
|
||||||
|
class="icon"
|
||||||
|
viewBox="0 0 3072 1024"
|
||||||
|
version="1.1"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
p-id="3062"
|
||||||
|
width="40"
|
||||||
|
height="40"
|
||||||
|
v-if="item.applyState == '审核中'"
|
||||||
|
style="margin-left: 10px; min-width: 40px"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M2958.222222 0a113.777778 113.777778 0 0 1 113.777778 113.777778v796.444444a113.777778 113.777778 0 0 1-113.777778 113.777778H500.053333a113.777778 113.777778 0 0 1-85.617777-38.798222L32.824889 549.432889a56.888889 56.888889 0 0 1 0-74.922667L414.435556 38.798222A113.777778 113.777778 0 0 1 499.996444 0H2958.222222z m0 56.888889H500.053333a56.888889 56.888889 0 0 0-42.837333 19.399111L75.605333 512l381.610667 435.712a56.888889 56.888889 0 0 0 42.780444 19.399111H2958.222222a56.888889 56.888889 0 0 0 56.888889-56.888889V113.777778a56.888889 56.888889 0 0 0-56.888889-56.888889z"
|
||||||
|
fill="#d81e06"
|
||||||
|
p-id="3063"
|
||||||
|
></path>
|
||||||
|
<path
|
||||||
|
d="M398.222222 398.222222a113.777778 113.777778 0 1 1 0 227.555556 113.777778 113.777778 0 0 1 0-227.555556z m0 56.888889a56.888889 56.888889 0 1 0 0 113.777778 56.888889 56.888889 0 0 0 0-113.777778z"
|
||||||
|
fill="#d81e06"
|
||||||
|
p-id="3064"
|
||||||
|
></path>
|
||||||
|
</svg>
|
||||||
|
<span
|
||||||
|
v-if="item.applyState == '审核中'"
|
||||||
|
style="
|
||||||
|
font-size: 12px;
|
||||||
|
-webkit-transform: scale(0.75);
|
||||||
|
color: #d81e06;
|
||||||
|
position: relative;
|
||||||
|
left: -35px;
|
||||||
|
top: -0.6px;
|
||||||
|
font-weight: 500;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
审核中
|
||||||
|
</span>
|
||||||
</span>
|
</span>
|
||||||
<div class="header-right">
|
<div class="header-right">
|
||||||
<div
|
<div
|
||||||
|
@ -200,24 +238,10 @@
|
||||||
<span>{{ item.createDate.substring(11, 19) }}</span>
|
<span>{{ item.createDate.substring(11, 19) }}</span>
|
||||||
</template>
|
</template>
|
||||||
<template v-else>--</template>
|
<template v-else>--</template>
|
||||||
<!-- <span>{{ item.createDate || '--' }}</span> -->
|
|
||||||
</div>
|
</div>
|
||||||
<!-- <div>
|
|
||||||
更新时间:
|
|
||||||
<span>{{ item.updateDate || '--' }}</span> -->
|
|
||||||
<!-- </div> -->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="dec">
|
<div class="dec">
|
||||||
<!-- <div
|
|
||||||
v-if="
|
|
||||||
selectCardsname !== '基础设施' &&
|
|
||||||
selectCardsname !== '数据资源' &&
|
|
||||||
selectCardsname !== '融合服务'
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<span>{{ item.shareType || '--' }}</span>
|
|
||||||
</div> -->
|
|
||||||
<div
|
<div
|
||||||
v-if="
|
v-if="
|
||||||
selectCardsname !== '融合服务' &&
|
selectCardsname !== '融合服务' &&
|
||||||
|
@ -273,21 +297,15 @@
|
||||||
收藏量:{{ item.collectCount || 0 }}次
|
收藏量:{{ item.collectCount || 0 }}次
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="pingfen">
|
|
||||||
<a-tooltip placement="top" mouseEnterDelay="1">
|
|
||||||
<a-rate
|
|
||||||
:value="item.score || 0"
|
|
||||||
disabled
|
|
||||||
v-if="item.score != 0"
|
|
||||||
/>
|
|
||||||
</a-tooltip>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
</div>
|
||||||
<div class="right" v-if="selectCardsname !== '基础设施'">
|
<div class="right" v-if="selectCardsname !== '基础设施'">
|
||||||
<div class="shopping" :key="shoppingKey">
|
<div class="shopping" :key="shoppingKey">
|
||||||
<template
|
<template
|
||||||
v-if="
|
v-if="
|
||||||
selectCardsname == '组件服务' ||
|
(selectCardsname == '组件服务' &&
|
||||||
|
item.infoList.filter(
|
||||||
|
(val) => val.attrType == '外部服务地址'
|
||||||
|
).length === 0) ||
|
||||||
(selectCardsname == '应用资源' && whoShow1.itShowQingDao)
|
(selectCardsname == '应用资源' && whoShow1.itShowQingDao)
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
|
@ -298,7 +316,7 @@
|
||||||
<span
|
<span
|
||||||
class="shopping-on"
|
class="shopping-on"
|
||||||
v-else
|
v-else
|
||||||
@click="addShoppingCart(item, index)"
|
@click.stop="addShoppingCart(item, index)"
|
||||||
></span>
|
></span>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
@ -306,12 +324,12 @@
|
||||||
<span
|
<span
|
||||||
class="sc-down"
|
class="sc-down"
|
||||||
v-if="item.isCollect == 'false'"
|
v-if="item.isCollect == 'false'"
|
||||||
@click="addCollect(item)"
|
@click.stop="addCollect(item)"
|
||||||
></span>
|
></span>
|
||||||
<span
|
<span
|
||||||
class="sc-on"
|
class="sc-on"
|
||||||
v-if="item.isCollect == 'true'"
|
v-if="item.isCollect == 'true'"
|
||||||
@click="addCollect(item)"
|
@click.stop="addCollect(item)"
|
||||||
></span>
|
></span>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
|
@ -321,11 +339,14 @@
|
||||||
cardType == '组件服务' && findComponentName(item, '智能算法')
|
cardType == '组件服务' && findComponentName(item, '智能算法')
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
<span class="pk-on" @click="goComparePk(item, index)"></span>
|
<span
|
||||||
|
class="pk-on"
|
||||||
|
@click.stop="goComparePk(item, index)"
|
||||||
|
></span>
|
||||||
</div>
|
</div>
|
||||||
<a-button
|
<a-button
|
||||||
type="primary"
|
type="primary"
|
||||||
@click="toView('details', item)"
|
@click.stop="toView('details', item)"
|
||||||
v-if="!whoShow1.itShowBaoTou"
|
v-if="!whoShow1.itShowBaoTou"
|
||||||
>
|
>
|
||||||
查看详情
|
查看详情
|
||||||
|
@ -336,21 +357,13 @@
|
||||||
selectCardsname === '融合服务' ||
|
selectCardsname === '融合服务' ||
|
||||||
selectCardsname === '赋能场景'
|
selectCardsname === '赋能场景'
|
||||||
"
|
"
|
||||||
@click="handleAKeyApplication(item)"
|
@click.stop="handleAKeyApplication(item)"
|
||||||
>
|
>
|
||||||
一键申请
|
一键申请
|
||||||
</a-button>
|
</a-button>
|
||||||
<!-- <a-button
|
|
||||||
style="margin-left: 10px"
|
|
||||||
v-show="
|
|
||||||
cardType == '组件服务' && findComponentName(item, '智能算法')
|
|
||||||
"
|
|
||||||
>
|
|
||||||
免费试用
|
|
||||||
</a-button> -->
|
|
||||||
<a-button
|
<a-button
|
||||||
type="primary"
|
type="primary"
|
||||||
@click="toView('apply', item)"
|
@click.stop="toView('apply', item)"
|
||||||
v-show="
|
v-show="
|
||||||
cardType == '组件服务' ||
|
cardType == '组件服务' ||
|
||||||
(cardType == '应用资源' && whoShow1.itShowQingDao)
|
(cardType == '应用资源' && whoShow1.itShowQingDao)
|
||||||
|
@ -612,37 +625,55 @@
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
if (type === 'apply') {
|
if (type === 'apply') {
|
||||||
console.log('一键申请===================>', item)
|
// 外部服务地址跳转到外部
|
||||||
localStorage.setItem(
|
const webUrl = item.infoList.filter(
|
||||||
'applyList',
|
(val) => val.attrType == '外部服务地址'
|
||||||
JSON.stringify([
|
)[0]?.attrValue
|
||||||
{
|
if (webUrl) {
|
||||||
arr: [
|
window.open(webUrl)
|
||||||
{
|
} else {
|
||||||
delFlag: item.delFlag,
|
if (
|
||||||
description: item.description,
|
!(
|
||||||
resourceId: item.id,
|
props.selectCardsname === '应用资源' ||
|
||||||
resourceName: item.name,
|
props.selectCardsname === '组件服务'
|
||||||
time: item.createDate,
|
) ||
|
||||||
type: item.type,
|
whoShow1.itShowBaoTou
|
||||||
componentType:
|
) {
|
||||||
(item.infoList.filter(
|
return
|
||||||
(val) => val.attrType == '组件类型'
|
}
|
||||||
)[0] &&
|
// 内部跳转申请页面
|
||||||
item.infoList.filter(
|
console.log('一键申请===================>', item)
|
||||||
|
localStorage.setItem(
|
||||||
|
'applyList',
|
||||||
|
JSON.stringify([
|
||||||
|
{
|
||||||
|
arr: [
|
||||||
|
{
|
||||||
|
delFlag: item.delFlag,
|
||||||
|
description: item.description,
|
||||||
|
resourceId: item.id,
|
||||||
|
resourceName: item.name,
|
||||||
|
time: item.createDate,
|
||||||
|
type: item.type,
|
||||||
|
componentType:
|
||||||
|
(item.infoList.filter(
|
||||||
(val) => val.attrType == '组件类型'
|
(val) => val.attrType == '组件类型'
|
||||||
)[0].attrValue) ||
|
)[0] &&
|
||||||
'',
|
item.infoList.filter(
|
||||||
},
|
(val) => val.attrType == '组件类型'
|
||||||
],
|
)[0].attrValue) ||
|
||||||
deptId: item.deptId,
|
'',
|
||||||
deptName: item.deptName,
|
},
|
||||||
},
|
],
|
||||||
])
|
deptId: item.deptId,
|
||||||
)
|
deptName: item.deptName,
|
||||||
router.push({
|
},
|
||||||
path: '/apply',
|
])
|
||||||
})
|
)
|
||||||
|
router.push({
|
||||||
|
path: '/apply',
|
||||||
|
})
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
console.log(
|
console.log(
|
||||||
'111111111111111111===========>',
|
'111111111111111111===========>',
|
||||||
|
|
|
@ -43,14 +43,21 @@
|
||||||
<template #title>{{ val.title }}</template>
|
<template #title>{{ val.title }}</template>
|
||||||
<span class="name">
|
<span class="name">
|
||||||
{{ val.title }}
|
{{ val.title }}
|
||||||
|
<span
|
||||||
|
v-if="item.title === '区级'"
|
||||||
|
style="
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: 4px;
|
||||||
|
white-space: nowrap;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
({{ val.total }})
|
||||||
|
</span>
|
||||||
</span>
|
</span>
|
||||||
</a-tooltip>
|
</a-tooltip>
|
||||||
</div>
|
</div>
|
||||||
<span v-if="item.title !== '区级'">{{ val.total }}</span>
|
<span v-if="item.title !== '区级'">{{ val.total }}</span>
|
||||||
<span v-else>
|
<span v-else>
|
||||||
<span style="display: inline-block; margin-right: 4px">
|
|
||||||
{{ val.total }}
|
|
||||||
</span>
|
|
||||||
<down-outlined v-show="!val.show" />
|
<down-outlined v-show="!val.show" />
|
||||||
<up-outlined v-show="val.show" />
|
<up-outlined v-show="val.show" />
|
||||||
</span>
|
</span>
|
||||||
|
|
|
@ -19,17 +19,22 @@
|
||||||
<div class="hengxian"></div>
|
<div class="hengxian"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2"
|
<div v-loading="loadingData">
|
||||||
:resourceList="resourceList" :resourceTotal="resourceTotal" :selectCardsname="number == 0 ? '融合服务' : '赋能场景'" />
|
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2"
|
||||||
<div class="pagination">
|
:resourceList="resourceList" :resourceTotal="resourceTotal"
|
||||||
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage"
|
:selectCardsname="number == 0 ? '融合服务' : '赋能场景'" />
|
||||||
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper :total="resourceTotal"
|
<div class="pagination">
|
||||||
:page-size-options="pageSizeOptions" @change="pageChange" @showSizeChange="onShowSizeChange" />
|
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage"
|
||||||
</div>
|
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper
|
||||||
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem">
|
:total="resourceTotal" :page-size-options="pageSizeOptions" @change="pageChange"
|
||||||
<a-empty />
|
@showSizeChange="onShowSizeChange" />
|
||||||
|
</div>
|
||||||
|
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem">
|
||||||
|
<a-empty />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<home-footer></home-footer>
|
<home-footer></home-footer>
|
||||||
</template>
|
</template>
|
||||||
|
@ -58,6 +63,7 @@ export default defineComponent({
|
||||||
const resourceList = reactive({ data: [] })
|
const resourceList = reactive({ data: [] })
|
||||||
const resourceTotal = ref(0)
|
const resourceTotal = ref(0)
|
||||||
const current = ref(1)
|
const current = ref(1)
|
||||||
|
const loadingData = ref(false)
|
||||||
// 选项卡
|
// 选项卡
|
||||||
const titleName = ref([
|
const titleName = ref([
|
||||||
{
|
{
|
||||||
|
@ -120,6 +126,8 @@ export default defineComponent({
|
||||||
|
|
||||||
// 获取融合服务列表
|
// 获取融合服务列表
|
||||||
const getIntegrationList = () => {
|
const getIntegrationList = () => {
|
||||||
|
loadingData.value = true;
|
||||||
|
console.log('获取融合服务列表------------>');
|
||||||
let postData = {
|
let postData = {
|
||||||
limit: currentPageSize.value,
|
limit: currentPageSize.value,
|
||||||
page: currentPage.value,
|
page: currentPage.value,
|
||||||
|
@ -130,13 +138,17 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
getIntegrationServicesList(postData).then(
|
getIntegrationServicesList(postData).then(
|
||||||
(res) => {
|
(res) => {
|
||||||
|
loadingData.value = false;
|
||||||
if (res.data.code !== 0) {
|
if (res.data.code !== 0) {
|
||||||
return message.error(res.data.msg)
|
return message.error(res.data.msg)
|
||||||
}
|
}
|
||||||
|
console.log('res.data------------>', res.data);
|
||||||
|
|
||||||
resourceList.data = res.data.data.list || []
|
resourceList.data = res.data.data.list || []
|
||||||
resourceTotal.value = res.data.data.total || 0
|
resourceTotal.value = res.data.data.total || 0
|
||||||
},
|
},
|
||||||
(err) => {
|
(err) => {
|
||||||
|
loadingData.value = false;
|
||||||
message.error(err)
|
message.error(err)
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
@ -180,6 +192,7 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
console.log('222----onMounted-------->', 222);
|
||||||
listKey2.value++
|
listKey2.value++
|
||||||
getAppResources()
|
getAppResources()
|
||||||
})
|
})
|
||||||
|
@ -215,6 +228,7 @@ export default defineComponent({
|
||||||
titleName,
|
titleName,
|
||||||
changeCards,
|
changeCards,
|
||||||
number,
|
number,
|
||||||
|
loadingData,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
|
|
@ -20,7 +20,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-row-start desc">
|
<div class="flex-row-start desc">
|
||||||
<div class="desc">描述:{{ detailInfoObj.description || '--' }}</div>
|
<a-tooltip placement="topLeft" :title="detailInfoObj.description || '--'">
|
||||||
|
<div class="desc">描述:{{ detailInfoObj.description || '--' }}</div>
|
||||||
|
</a-tooltip>
|
||||||
</div>
|
</div>
|
||||||
<div class="btn-box">
|
<div class="btn-box">
|
||||||
<a-button size="big" class="btn-text" type="primary" @click="handleAKeyApplication()">
|
<a-button size="big" class="btn-text" type="primary" @click="handleAKeyApplication()">
|
||||||
|
@ -29,12 +31,11 @@
|
||||||
</template>
|
</template>
|
||||||
申请使用
|
申请使用
|
||||||
</a-button>
|
</a-button>
|
||||||
<a-button size="big" class="btn-text" :type="detailInfoObj.isCollect == 'true' ? 'primary' : ''"
|
<a-button size="big" class="btn-text" type="primary" @click="addCollect()">
|
||||||
@click="addCollect()">
|
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<form-outlined />
|
<form-outlined />
|
||||||
</template>
|
</template>
|
||||||
收藏
|
{{ detailInfoObj.isCollect == 'true' ? '已收藏' : '收藏' }}
|
||||||
</a-button>
|
</a-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -79,21 +80,25 @@ const abilityList = ref([
|
||||||
{
|
{
|
||||||
name: '数据资源',
|
name: '数据资源',
|
||||||
bgImg: require('../../assets/home/integration/sjzyDetail.png'),
|
bgImg: require('../../assets/home/integration/sjzyDetail.png'),
|
||||||
list: []
|
list: [],
|
||||||
|
showTextKey: 'zyname',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '组件服务',
|
name: '组件服务',
|
||||||
bgImg: require('../../assets/home/integration/zjfwDetail.png'),
|
bgImg: require('../../assets/home/integration/zjfwDetail.png'),
|
||||||
list: []
|
list: [],
|
||||||
|
showTextKey: 'name',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '基础设施',
|
name: '基础设施',
|
||||||
bgImg: require('../../assets/home/integration/jcssDetail.png'),
|
bgImg: require('../../assets/home/integration/jcssDetail.png'),
|
||||||
list: []
|
list: [],
|
||||||
|
showTextKey: 'channelName',
|
||||||
},
|
},
|
||||||
])
|
])
|
||||||
const imgUrl = ref('')
|
const imgUrl = ref('')
|
||||||
|
|
||||||
|
|
||||||
// 融合服务--详情
|
// 融合服务--详情
|
||||||
const getIntegrationServicesDeatil = (id) => {
|
const getIntegrationServicesDeatil = (id) => {
|
||||||
loadingPage.value = true
|
loadingPage.value = true
|
||||||
|
@ -109,7 +114,7 @@ const getIntegrationServicesDeatil = (id) => {
|
||||||
let fuseResourceList = detailInfoObj.value.fuseResourceList || []
|
let fuseResourceList = detailInfoObj.value.fuseResourceList || []
|
||||||
abilityList.value.map(v => {
|
abilityList.value.map(v => {
|
||||||
let list = fuseResourceList.filter(x => x.type == v.name) || [];
|
let list = fuseResourceList.filter(x => x.type == v.name) || [];
|
||||||
v.list = list.map(v => v.resource && v.resource.channelName) || []
|
v.list = list.map(x => x.resource && x.resource[v.showTextKey]) || []
|
||||||
})
|
})
|
||||||
let imgList = detailInfoObj.value.fuseAttrList.filter((val) => val.attrType == '服务图片') || []
|
let imgList = detailInfoObj.value.fuseAttrList.filter((val) => val.attrType == '服务图片') || []
|
||||||
imgUrl.value = imgList[0] && imgList[0].attrValue || ''
|
imgUrl.value = imgList[0] && imgList[0].attrValue || ''
|
||||||
|
@ -299,12 +304,10 @@ getIntegrationServicesDeatil(id)
|
||||||
|
|
||||||
.name {
|
.name {
|
||||||
font-size: 0.16rem;
|
font-size: 0.16rem;
|
||||||
margin-bottom: 0.2rem;
|
|
||||||
margin-top: 0.2rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.area {
|
.area {
|
||||||
margin-bottom: 0.2rem;
|
margin: 0.1rem 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.desc {
|
.desc {
|
||||||
|
@ -319,7 +322,7 @@ getIntegrationServicesDeatil(id)
|
||||||
|
|
||||||
.btn-box {
|
.btn-box {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
bottom: -15px;
|
||||||
left: 0.2rem;
|
left: 0.2rem;
|
||||||
|
|
||||||
.btn-text {
|
.btn-text {
|
||||||
|
@ -341,5 +344,4 @@ getIntegrationServicesDeatil(id)
|
||||||
.list-box {
|
.list-box {
|
||||||
padding: 0.4rem;
|
padding: 0.4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -226,6 +226,7 @@
|
||||||
longitude: this.mapSearchParam.gpsX || '',
|
longitude: this.mapSearchParam.gpsX || '',
|
||||||
latitude: this.mapSearchParam.gpsY || '',
|
latitude: this.mapSearchParam.gpsY || '',
|
||||||
radius: this.mapSearchParam.radius || '',
|
radius: this.mapSearchParam.radius || '',
|
||||||
|
status: 1,
|
||||||
}
|
}
|
||||||
let paramsFather = ''
|
let paramsFather = ''
|
||||||
let i = 1
|
let i = 1
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="navigation">
|
<div class="navigation bg-pan-bl">
|
||||||
<div class="main" v-if="qeihuan">
|
<div class="main" v-if="qeihuan">
|
||||||
<div class="top">
|
<div class="top">
|
||||||
<span
|
<span
|
||||||
|
@ -147,6 +147,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="imgBox tracking-in-expand">
|
||||||
|
<img src="~@/assets/newHome/slogan.png" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
|
@ -154,6 +157,7 @@
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
import { useStore } from 'vuex'
|
import { useStore } from 'vuex'
|
||||||
|
import { message } from 'ant-design-vue'
|
||||||
const store = useStore()
|
const store = useStore()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const topList = ref([
|
const topList = ref([
|
||||||
|
@ -225,11 +229,11 @@
|
||||||
appLiCation: '',
|
appLiCation: '',
|
||||||
})
|
})
|
||||||
const changeCard = (name) => {
|
const changeCard = (name) => {
|
||||||
// if (select.value == name) {
|
if (select.value == name && whoShow.itShowQingDao) {
|
||||||
// select.value = ''
|
select.value = ''
|
||||||
// } else {
|
} else {
|
||||||
select.value = name
|
select.value = name
|
||||||
// }
|
}
|
||||||
snum.value.select = select.value
|
snum.value.select = select.value
|
||||||
}
|
}
|
||||||
function selectCard(value) {
|
function selectCard(value) {
|
||||||
|
@ -279,24 +283,29 @@
|
||||||
}
|
}
|
||||||
const mohuchaxun = ref('组件服务')
|
const mohuchaxun = ref('组件服务')
|
||||||
function onSearch() {
|
function onSearch() {
|
||||||
snum.value.str = text.value
|
if (text.value) {
|
||||||
console.log('===================>', text.value)
|
snum.value.str = text.value
|
||||||
store.commit('home/selectCardsData', snum.value)
|
console.log('===================>', text.value)
|
||||||
router.push({
|
store.commit('home/selectCardsData', snum.value)
|
||||||
path: '/DetailsPageconetent',
|
router.push({
|
||||||
query: snum.value,
|
path: '/DetailsPageconetent',
|
||||||
})
|
query: snum.value,
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
message.warning('请输入查询内容!')
|
||||||
|
}
|
||||||
// router.push({ path: '/DetailsPageconetent' })
|
// router.push({ path: '/DetailsPageconetent' })
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.navigation {
|
.navigation {
|
||||||
height: 4.8rem;
|
height: 5.8rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
flex-direction: column;
|
||||||
|
// justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
background: url('~@/assets/newHome/banner-main.jpg') no-repeat;
|
background: url('~@/assets/newHome/banner-main.jpg') no-repeat;
|
||||||
background-size: cover;
|
background-size: 150%;
|
||||||
:deep(.ant-btn) > span {
|
:deep(.ant-btn) > span {
|
||||||
font-size: 0.16rem;
|
font-size: 0.16rem;
|
||||||
}
|
}
|
||||||
|
@ -306,6 +315,7 @@
|
||||||
background: rgba(255, 255, 255, 0.18);
|
background: rgba(255, 255, 255, 0.18);
|
||||||
padding: 0.2rem 0.4rem;
|
padding: 0.2rem 0.4rem;
|
||||||
border-radius: 0.02rem;
|
border-radius: 0.02rem;
|
||||||
|
margin-top: 1.36rem;
|
||||||
.top {
|
.top {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
@ -387,6 +397,7 @@
|
||||||
background: rgba(255, 255, 255, 0.18);
|
background: rgba(255, 255, 255, 0.18);
|
||||||
padding: 0.24rem 0.2rem;
|
padding: 0.24rem 0.2rem;
|
||||||
border-radius: 0.02rem;
|
border-radius: 0.02rem;
|
||||||
|
margin-top: 1.36rem;
|
||||||
.gaoji-top {
|
.gaoji-top {
|
||||||
width: 8.7rem;
|
width: 8.7rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -482,6 +493,87 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.imgBox {
|
||||||
|
width: 8rem;
|
||||||
|
margin-top: 0.18rem;
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.tracking-in-expand {
|
||||||
|
-webkit-animation: tracking-in-expand 0.7s
|
||||||
|
cubic-bezier(0.215, 0.61, 0.355, 1) both;
|
||||||
|
animation: tracking-in-expand 0.7s cubic-bezier(0.215, 0.61, 0.355, 1)
|
||||||
|
both;
|
||||||
|
}
|
||||||
|
/* ----------------------------------------------
|
||||||
|
* Generated by Animista on 2022-8-15 14:3:51
|
||||||
|
* Licensed under FreeBSD License.
|
||||||
|
* See http://animista.net/license for more info.
|
||||||
|
* w: http://animista.net, t: @cssanimista
|
||||||
|
* ---------------------------------------------- */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ----------------------------------------
|
||||||
|
* animation tracking-in-expand
|
||||||
|
* ----------------------------------------
|
||||||
|
*/
|
||||||
|
@-webkit-keyframes tracking-in-expand {
|
||||||
|
0% {
|
||||||
|
letter-spacing: -0.5em;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes tracking-in-expand {
|
||||||
|
0% {
|
||||||
|
letter-spacing: -0.5em;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bg-pan-bl {
|
||||||
|
-webkit-animation: bg-pan-bl 2s both;
|
||||||
|
animation: bg-pan-bl 2s both;
|
||||||
|
}
|
||||||
|
/* ----------------------------------------------
|
||||||
|
* Generated by Animista on 2022-8-15 15:8:37
|
||||||
|
* Licensed under FreeBSD License.
|
||||||
|
* See http://animista.net/license for more info.
|
||||||
|
* w: http://animista.net, t: @cssanimista
|
||||||
|
* ---------------------------------------------- */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ----------------------------------------
|
||||||
|
* animation bg-pan-bl
|
||||||
|
* ----------------------------------------
|
||||||
|
*/
|
||||||
|
@-webkit-keyframes bg-pan-bl {
|
||||||
|
0% {
|
||||||
|
background-size: 130%;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
background-size: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes bg-pan-bl {
|
||||||
|
0% {
|
||||||
|
background-size: 130%;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
background-size: 100%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style>
|
<style>
|
||||||
|
|
|
@ -132,7 +132,7 @@
|
||||||
box-shadow: 0.05rem 0.05rem 0.1rem #ccc;
|
box-shadow: 0.05rem 0.05rem 0.1rem #ccc;
|
||||||
padding: 0 1.5rem;
|
padding: 0 1.5rem;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 4rem;
|
top: 5rem;
|
||||||
left: 3rem;
|
left: 3rem;
|
||||||
.item {
|
.item {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
@ -113,6 +113,37 @@
|
||||||
</div>
|
</div>
|
||||||
</a-modal>
|
</a-modal>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <div @click="showAbilitySquare">
|
||||||
|
<p></p>
|
||||||
|
<p>能力广场</p>
|
||||||
|
<a-modal
|
||||||
|
v-model:visible="visibleAbilitySquare"
|
||||||
|
@ok="handleOkAbilitySquare"
|
||||||
|
class="shangjia-class"
|
||||||
|
@cancel="handlecancelAbilitySquare"
|
||||||
|
>
|
||||||
|
<div class="ant-modal-title" id="vcDialogTitle1">
|
||||||
|
<div class="showBg"></div>
|
||||||
|
能力广场目录
|
||||||
|
</div>
|
||||||
|
<div class="ability-to-type">
|
||||||
|
<div class="ability-to-type-content">
|
||||||
|
<div
|
||||||
|
v-for="item in abilitySquare"
|
||||||
|
:key="item"
|
||||||
|
@click="abilitySquareFunction(item)"
|
||||||
|
:class="
|
||||||
|
abilitySquareFunctionData == item
|
||||||
|
? 'ability-to-type-down'
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ item }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a-modal>
|
||||||
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -142,6 +173,7 @@
|
||||||
abilityToTypeFunctionData.value = item
|
abilityToTypeFunctionData.value = item
|
||||||
}
|
}
|
||||||
let abilityToType = ref(['组件服务', '应用资源'])
|
let abilityToType = ref(['组件服务', '应用资源'])
|
||||||
|
let abilitySquare = ref(['智能算法', '图层服务', '应用资源'])
|
||||||
let componentType = ref([
|
let componentType = ref([
|
||||||
'智能算法',
|
'智能算法',
|
||||||
'图层服务',
|
'图层服务',
|
||||||
|
@ -154,6 +186,11 @@
|
||||||
const showModal = () => {
|
const showModal = () => {
|
||||||
visible.value = true
|
visible.value = true
|
||||||
}
|
}
|
||||||
|
// 能力广场
|
||||||
|
const visibleAbilitySquare = ref(false)
|
||||||
|
const showAbilitySquare = () => {
|
||||||
|
visibleAbilitySquare.value = true
|
||||||
|
}
|
||||||
let componentTypeValueOld = ref('')
|
let componentTypeValueOld = ref('')
|
||||||
function componentTypeValueFunction(item) {
|
function componentTypeValueFunction(item) {
|
||||||
if (componentTypeValueOld.value != item) {
|
if (componentTypeValueOld.value != item) {
|
||||||
|
@ -252,6 +289,28 @@
|
||||||
watch(abilityToTypeFunctionData, () => {
|
watch(abilityToTypeFunctionData, () => {
|
||||||
componentTypeValue.value = ''
|
componentTypeValue.value = ''
|
||||||
})
|
})
|
||||||
|
// 能力广场
|
||||||
|
const handleOkAbilitySquare = (e) => {
|
||||||
|
let snumSquare = ref({})
|
||||||
|
snumSquare.value = {
|
||||||
|
abilityToType: abilitySquareFunctionData.value,
|
||||||
|
}
|
||||||
|
const applypage = router.resolve({
|
||||||
|
path: '/capacitySquare', // 跳转的页面路由
|
||||||
|
query: snumSquare.value,
|
||||||
|
})
|
||||||
|
window.open(applypage.href, '_blank')
|
||||||
|
console.log(e, abilitySquareFunctionData.value, 'hahhaha')
|
||||||
|
visibleAbilitySquare.value = false
|
||||||
|
abilitySquareFunctionData.value = '智能算法'
|
||||||
|
}
|
||||||
|
let abilitySquareFunctionData = ref('智能算法')
|
||||||
|
function abilitySquareFunction(item) {
|
||||||
|
abilitySquareFunctionData.value = item
|
||||||
|
}
|
||||||
|
function handlecancelAbilitySquare() {
|
||||||
|
abilitySquareFunctionData.value = '智能算法'
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less">
|
<style lang="less">
|
||||||
.shangjia-class {
|
.shangjia-class {
|
||||||
|
@ -571,4 +630,11 @@
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
background-position: center;
|
background-position: center;
|
||||||
}
|
}
|
||||||
|
.fixedmount div:nth-child(3) p:nth-child(1) {
|
||||||
|
height: 0.24rem;
|
||||||
|
width: 0.24rem;
|
||||||
|
background: url('~@/assets/home/abilitysquare.png') no-repeat;
|
||||||
|
background-size: 140% 126%;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -162,6 +162,7 @@
|
||||||
:action="upLoadUrl"
|
:action="upLoadUrl"
|
||||||
:headers="headers"
|
:headers="headers"
|
||||||
@change="handleChange"
|
@change="handleChange"
|
||||||
|
:maxCount="1"
|
||||||
>
|
>
|
||||||
<a-button
|
<a-button
|
||||||
style="
|
style="
|
||||||
|
@ -181,7 +182,7 @@
|
||||||
文件上传
|
文件上传
|
||||||
</a-button>
|
</a-button>
|
||||||
<span style="font-size: 14px; color: #999">
|
<span style="font-size: 14px; color: #999">
|
||||||
支持doc、docx、jpg、png、jpeg、pdf、xlxs、ppt类型文件
|
支持doc、docx、jpg、png、jpeg、pdf、xlxs、ppt类型文件(仅限一个)
|
||||||
</span>
|
</span>
|
||||||
</a-upload>
|
</a-upload>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
|
@ -346,6 +347,13 @@
|
||||||
const fileList = ref([])
|
const fileList = ref([])
|
||||||
const subimtFlag = ref(true)
|
const subimtFlag = ref(true)
|
||||||
const processStartHandle = () => {
|
const processStartHandle = () => {
|
||||||
|
if (formName.detailsField.length > 0) {
|
||||||
|
let detailsField = ''
|
||||||
|
formName.detailsField.map((item) => {
|
||||||
|
detailsField += item + ';'
|
||||||
|
})
|
||||||
|
formName.detailsField = detailsField
|
||||||
|
}
|
||||||
if (id.value) {
|
if (id.value) {
|
||||||
updateDemandForm(formName).then((upres) => {
|
updateDemandForm(formName).then((upres) => {
|
||||||
if (upres.data.code == 0) {
|
if (upres.data.code == 0) {
|
||||||
|
|
|
@ -0,0 +1,21 @@
|
||||||
|
The MIT License (MIT)
|
||||||
|
|
||||||
|
Copyright (c) 2020 Daniel Eden
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
|
@ -0,0 +1,48 @@
|
||||||
|
# Animate.css
|
||||||
|
|
||||||
|
[![GitHub Version](https://img.shields.io/github/release/daneden/animate.css.svg?style=for-the-badge)](https://github.com/daneden/animate.css) [![Github Star](https://img.shields.io/github/stars/daneden/animate.css.svg?style=for-the-badge)](https://github.com/daneden/animate.css) [![Github Fork](https://img.shields.io/github/forks/daneden/animate.css.svg?style=for-the-badge)](https://github.com/daneden/animate.css) [![License](https://img.shields.io/github/license/daneden/animate.css.svg?style=for-the-badge)](https://github.com/daneden/animate.css)
|
||||||
|
|
||||||
|
> If you need the old docs - v3.x.x and under - you can find it [here](https://github.com/animate-css/animate.css/tree/a8d92e585b1b302f7749809c3308d5e381f9cb17).
|
||||||
|
|
||||||
|
## _Just-add-water CSS animation_
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
|
||||||
|
Install with npm:
|
||||||
|
|
||||||
|
```shell
|
||||||
|
npm install animate.css --save
|
||||||
|
```
|
||||||
|
|
||||||
|
Install with yarn:
|
||||||
|
|
||||||
|
```shell
|
||||||
|
yarn add animate.css
|
||||||
|
```
|
||||||
|
|
||||||
|
## Getting started
|
||||||
|
|
||||||
|
You can find the Animate.css documentation on the [website](https://animate.style/).
|
||||||
|
|
||||||
|
## Accessibility
|
||||||
|
|
||||||
|
Animate.css supports the [`prefers-reduced-motion` media query](https://webkit.org/blog/7551/responsive-design-for-motion/) so that users with motion sensitivity can opt out of animations. On supported platforms (currently all the majors browsers and OS), users can select "reduce motion" on their operating system preferences and it will turn off CSS transitions for them without any further work required.
|
||||||
|
|
||||||
|
## Core team
|
||||||
|
|
||||||
|
| ![](https://avatars2.githubusercontent.com/u/439365?s=460&u=512b4cc5324938ae40bbb8f3b7769d335953cd3a&v=4) | ![](https://avatars2.githubusercontent.com/u/5007208?s=460&u=418401ee605824272e5dcb955fd64ea24546a857&v=4) | ![](https://avatars1.githubusercontent.com/u/15052701?s=460&u=9e58364978379536d3f26c4ce5cae1a2a449a0e4&v=4) |
|
||||||
|
| --- | --- | --- |
|
||||||
|
| [Daniel Eden](https://github.com/daneden) | [Elton Mesquita](https://github.com/eltonmesquita) | [Waren Gonzaga](https://github.com/WarenGonzaga) |
|
||||||
|
| Animate.css creator | Maintainer | Core contributor |
|
||||||
|
|
||||||
|
## License
|
||||||
|
|
||||||
|
Animate.css is licensed under the MIT license. <https://opensource.org/licenses/MIT>
|
||||||
|
|
||||||
|
## Code of Conduct
|
||||||
|
|
||||||
|
This project and everyone participating in it is governed by the [Contributor Covenant Code of Conduct](CODE_OF_CONDUCT.md). By participating, you are expected to uphold this code. Please report unacceptable behavior to [callmeelton@gmail.com](mailto:callmeelton@gmail.com).
|
||||||
|
|
||||||
|
## Contributing
|
||||||
|
|
||||||
|
Pull requests are the way to go here. We only have two rules for submitting a pull request: match the naming convention (camelCase, categorised [fades, bounces, etc]) and let us see a demo of submitted animations in a [pen](https://codepen.io). That **last one is important**.
|
|
@ -0,0 +1,78 @@
|
||||||
|
{
|
||||||
|
"name": "animate.css",
|
||||||
|
"version": "4.1.1",
|
||||||
|
"main": "animate.css",
|
||||||
|
"repository": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://github.com/animate-css/animate.css.git"
|
||||||
|
},
|
||||||
|
"author": {
|
||||||
|
"name": "Animate.css"
|
||||||
|
},
|
||||||
|
"homepage": "https://animate.style/",
|
||||||
|
"license": "MIT",
|
||||||
|
"animateConfig": {
|
||||||
|
"prefix": "animate__"
|
||||||
|
},
|
||||||
|
"scripts": {
|
||||||
|
"start": "npm-run-all raw prod compat",
|
||||||
|
"compat": "npx postcss source/animate.css -o animate.compat.css --no-map --env compat",
|
||||||
|
"dev": "npx postcss source/animate.css -o animate.css --no-map --env development -w",
|
||||||
|
"raw": "npx postcss source/animate.css -o animate.css --no-map --env development",
|
||||||
|
"prod": "npx postcss source/animate.css -o animate.min.css --no-map --env production",
|
||||||
|
"format": "prettier --write \"**/*.{js,json,md,css}\"",
|
||||||
|
"precommit": "lint-staged",
|
||||||
|
"docs:library": "npx postcss source/animate.css -o ./docs/animate.min.css --no-map --env production",
|
||||||
|
"docs:pages": "node ./docsSource/index.js",
|
||||||
|
"docs": "npm-run-all docs:library docs:pages",
|
||||||
|
"version": "npm-run-all start docs && git add -A docs animate.css animate.min.css animate.compat.css",
|
||||||
|
"postversion": "git push && git push --tags"
|
||||||
|
},
|
||||||
|
"browserslist": [
|
||||||
|
"> 3%",
|
||||||
|
"last 2 versions"
|
||||||
|
],
|
||||||
|
"style": "./animate.css",
|
||||||
|
"jspm": {
|
||||||
|
"main": "animate.css!",
|
||||||
|
"format": "global",
|
||||||
|
"directories": {
|
||||||
|
"lib": "./"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"autoprefixer": "^9.7.6",
|
||||||
|
"cssnano": "^4.1.10",
|
||||||
|
"eslint": "^7.8.1",
|
||||||
|
"husky": "^4.2.5",
|
||||||
|
"lint-staged": "^10.3.0",
|
||||||
|
"markdown-it": "^11.0.0",
|
||||||
|
"npm-run-all": "^4.1.5",
|
||||||
|
"postcss": "^7.0.27",
|
||||||
|
"postcss-cli": "^7.1.2",
|
||||||
|
"postcss-header": "^2.0.0",
|
||||||
|
"postcss-import": "^12.0.1",
|
||||||
|
"postcss-prefixer": "^2.1.2",
|
||||||
|
"postcss-preset-env": "^6.7.0",
|
||||||
|
"prettier": "^2.1.1"
|
||||||
|
},
|
||||||
|
"lint-staged": {
|
||||||
|
"*.{js,json,md,css}": [
|
||||||
|
"prettier --write"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"husky": {
|
||||||
|
"hooks": {
|
||||||
|
"pre-commit": "npm-run-all start precommit"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"files": [
|
||||||
|
"animate.compat.css",
|
||||||
|
"animate.min.css",
|
||||||
|
"animate.css",
|
||||||
|
"source/**/*.css"
|
||||||
|
],
|
||||||
|
"__npminstall_done": true,
|
||||||
|
"_from": "animate.css@4.1.1",
|
||||||
|
"_resolved": "https://registry.npmmirror.com/animate.css/-/animate.css-4.1.1.tgz"
|
||||||
|
}
|
|
@ -0,0 +1,68 @@
|
||||||
|
.animated {
|
||||||
|
animation-duration: var(--animate-duration);
|
||||||
|
animation-fill-mode: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.infinite {
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.repeat-1 {
|
||||||
|
animation-iteration-count: var(--animate-repeat);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.repeat-2 {
|
||||||
|
animation-iteration-count: calc(var(--animate-repeat) * 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.repeat-3 {
|
||||||
|
animation-iteration-count: calc(var(--animate-repeat) * 3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.delay-1s {
|
||||||
|
animation-delay: var(--animate-delay);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.delay-2s {
|
||||||
|
animation-delay: calc(var(--animate-delay) * 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.delay-3s {
|
||||||
|
animation-delay: calc(var(--animate-delay) * 3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.delay-4s {
|
||||||
|
animation-delay: calc(var(--animate-delay) * 4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.delay-5s {
|
||||||
|
animation-delay: calc(var(--animate-delay) * 5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.faster {
|
||||||
|
animation-duration: calc(var(--animate-duration) / 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.fast {
|
||||||
|
animation-duration: calc(var(--animate-duration) * 0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.slow {
|
||||||
|
animation-duration: calc(var(--animate-duration) * 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated.slower {
|
||||||
|
animation-duration: calc(var(--animate-duration) * 3);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media print, (prefers-reduced-motion: reduce) {
|
||||||
|
.animated {
|
||||||
|
animation-duration: 1ms !important;
|
||||||
|
transition-duration: 1ms !important;
|
||||||
|
animation-iteration-count: 1 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated[class*='Out'] {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,5 @@
|
||||||
|
:root {
|
||||||
|
--animate-duration: 1s;
|
||||||
|
--animate-delay: 1s;
|
||||||
|
--animate-repeat: 1;
|
||||||
|
}
|
|
@ -0,0 +1,131 @@
|
||||||
|
@import '_vars.css';
|
||||||
|
@import '_base.css';
|
||||||
|
|
||||||
|
/* Attention seekers */
|
||||||
|
@import 'attention_seekers/bounce.css';
|
||||||
|
@import 'attention_seekers/flash.css';
|
||||||
|
@import 'attention_seekers/pulse.css';
|
||||||
|
@import 'attention_seekers/rubberBand.css';
|
||||||
|
@import 'attention_seekers/shakeX.css';
|
||||||
|
@import 'attention_seekers/shakeY.css';
|
||||||
|
@import 'attention_seekers/headShake.css';
|
||||||
|
@import 'attention_seekers/swing.css';
|
||||||
|
@import 'attention_seekers/tada.css';
|
||||||
|
@import 'attention_seekers/wobble.css';
|
||||||
|
@import 'attention_seekers/jello.css';
|
||||||
|
@import 'attention_seekers/heartBeat.css';
|
||||||
|
|
||||||
|
/* Back entrances */
|
||||||
|
@import 'back_entrances/backInDown.css';
|
||||||
|
@import 'back_entrances/backInLeft.css';
|
||||||
|
@import 'back_entrances/backInRight.css';
|
||||||
|
@import 'back_entrances/backInUp.css';
|
||||||
|
|
||||||
|
/* Back exits */
|
||||||
|
@import 'back_exits/backOutDown.css';
|
||||||
|
@import 'back_exits/backOutLeft.css';
|
||||||
|
@import 'back_exits/backOutRight.css';
|
||||||
|
@import 'back_exits/backOutUp.css';
|
||||||
|
|
||||||
|
/* Bouncing entrances */
|
||||||
|
@import 'bouncing_entrances/bounceIn.css';
|
||||||
|
@import 'bouncing_entrances/bounceInDown.css';
|
||||||
|
@import 'bouncing_entrances/bounceInLeft.css';
|
||||||
|
@import 'bouncing_entrances/bounceInRight.css';
|
||||||
|
@import 'bouncing_entrances/bounceInUp.css';
|
||||||
|
|
||||||
|
/* Bouncing exits */
|
||||||
|
@import 'bouncing_exits/bounceOut.css';
|
||||||
|
@import 'bouncing_exits/bounceOutDown.css';
|
||||||
|
@import 'bouncing_exits/bounceOutLeft.css';
|
||||||
|
@import 'bouncing_exits/bounceOutRight.css';
|
||||||
|
@import 'bouncing_exits/bounceOutUp.css';
|
||||||
|
|
||||||
|
/* Fading entrances */
|
||||||
|
@import 'fading_entrances/fadeIn.css';
|
||||||
|
@import 'fading_entrances/fadeInDown.css';
|
||||||
|
@import 'fading_entrances/fadeInDownBig.css';
|
||||||
|
@import 'fading_entrances/fadeInLeft.css';
|
||||||
|
@import 'fading_entrances/fadeInLeftBig.css';
|
||||||
|
@import 'fading_entrances/fadeInRight.css';
|
||||||
|
@import 'fading_entrances/fadeInRightBig.css';
|
||||||
|
@import 'fading_entrances/fadeInUp.css';
|
||||||
|
@import 'fading_entrances/fadeInUpBig.css';
|
||||||
|
@import 'fading_entrances/fadeInTopLeft.css';
|
||||||
|
@import 'fading_entrances/fadeInTopRight.css';
|
||||||
|
@import 'fading_entrances/fadeInBottomLeft.css';
|
||||||
|
@import 'fading_entrances/fadeInBottomRight.css';
|
||||||
|
|
||||||
|
/* Fading exits */
|
||||||
|
@import 'fading_exits/fadeOut.css';
|
||||||
|
@import 'fading_exits/fadeOutDown.css';
|
||||||
|
@import 'fading_exits/fadeOutDownBig.css';
|
||||||
|
@import 'fading_exits/fadeOutLeft.css';
|
||||||
|
@import 'fading_exits/fadeOutLeftBig.css';
|
||||||
|
@import 'fading_exits/fadeOutRight.css';
|
||||||
|
@import 'fading_exits/fadeOutRightBig.css';
|
||||||
|
@import 'fading_exits/fadeOutUp.css';
|
||||||
|
@import 'fading_exits/fadeOutUpBig.css';
|
||||||
|
@import 'fading_exits/fadeOutTopLeft.css';
|
||||||
|
@import 'fading_exits/fadeOutTopRight.css';
|
||||||
|
@import 'fading_exits/fadeOutBottomRight.css';
|
||||||
|
@import 'fading_exits/fadeOutBottomLeft.css';
|
||||||
|
|
||||||
|
/* Flippers */
|
||||||
|
@import 'flippers/flip.css';
|
||||||
|
@import 'flippers/flipInX.css';
|
||||||
|
@import 'flippers/flipInY.css';
|
||||||
|
@import 'flippers/flipOutX.css';
|
||||||
|
@import 'flippers/flipOutY.css';
|
||||||
|
|
||||||
|
/* Lightspeed */
|
||||||
|
@import 'lightspeed/lightSpeedInRight.css';
|
||||||
|
@import 'lightspeed/lightSpeedInLeft.css';
|
||||||
|
@import 'lightspeed/lightSpeedOutRight.css';
|
||||||
|
@import 'lightspeed/lightSpeedOutLeft.css';
|
||||||
|
|
||||||
|
/* Rotating entrances */
|
||||||
|
@import 'rotating_entrances/rotateIn.css';
|
||||||
|
@import 'rotating_entrances/rotateInDownLeft.css';
|
||||||
|
@import 'rotating_entrances/rotateInDownRight.css';
|
||||||
|
@import 'rotating_entrances/rotateInUpLeft.css';
|
||||||
|
@import 'rotating_entrances/rotateInUpRight.css';
|
||||||
|
|
||||||
|
/* Rotating exits */
|
||||||
|
@import 'rotating_exits/rotateOut.css';
|
||||||
|
@import 'rotating_exits/rotateOutDownLeft.css';
|
||||||
|
@import 'rotating_exits/rotateOutDownRight.css';
|
||||||
|
@import 'rotating_exits/rotateOutUpLeft.css';
|
||||||
|
@import 'rotating_exits/rotateOutUpRight.css';
|
||||||
|
|
||||||
|
/* Specials */
|
||||||
|
@import 'specials/hinge.css';
|
||||||
|
@import 'specials/jackInTheBox.css';
|
||||||
|
@import 'specials/rollIn.css';
|
||||||
|
@import 'specials/rollOut.css';
|
||||||
|
|
||||||
|
/* Zooming entrances */
|
||||||
|
@import 'zooming_entrances/zoomIn.css';
|
||||||
|
@import 'zooming_entrances/zoomInDown.css';
|
||||||
|
@import 'zooming_entrances/zoomInLeft.css';
|
||||||
|
@import 'zooming_entrances/zoomInRight.css';
|
||||||
|
@import 'zooming_entrances/zoomInUp.css';
|
||||||
|
|
||||||
|
/* Zooming exits */
|
||||||
|
@import 'zooming_exits/zoomOut.css';
|
||||||
|
@import 'zooming_exits/zoomOutDown.css';
|
||||||
|
@import 'zooming_exits/zoomOutLeft.css';
|
||||||
|
@import 'zooming_exits/zoomOutRight.css';
|
||||||
|
@import 'zooming_exits/zoomOutUp.css';
|
||||||
|
|
||||||
|
/* Sliding entrances */
|
||||||
|
@import 'sliding_entrances/slideInDown.css';
|
||||||
|
@import 'sliding_entrances/slideInLeft.css';
|
||||||
|
@import 'sliding_entrances/slideInRight.css';
|
||||||
|
@import 'sliding_entrances/slideInUp.css';
|
||||||
|
|
||||||
|
/* Sliding exits */
|
||||||
|
@import 'sliding_exits/slideOutDown.css';
|
||||||
|
@import 'sliding_exits/slideOutLeft.css';
|
||||||
|
@import 'sliding_exits/slideOutRight.css';
|
||||||
|
@import 'sliding_exits/slideOutUp.css';
|
34
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/bounce.css
generated
vendored
Normal file
|
@ -0,0 +1,34 @@
|
||||||
|
@keyframes bounce {
|
||||||
|
from,
|
||||||
|
20%,
|
||||||
|
53%,
|
||||||
|
to {
|
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
40%,
|
||||||
|
43% {
|
||||||
|
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
|
||||||
|
transform: translate3d(0, -30px, 0) scaleY(1.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
70% {
|
||||||
|
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
|
||||||
|
transform: translate3d(0, -15px, 0) scaleY(1.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||||
|
transform: translate3d(0, 0, 0) scaleY(0.95);
|
||||||
|
}
|
||||||
|
|
||||||
|
90% {
|
||||||
|
transform: translate3d(0, -4px, 0) scaleY(1.02);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bounce {
|
||||||
|
animation-name: bounce;
|
||||||
|
transform-origin: center bottom;
|
||||||
|
}
|
16
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/flash.css
generated
vendored
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
@keyframes flash {
|
||||||
|
from,
|
||||||
|
50%,
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
25%,
|
||||||
|
75% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.flash {
|
||||||
|
animation-name: flash;
|
||||||
|
}
|
30
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/headShake.css
generated
vendored
Normal file
|
@ -0,0 +1,30 @@
|
||||||
|
@keyframes headShake {
|
||||||
|
0% {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
6.5% {
|
||||||
|
transform: translateX(-6px) rotateY(-9deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
18.5% {
|
||||||
|
transform: translateX(5px) rotateY(7deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
31.5% {
|
||||||
|
transform: translateX(-3px) rotateY(-5deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
43.5% {
|
||||||
|
transform: translateX(2px) rotateY(3deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.headShake {
|
||||||
|
animation-timing-function: ease-in-out;
|
||||||
|
animation-name: headShake;
|
||||||
|
}
|
27
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/heartBeat.css
generated
vendored
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
@keyframes heartBeat {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
14% {
|
||||||
|
transform: scale(1.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
28% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
42% {
|
||||||
|
transform: scale(1.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
70% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.heartBeat {
|
||||||
|
animation-name: heartBeat;
|
||||||
|
animation-duration: calc(var(--animate-duration) * 1.3);
|
||||||
|
animation-timing-function: ease-in-out;
|
||||||
|
}
|
40
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/jello.css
generated
vendored
Normal file
|
@ -0,0 +1,40 @@
|
||||||
|
@keyframes jello {
|
||||||
|
from,
|
||||||
|
11.1%,
|
||||||
|
to {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
22.2% {
|
||||||
|
transform: skewX(-12.5deg) skewY(-12.5deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
33.3% {
|
||||||
|
transform: skewX(6.25deg) skewY(6.25deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
44.4% {
|
||||||
|
transform: skewX(-3.125deg) skewY(-3.125deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
55.5% {
|
||||||
|
transform: skewX(1.5625deg) skewY(1.5625deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
66.6% {
|
||||||
|
transform: skewX(-0.78125deg) skewY(-0.78125deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
77.7% {
|
||||||
|
transform: skewX(0.390625deg) skewY(0.390625deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
88.8% {
|
||||||
|
transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.jello {
|
||||||
|
animation-name: jello;
|
||||||
|
transform-origin: center;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/pulse.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
from {
|
||||||
|
transform: scale3d(1, 1, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: scale3d(1.05, 1.05, 1.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: scale3d(1, 1, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse {
|
||||||
|
animation-name: pulse;
|
||||||
|
animation-timing-function: ease-in-out;
|
||||||
|
}
|
33
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/rubberBand.css
generated
vendored
Normal file
|
@ -0,0 +1,33 @@
|
||||||
|
@keyframes rubberBand {
|
||||||
|
from {
|
||||||
|
transform: scale3d(1, 1, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
30% {
|
||||||
|
transform: scale3d(1.25, 0.75, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
40% {
|
||||||
|
transform: scale3d(0.75, 1.25, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: scale3d(1.15, 0.85, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
65% {
|
||||||
|
transform: scale3d(0.95, 1.05, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
75% {
|
||||||
|
transform: scale3d(1.05, 0.95, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: scale3d(1, 1, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.rubberBand {
|
||||||
|
animation-name: rubberBand;
|
||||||
|
}
|
25
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/shake.css
generated
vendored
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
@keyframes shake {
|
||||||
|
from,
|
||||||
|
to {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
10%,
|
||||||
|
30%,
|
||||||
|
50%,
|
||||||
|
70%,
|
||||||
|
90% {
|
||||||
|
transform: translate3d(-10px, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
20%,
|
||||||
|
40%,
|
||||||
|
60%,
|
||||||
|
80% {
|
||||||
|
transform: translate3d(10px, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shake {
|
||||||
|
animation-name: shake;
|
||||||
|
}
|
25
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/shakeX.css
generated
vendored
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
@keyframes shakeX {
|
||||||
|
from,
|
||||||
|
to {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
10%,
|
||||||
|
30%,
|
||||||
|
50%,
|
||||||
|
70%,
|
||||||
|
90% {
|
||||||
|
transform: translate3d(-10px, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
20%,
|
||||||
|
40%,
|
||||||
|
60%,
|
||||||
|
80% {
|
||||||
|
transform: translate3d(10px, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shakeX {
|
||||||
|
animation-name: shakeX;
|
||||||
|
}
|
25
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/shakeY.css
generated
vendored
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
@keyframes shakeY {
|
||||||
|
from,
|
||||||
|
to {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
10%,
|
||||||
|
30%,
|
||||||
|
50%,
|
||||||
|
70%,
|
||||||
|
90% {
|
||||||
|
transform: translate3d(0, -10px, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
20%,
|
||||||
|
40%,
|
||||||
|
60%,
|
||||||
|
80% {
|
||||||
|
transform: translate3d(0, 10px, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shakeY {
|
||||||
|
animation-name: shakeY;
|
||||||
|
}
|
26
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/swing.css
generated
vendored
Normal file
|
@ -0,0 +1,26 @@
|
||||||
|
@keyframes swing {
|
||||||
|
20% {
|
||||||
|
transform: rotate3d(0, 0, 1, 15deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
40% {
|
||||||
|
transform: rotate3d(0, 0, 1, -10deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
60% {
|
||||||
|
transform: rotate3d(0, 0, 1, 5deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
transform: rotate3d(0, 0, 1, -5deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: rotate3d(0, 0, 1, 0deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.swing {
|
||||||
|
transform-origin: top center;
|
||||||
|
animation-name: swing;
|
||||||
|
}
|
31
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/tada.css
generated
vendored
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
@keyframes tada {
|
||||||
|
from {
|
||||||
|
transform: scale3d(1, 1, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
10%,
|
||||||
|
20% {
|
||||||
|
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
30%,
|
||||||
|
50%,
|
||||||
|
70%,
|
||||||
|
90% {
|
||||||
|
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
40%,
|
||||||
|
60%,
|
||||||
|
80% {
|
||||||
|
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: scale3d(1, 1, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tada {
|
||||||
|
animation-name: tada;
|
||||||
|
}
|
35
node_modules/_animate.css@4.1.1@animate.css/source/attention_seekers/wobble.css
generated
vendored
Normal file
|
@ -0,0 +1,35 @@
|
||||||
|
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
|
||||||
|
|
||||||
|
@keyframes wobble {
|
||||||
|
from {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
15% {
|
||||||
|
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
30% {
|
||||||
|
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
45% {
|
||||||
|
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
60% {
|
||||||
|
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
75% {
|
||||||
|
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.wobble {
|
||||||
|
animation-name: wobble;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/back_entrances/backInDown.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@keyframes backInDown {
|
||||||
|
0% {
|
||||||
|
transform: translateY(-1200px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
transform: translateY(0px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.backInDown {
|
||||||
|
animation-name: backInDown;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/back_entrances/backInLeft.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@keyframes backInLeft {
|
||||||
|
0% {
|
||||||
|
transform: translateX(-2000px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
transform: translateX(0px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.backInLeft {
|
||||||
|
animation-name: backInLeft;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/back_entrances/backInRight.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@keyframes backInRight {
|
||||||
|
0% {
|
||||||
|
transform: translateX(2000px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
transform: translateX(0px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.backInRight {
|
||||||
|
animation-name: backInRight;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/back_entrances/backInUp.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@keyframes backInUp {
|
||||||
|
0% {
|
||||||
|
transform: translateY(1200px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
transform: translateY(0px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.backInUp {
|
||||||
|
animation-name: backInUp;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/back_exits/backOutDown.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@keyframes backOutDown {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
transform: translateY(0px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateY(700px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.backOutDown {
|
||||||
|
animation-name: backOutDown;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/back_exits/backOutLeft.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@keyframes backOutLeft {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
transform: translateX(0px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateX(-2000px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.backOutLeft {
|
||||||
|
animation-name: backOutLeft;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/back_exits/backOutRight.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@keyframes backOutRight {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
transform: translateX(0px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateX(2000px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.backOutRight {
|
||||||
|
animation-name: backOutRight;
|
||||||
|
}
|
20
node_modules/_animate.css@4.1.1@animate.css/source/back_exits/backOutUp.css
generated
vendored
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@keyframes backOutUp {
|
||||||
|
0% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
transform: translateY(0px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateY(-700px) scale(0.7);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.backOutUp {
|
||||||
|
animation-name: backOutUp;
|
||||||
|
}
|
42
node_modules/_animate.css@4.1.1@animate.css/source/bouncing_entrances/bounceIn.css
generated
vendored
Normal file
|
@ -0,0 +1,42 @@
|
||||||
|
@keyframes bounceIn {
|
||||||
|
from,
|
||||||
|
20%,
|
||||||
|
40%,
|
||||||
|
60%,
|
||||||
|
80%,
|
||||||
|
to {
|
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scale3d(0.3, 0.3, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
transform: scale3d(1.1, 1.1, 1.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
40% {
|
||||||
|
transform: scale3d(0.9, 0.9, 0.9);
|
||||||
|
}
|
||||||
|
|
||||||
|
60% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale3d(1.03, 1.03, 1.03);
|
||||||
|
}
|
||||||
|
|
||||||
|
80% {
|
||||||
|
transform: scale3d(0.97, 0.97, 0.97);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale3d(1, 1, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bounceIn {
|
||||||
|
animation-duration: calc(var(--animate-duration) * 0.75);
|
||||||
|
animation-name: bounceIn;
|
||||||
|
}
|
35
node_modules/_animate.css@4.1.1@animate.css/source/bouncing_entrances/bounceInDown.css
generated
vendored
Normal file
|
@ -0,0 +1,35 @@
|
||||||
|
@keyframes bounceInDown {
|
||||||
|
from,
|
||||||
|
60%,
|
||||||
|
75%,
|
||||||
|
90%,
|
||||||
|
to {
|
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate3d(0, -3000px, 0) scaleY(3);
|
||||||
|
}
|
||||||
|
|
||||||
|
60% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translate3d(0, 25px, 0) scaleY(0.9);
|
||||||
|
}
|
||||||
|
|
||||||
|
75% {
|
||||||
|
transform: translate3d(0, -10px, 0) scaleY(0.95);
|
||||||
|
}
|
||||||
|
|
||||||
|
90% {
|
||||||
|
transform: translate3d(0, 5px, 0) scaleY(0.985);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bounceInDown {
|
||||||
|
animation-name: bounceInDown;
|
||||||
|
}
|
35
node_modules/_animate.css@4.1.1@animate.css/source/bouncing_entrances/bounceInLeft.css
generated
vendored
Normal file
|
@ -0,0 +1,35 @@
|
||||||
|
@keyframes bounceInLeft {
|
||||||
|
from,
|
||||||
|
60%,
|
||||||
|
75%,
|
||||||
|
90%,
|
||||||
|
to {
|
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate3d(-3000px, 0, 0) scaleX(3);
|
||||||
|
}
|
||||||
|
|
||||||
|
60% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translate3d(25px, 0, 0) scaleX(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
75% {
|
||||||
|
transform: translate3d(-10px, 0, 0) scaleX(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
90% {
|
||||||
|
transform: translate3d(5px, 0, 0) scaleX(0.995);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bounceInLeft {
|
||||||
|
animation-name: bounceInLeft;
|
||||||
|
}
|
35
node_modules/_animate.css@4.1.1@animate.css/source/bouncing_entrances/bounceInRight.css
generated
vendored
Normal file
|
@ -0,0 +1,35 @@
|
||||||
|
@keyframes bounceInRight {
|
||||||
|
from,
|
||||||
|
60%,
|
||||||
|
75%,
|
||||||
|
90%,
|
||||||
|
to {
|
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate3d(3000px, 0, 0) scaleX(3);
|
||||||
|
}
|
||||||
|
|
||||||
|
60% {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translate3d(-25px, 0, 0) scaleX(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
75% {
|
||||||
|
transform: translate3d(10px, 0, 0) scaleX(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
90% {
|
||||||
|
transform: translate3d(-5px, 0, 0) scaleX(0.995);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bounceInRight {
|
||||||
|
animation-name: bounceInRight;
|
||||||
|
}
|