合并版本v0.8.6.1
|
@ -53,10 +53,8 @@
|
|||
<div class="title">
|
||||
组合能力
|
||||
</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="基础设施"
|
||||
ref="jcssDom"></InfrastructureModal>
|
||||
:modalType="modalType" ref="jcssDom"></InfrastructureModal>
|
||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="数据资源" ref="sjzyDom"
|
||||
:getDataParams="getListParams['数据资源']"></combine-ability>
|
||||
<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 == '服务图片') || {};
|
||||
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);
|
||||
})
|
||||
},
|
||||
|
@ -287,14 +296,10 @@ export default {
|
|||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
file.type === 'image/png'
|
||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
||||
|
||||
if (!isImage) {
|
||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||
}
|
||||
// if (!isLt2M) {
|
||||
// this.$message.error('上传头像图片大小不能超过 2MB!')
|
||||
// }
|
||||
return isImage
|
||||
},
|
||||
addUploadRemoveFile(file, fileList) {
|
||||
|
@ -306,14 +311,9 @@ export default {
|
|||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
file.type === 'image/png'
|
||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
||||
|
||||
if (!isImage) {
|
||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||
}
|
||||
// if (!isLt2M) {
|
||||
// this.$message.error('上传头像图片大小不能超过 2MB!')
|
||||
// }
|
||||
return isImage
|
||||
},
|
||||
editUploadRemoveFile(file, fileList) {
|
||||
|
|
|
@ -55,8 +55,8 @@ import qs from "qs";
|
|||
import { type } from "os";
|
||||
|
||||
export const tableColumns = {
|
||||
'name': '融合服务名称',
|
||||
'description': '融合服务描述',
|
||||
'name': '名称',
|
||||
'description': '描述',
|
||||
'applicationArea': '应用领域',
|
||||
}
|
||||
|
||||
|
@ -140,7 +140,7 @@ export default {
|
|||
},
|
||||
// 详情
|
||||
showDetail(val) {
|
||||
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + val.id)
|
||||
window.open(window.SITE_CONFIG.previewUrl + '#/packagingDetails?id=' + val.id)
|
||||
},
|
||||
// showDocument(val) {
|
||||
// console.log(val);
|
||||
|
|
|
@ -62,7 +62,7 @@
|
|||
组合能力
|
||||
</div>
|
||||
<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"
|
||||
:getDataParams="getListParams['数据资源']"></combine-ability>
|
||||
<combine-ability v-model="dataForm" :dataForm="dataForm" @update="updateDataForm" type="组件服务" ref="zjfwDom"
|
||||
|
@ -269,6 +269,7 @@ export default {
|
|||
handler(newVal) {
|
||||
this.addOrUpdateVisibleCopy = newVal;
|
||||
if (this.modalType == 'add' && newVal) {
|
||||
localStorage.setItem('InfrastructureSearchData', JSON.stringify({}))
|
||||
this.getDetail(this.dataForm)
|
||||
}
|
||||
},
|
||||
|
@ -333,6 +334,7 @@ export default {
|
|||
let _obj = Object.assign({}, this.dataForm, {
|
||||
type: '赋能场景'
|
||||
})
|
||||
console.log('this.dataForm------表单提交------>', this.dataForm);
|
||||
this.$http
|
||||
[methodsObj[this.modalType]]("/fuse", _obj)
|
||||
.then(({ data: res }) => {
|
||||
|
@ -360,14 +362,24 @@ export default {
|
|||
),
|
||||
// 详情
|
||||
getDetail(data) {
|
||||
console.log('data---详情--------->', data);
|
||||
this.dataForm = data;
|
||||
this.$nextTick(() => {
|
||||
for (const key in this.refsParseArray) {
|
||||
this.$refs[key] && this.$refs[key].getDataInfo && this.$refs[key].getDataInfo(data)
|
||||
}
|
||||
let _imgObj = data.fuseAttrList.find(v => v.attrType == '服务图片') || {};
|
||||
this.imageUrl = _imgObj.attrValue
|
||||
console.log('this.dataForm----详情-------->', this.dataForm);
|
||||
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
|
||||
})
|
||||
})
|
||||
},
|
||||
handleAvatarSuccess(res, file) {
|
||||
|
@ -381,14 +393,9 @@ export default {
|
|||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
file.type === 'image/png'
|
||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
||||
|
||||
if (!isImage) {
|
||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||
}
|
||||
// if (!isLt2M) {
|
||||
// this.$message.error('上传头像图片大小不能超过 2MB!')
|
||||
// }
|
||||
return isImage
|
||||
},
|
||||
addUploadRemoveFile(file, fileList) {
|
||||
|
@ -400,14 +407,10 @@ export default {
|
|||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
file.type === 'image/png'
|
||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
||||
|
||||
if (!isImage) {
|
||||
this.$message.error('上传头像图片只能是 jpg/png 格式!')
|
||||
}
|
||||
// if (!isLt2M) {
|
||||
// this.$message.error('上传头像图片大小不能超过 2MB!')
|
||||
// }
|
||||
return isImage
|
||||
},
|
||||
editUploadRemoveFile(file, fileList) {
|
||||
|
@ -419,7 +422,6 @@ export default {
|
|||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.imageUrl = res.data
|
||||
// this.imageUrl = URL.createObjectURL(file.raw);
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
|
|
|
@ -2,7 +2,8 @@
|
|||
<div>
|
||||
<div class="top flex-row-start">
|
||||
<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>
|
||||
<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>
|
||||
|
@ -34,8 +35,8 @@
|
|||
</div>
|
||||
<div class="flex-row-start" style="margin-bottom:10px;align-items: flex-start;">
|
||||
<div class="left-text" style="margin-top: 10px;">关键词</div>
|
||||
<el-input style="margin-left:10px;width: 200px;" v-model="cameraName" placeholder="名称"
|
||||
clearable>
|
||||
<el-input style="margin-left:10px;width: 200px;" v-model="searchData.cameraName"
|
||||
placeholder="名称" clearable>
|
||||
</el-input>
|
||||
<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>
|
||||
</el-table>
|
||||
<el-pagination style="justify-content: center;display: flex;" :current-page="pageData.page"
|
||||
:page-sizes="[10, 20, 50, 100]" :page-size="pageData.limit" :total="pageData.total"
|
||||
<el-pagination style="justify-content: center;display: flex;" :current-page="searchData.pageNum"
|
||||
:page-sizes="[10, 20, 50, 100]" :page-size="searchData.pageSize" :total="pageData.total"
|
||||
layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
|
||||
@current-change="pageCurrentChangeHandle">
|
||||
</el-pagination>
|
||||
|
@ -75,7 +76,7 @@
|
|||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<DisplayList :displayList="displayList"></DisplayList>
|
||||
<DisplayList :displayList="displayList" showKey="channelName"></DisplayList>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -98,6 +99,10 @@ export default {
|
|||
type: String,
|
||||
default: "基础设施"
|
||||
},
|
||||
modalType: {
|
||||
type: String,
|
||||
default: 'add'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const getYunList = () => {
|
||||
|
@ -109,9 +114,7 @@ export default {
|
|||
return {
|
||||
showKey: 0,
|
||||
showModal: false,
|
||||
transferData: [], // 穿梭框所有数据
|
||||
selectedArray: [], // 已选择的数据id
|
||||
allData: [],
|
||||
displayList: [], // 用于展示的list
|
||||
btnList: ['视频资源', '云资源', '感知资源'],
|
||||
showText: {
|
||||
|
@ -133,35 +136,41 @@ export default {
|
|||
list: []
|
||||
},
|
||||
],
|
||||
activeBtn: '视频资源',
|
||||
checkList: [],
|
||||
currentList: [],
|
||||
dataListLoading: false,
|
||||
dataList: [],
|
||||
pageData: {
|
||||
limit: 10,
|
||||
page: 1,
|
||||
total: 0,
|
||||
},
|
||||
cameraName: '',
|
||||
postData: {},
|
||||
activeBtn: '视频资源',
|
||||
checkList: [],
|
||||
searchData: {
|
||||
cameraName: '',
|
||||
pageSize: 10,
|
||||
pageNum: 1,
|
||||
parentId: ''
|
||||
},
|
||||
dataFormCopy: {}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
async showModal(newVal) {
|
||||
if (newVal) {
|
||||
await this.getData();
|
||||
// 默认选中复选框
|
||||
this.$nextTick(() => {
|
||||
this.selectCheckbox()
|
||||
})
|
||||
if (this.modalType == 'add') {
|
||||
this.clear()
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 获取视频资源
|
||||
this.getVideoBtn()
|
||||
// 获取列表
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
selectCheckbox() {
|
||||
|
@ -176,24 +185,24 @@ export default {
|
|||
})
|
||||
if (list.length) {
|
||||
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) {
|
||||
this.modalType == 'edit'
|
||||
this.dataFormCopy = dataForm;
|
||||
await this.getVideoBtn();
|
||||
await this.getData();
|
||||
let arr = [];
|
||||
let attrValue = dataForm.fuseResourceList.filter(v => v.type == this.type);
|
||||
if (attrValue.length > 0) {
|
||||
attrValue.map(val => {
|
||||
let item = this.dataList.find(v => v.idtCameraChannel == val.resourceId) || {};
|
||||
let _obj = {
|
||||
type: val.type,
|
||||
idtCameraChannel: val.resourceId,
|
||||
name: item.channelName
|
||||
};
|
||||
let _obj = Object.assign({}, val, val.resource)
|
||||
arr.push(_obj);
|
||||
});
|
||||
}
|
||||
|
@ -201,28 +210,31 @@ export default {
|
|||
this.displayList = JSON.parse(JSON.stringify(arr));
|
||||
// 已选中
|
||||
this.selectedArray = arr.map(v => v.idtCameraChannel);
|
||||
},
|
||||
handleShowModal() {
|
||||
this.showModal = true;
|
||||
this.dataList = JSON.parse(JSON.stringify(arr));
|
||||
this.pageData.total = arr.length;
|
||||
// 默认选中复选框
|
||||
this.$nextTick(() => {
|
||||
this.selectCheckbox()
|
||||
})
|
||||
},
|
||||
// 点击复选框
|
||||
dataListSelectionChangeHandle(data) {
|
||||
this.selectedArray = data;
|
||||
},
|
||||
pageCurrentChangeHandle(page) {
|
||||
this.pageData.page = page;
|
||||
pageCurrentChangeHandle(pageNum) {
|
||||
this.searchData.pageNum = pageNum;
|
||||
this.getData()
|
||||
},
|
||||
pageSizeChangeHandle(limit) {
|
||||
this.pageData.limit = limit;
|
||||
pageSizeChangeHandle(pageSize) {
|
||||
this.searchData.pageSize = pageSize;
|
||||
this.getData()
|
||||
},
|
||||
changeBtn(btn) {
|
||||
this.activeBtn = btn;
|
||||
this.currentList = this.tabData.find(v => v.tabName == btn).list || [];
|
||||
this.checkList = [];
|
||||
this.cameraName = '';
|
||||
this.searchData.cameraName = '';
|
||||
this.getData()
|
||||
this.currentList = this.tabData.find(v => v.tabName == btn).list || []
|
||||
},
|
||||
// 获取视频标签列表
|
||||
getVideoBtn() {
|
||||
|
@ -234,7 +246,12 @@ export default {
|
|||
}
|
||||
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 => {
|
||||
reject(err)
|
||||
this.$message.error(err);
|
||||
|
@ -255,23 +272,19 @@ export default {
|
|||
} else {
|
||||
this.checkList.push(item.labelCode)
|
||||
}
|
||||
console.log('this.checkList------------>', this.checkList);
|
||||
this.getData()
|
||||
this.$nextTick(() => {
|
||||
this.getData()
|
||||
})
|
||||
},
|
||||
// 获取列表
|
||||
getData(parentId = '') {
|
||||
this.allData = [];
|
||||
let postData = {
|
||||
parentId: parentId,
|
||||
cameraName: this.cameraName,
|
||||
getData() {
|
||||
let postData = Object.assign({}, {
|
||||
checkStatus: 1,
|
||||
pageNum: this.pageData.page,
|
||||
pageSize: this.pageData.limit,
|
||||
gpsX: '',
|
||||
gpsY: '',
|
||||
radius: '',
|
||||
labelCodes: this.checkList.join(),
|
||||
}
|
||||
}, this.searchData);
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$http.get('/api/project/selectByParentIdNew', { params: postData }).then(res => {
|
||||
resolve(res)
|
||||
|
@ -285,10 +298,9 @@ export default {
|
|||
this.$message.error(err);
|
||||
})
|
||||
})
|
||||
|
||||
},
|
||||
changeParentId(parentId) {
|
||||
console.log('parentId------------>', parentId);
|
||||
this.searchData.parentId = parentId;
|
||||
this.getData(parentId)
|
||||
},
|
||||
confirmSubmitHandle() {
|
||||
|
@ -301,7 +313,7 @@ export default {
|
|||
this.dataList.map(v => {
|
||||
if (idtCameraChannelArray.includes(v.idtCameraChannel)) {
|
||||
this.displayList.push({
|
||||
name: v.channelName
|
||||
channelName: v.channelName
|
||||
})
|
||||
}
|
||||
})
|
||||
|
@ -312,16 +324,12 @@ export default {
|
|||
},
|
||||
close() {
|
||||
this.showModal = false;
|
||||
this.cameraName = ''
|
||||
this.searchData.cameraName = ''
|
||||
this.selectedArray = [];
|
||||
this.allData = [];
|
||||
this.transferData = [];
|
||||
this.$emit('closeModal');
|
||||
},
|
||||
clear() {
|
||||
this.cameraName = ''
|
||||
this.selectedArray = [];
|
||||
this.getData()
|
||||
this.changeBtn('视频资源')
|
||||
},
|
||||
}
|
||||
|
||||
|
|
|
@ -130,7 +130,7 @@ export default {
|
|||
},
|
||||
// 详情
|
||||
showDetail(val) {
|
||||
window.open(window.SITE_CONFIG.previewUrl + '#/details?id=' + val.id)
|
||||
window.open(window.SITE_CONFIG.previewUrl + '#/integrationServicesDetails?id=' + val.id)
|
||||
},
|
||||
fullScreen() {
|
||||
if (window.outerHeight === screen.availHeight) {
|
||||
|
|
|
@ -129,13 +129,13 @@
|
|||
width="150"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<!-- <el-button
|
||||
v-if="$hasPermission('ability:bsabilityai:update')"
|
||||
<el-button
|
||||
v-if="scope.row.infoList.filter(val=>val.attrType=='组件类型')[0].attrValue == '智能算法'"
|
||||
type="text"
|
||||
size="small"
|
||||
@click="UpdateHandle(scope.row)"
|
||||
>{{ $t("update") }}</el-button
|
||||
> -->
|
||||
@click="toppingCapacity(scope.row)"
|
||||
>置顶</el-button
|
||||
>
|
||||
<el-button
|
||||
v-if="$hasPermission('ability:bsabilityai:update')"
|
||||
type="text"
|
||||
|
@ -314,6 +314,23 @@ export default {
|
|||
// this.fullScreen()
|
||||
},
|
||||
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 () {
|
||||
this.$http
|
||||
.get(
|
||||
|
|
|
@ -23,20 +23,7 @@
|
|||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<DisplayList></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>
|
||||
|
||||
<DisplayList :displayList="displayList" showKey="name"></DisplayList>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -149,8 +136,8 @@ let keyObj = {
|
|||
nameKey: 'zyname'
|
||||
},
|
||||
'组件服务': {
|
||||
idKey: 'zycode',
|
||||
nameKey: 'zyname'
|
||||
idKey: 'id',
|
||||
nameKey: 'name'
|
||||
},
|
||||
}
|
||||
|
||||
|
@ -204,15 +191,15 @@ export default {
|
|||
let attrValue = dataForm.fuseResourceList.filter(v => v.type == this.type);
|
||||
if (attrValue.length > 0) {
|
||||
attrValue.map(val => {
|
||||
let item = this.allData.find(v => v.id == val.resourceId) || {};
|
||||
let _obj = {
|
||||
type: val.type,
|
||||
id: val.resourceId,
|
||||
name: item.name
|
||||
name: val.resource && val.resource.name
|
||||
};
|
||||
arr.push(_obj);
|
||||
});
|
||||
}
|
||||
|
||||
// 展示
|
||||
this.displayList = JSON.parse(JSON.stringify(arr));
|
||||
// 已选中
|
||||
|
@ -223,27 +210,17 @@ export default {
|
|||
},
|
||||
// 获取列表
|
||||
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 === '') {
|
||||
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);
|
||||
if (res.data.code !== 0) {
|
||||
return this.$message.error(res.msg);
|
||||
}
|
||||
this.transferData = []; // allData
|
||||
this.transferData = [];
|
||||
this.allData = [];
|
||||
(res.data.data || []).map(v => {
|
||||
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"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="showDetail(scope.row)"
|
||||
>{{ $t('process.viewFlowImage') }}</el-button
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||
>详情</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
|
@ -86,11 +86,8 @@
|
|||
width="150"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="showDetail(scope.row)"
|
||||
>{{ $t('process.viewFlowImage') }}</el-button
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||
>详情</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
|
@ -86,11 +86,8 @@
|
|||
width="150"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="showDetail(scope.row)"
|
||||
>{{ $t('process.viewFlowImage') }}</el-button
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||
>详情</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
|
@ -86,11 +86,8 @@
|
|||
width="150"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="showDetail(scope.row)"
|
||||
>{{ $t('process.viewFlowImage') }}</el-button
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||
>详情</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
|
@ -86,11 +86,8 @@
|
|||
width="150"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="showDetail(scope.row)"
|
||||
>{{ $t('process.viewFlowImage') }}</el-button
|
||||
<el-button type="text" size="small" @click="showDetail(scope.row)"
|
||||
>详情</el-button
|
||||
>
|
||||
</template>
|
||||
</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
|
||||
></span>
|
||||
</p>
|
||||
<p>
|
||||
<!-- <p>
|
||||
<span>
|
||||
能力应用期望效果:<span>
|
||||
{{ dataForm.content.effectWish || '--' }}</span
|
||||
></span
|
||||
>
|
||||
</p>
|
||||
<p v-if="dataForm.content.enclosure" class="lastP">
|
||||
</p> -->
|
||||
<!-- <p v-if="dataForm.content.enclosure" class="lastP">
|
||||
<span>
|
||||
申请附件:<span>
|
||||
{{ dataForm.content.enclosure || '--'
|
||||
|
@ -64,7 +64,7 @@
|
|||
</button></span
|
||||
></span
|
||||
>
|
||||
</p>
|
||||
</p> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -167,7 +167,8 @@ export default {
|
|||
|
||||
.dynamic-box {
|
||||
width: 770px;
|
||||
height: 335px;
|
||||
height: 285px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dynamicView {
|
||||
|
@ -223,6 +224,9 @@ export default {
|
|||
width: 100%;
|
||||
color: #2b2b2b;
|
||||
font-size: 14px;
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
.recommendView {
|
||||
|
|
|
@ -1,56 +1,111 @@
|
|||
<template>
|
||||
<div class="dept-box" :class="dataInfo.noMarginleft ? 'no-margin-left' : ''">
|
||||
<div class="left-box"
|
||||
:style="{ 'background': dataInfo.bgColor, 'border-right': `1px solid ${dataInfo.borderColor}` }">
|
||||
<div class="content">
|
||||
<img class="img" :src="dataInfo.imgSrc" />
|
||||
<div class="title">{{ title }}</div>
|
||||
<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>
|
||||
</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.userName || '--')+'提交的'+(item.processDefinitionName|| '--')+(item.processDefinitionName!=='能力申请'&&item.processDefinitionName!=='能力需求申请'?'申请':'')"
|
||||
placement="top">
|
||||
<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 class="dept-box" :class="dataInfo.noMarginleft ? 'no-margin-left' : ''">
|
||||
<div
|
||||
class="left-box"
|
||||
:style="{
|
||||
background: dataInfo.bgColor,
|
||||
'border-right': `1px solid ${dataInfo.borderColor}`
|
||||
}"
|
||||
>
|
||||
<div class="content">
|
||||
<img class="img" :src="dataInfo.imgSrc" />
|
||||
<div class="title">{{ title }}</div>
|
||||
<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>
|
||||
</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>
|
||||
<script>
|
||||
import bus from '@/views/bus.js'
|
||||
import mixinViewModule from '@/mixins/view-module'
|
||||
import processModule from '@/mixins/process-module'
|
||||
export default {
|
||||
mixins: [mixinViewModule, processModule],
|
||||
data () {
|
||||
return {
|
||||
|
||||
}
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
dataInfo: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
default: () => {}
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
|
@ -58,6 +113,17 @@ export default {
|
|||
}
|
||||
},
|
||||
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) {
|
||||
return num || num === 0 ? num : '--'
|
||||
},
|
||||
|
@ -155,6 +221,7 @@ export default {
|
|||
border-bottom: 1px dashed #c6c6c6;
|
||||
font-size: 16px;
|
||||
color: #212121;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.more {
|
||||
|
|
|
@ -18,6 +18,7 @@
|
|||
"@ant-design/icons-vue": "^6.1.0",
|
||||
"@element-plus/icons-vue": "^2.0.1",
|
||||
"@turf/turf": "^6.5.0",
|
||||
"animate.css": "^4.1.1",
|
||||
"ant-design-vue": "^3.1.0-rc.5",
|
||||
"axios": "^0.21.1",
|
||||
"clipboard": "^2.0.8",
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2022-03-29 16:45:25
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-08-08 09:19:02
|
||||
* @LastEditTime: 2022-08-16 09:56:58
|
||||
* @Description: 告诉大家这是什么
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
|
@ -33,7 +33,8 @@
|
|||
// 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['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['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['apiURL'] = 'http://10.134.135.9:8888/renren-admin';
|
||||
// 开发
|
||||
// window.SITE_CONFIG['backUrl'] = 'http://localhost:8001';
|
||||
// window.SITE_CONFIG['previewUrl'] = 'http://15.2.21.236:9796/';
|
||||
// window.SITE_CONFIG['frontUrl'] = 'http://15.2.21.236:9796/document/#/devModelFile/';
|
||||
// window.SITE_CONFIG['apiURL'] = 'http://15.2.21.236:8888/renren-admin';
|
||||
// window.SITE_CONFIG['websocketURL'] = '15.2.21.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['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['backUrl'] = 'http://124.222.94.39:9797';
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
/*
|
||||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2020-07-07 16:03:23
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-08-01 11:02:21
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-08-16 09:57:33
|
||||
* @Description: 数据资源参数配置
|
||||
*/
|
||||
const newLocation = 'qingdao'
|
||||
//const newLocation = 'qingdao'
|
||||
// const newLocation = 'baotou'
|
||||
// const newLocation = 'xihaian'
|
||||
const newLocation = 'qingdao'
|
||||
|
||||
// 数据资源数据
|
||||
const whoShow = {}
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2021-06-15 18:50:17
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-07-06 10:54:11
|
||||
* @LastEditTime: 2022-08-12 16:20:45
|
||||
* @Description: 告诉大家这是什么
|
||||
*/
|
||||
;(function (doc, win) {
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2022-04-01 19:19:40
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-07-18 16:24:44
|
||||
* @LastEditTime: 2022-08-13 14:54:04
|
||||
* @Description: 告诉大家这是什么
|
||||
*/
|
||||
import request from '@/utils/request'
|
||||
|
@ -353,6 +353,14 @@ export function getIntegrationServicesList(params) {
|
|||
params,
|
||||
})
|
||||
}
|
||||
// 全局搜索
|
||||
export function getCountByFuzzyQuery(params) {
|
||||
return request({
|
||||
url: '/resource/getCountByFuzzyQuery?keyWorld=' + params,
|
||||
method: 'get',
|
||||
params,
|
||||
})
|
||||
}
|
||||
|
||||
// 融合服务--详情
|
||||
export function getIntegrationDetail(id) {
|
||||
|
@ -370,3 +378,44 @@ export function getDevelopDocTree(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',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/capacitySquare',
|
||||
name: 'capacitySquare',
|
||||
component: () => import('@/views/capacitySquare'),
|
||||
meta: {
|
||||
title: '能力广场',
|
||||
icon: 'error-warning-line',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/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
|
||||
v-for="(itemSonTitle, indexSonTitle) in dataFrom.attrValue"
|
||||
:key="itemSonTitle.name"
|
||||
@click="tabSwitch(itemSonTitle.name)"
|
||||
@click="tabSwitch(itemSonTitle.name, indexSonTitle)"
|
||||
class="tab-son"
|
||||
:class="
|
||||
tabIndexClass(indexSonTitle, dataFrom.name, dataFrom.attrValue)
|
||||
|
@ -21,7 +21,8 @@
|
|||
<div
|
||||
class="tab-top"
|
||||
:class="
|
||||
tabInitialize() == itemSonTitle.name ? 'tab-top-down' : ''
|
||||
(tabInitialize() == itemSonTitle.name ? 'tab-top-down' : '') &&
|
||||
dataIndex == indexSonTitle
|
||||
"
|
||||
>
|
||||
{{ itemSonTitle.name }}
|
||||
|
@ -29,12 +30,20 @@
|
|||
</a-tooltip>
|
||||
<div
|
||||
class="tab-bottom"
|
||||
v-if="tabInitialize() == itemSonTitle.name"
|
||||
v-if="
|
||||
tabInitialize() == itemSonTitle.name && dataIndex == indexSonTitle
|
||||
"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<template v-for="itemSonTitle in dataFrom.attrValue" :key="itemSonTitle">
|
||||
<div class="content" v-if="tabindex == itemSonTitle.name">
|
||||
<template
|
||||
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-scene" v-if="!itemSonTitle.img"></div>
|
||||
<a-image
|
||||
|
@ -60,6 +69,7 @@
|
|||
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
|
||||
import { ref, defineProps, watch } from 'vue'
|
||||
const flag = ref(true)
|
||||
let dataIndex = ref(0)
|
||||
let dataFrom = ref([])
|
||||
// tab切换方法
|
||||
let tabindex = ref('场景说明一')
|
||||
|
@ -105,8 +115,9 @@
|
|||
return tabindex.value
|
||||
}
|
||||
//tab切换点击事件
|
||||
function tabSwitch(name) {
|
||||
function tabSwitch(name, index) {
|
||||
tabindex.value = name
|
||||
dataIndex.value = index
|
||||
return tabindex.value
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<!--
|
||||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-08 11:56:28
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-07-19 15:04:02
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-08-09 11:54:40
|
||||
* @Description: 算法详情页头部
|
||||
-->
|
||||
<template>
|
||||
|
@ -54,7 +54,15 @@
|
|||
<template #icon><form-outlined /></template>
|
||||
申请使用
|
||||
</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>
|
||||
加入申购车
|
||||
</a-button>
|
||||
|
@ -105,30 +113,37 @@
|
|||
// 立即申请
|
||||
function toView() {
|
||||
// window.open(newpage.href, '_blank')
|
||||
console.log('一键申请===================>', props.dataList)
|
||||
localStorage.setItem(
|
||||
'applyList',
|
||||
JSON.stringify([
|
||||
{
|
||||
arr: [
|
||||
{
|
||||
delFlag: props.dataList.delFlag,
|
||||
description: props.dataList.description,
|
||||
resourceId: props.dataList.id,
|
||||
resourceName: props.dataList.name,
|
||||
time: props.dataList.createDate,
|
||||
type: props.dataList.type,
|
||||
componentType: '图层服务',
|
||||
},
|
||||
],
|
||||
deptId: props.dataList.deptId,
|
||||
deptName: props.dataList.deptName,
|
||||
},
|
||||
])
|
||||
)
|
||||
router.push({
|
||||
path: '/apply',
|
||||
})
|
||||
const webUrl = props.dataList.infoList.filter(
|
||||
(val) => val.attrType == '外部服务地址'
|
||||
)[0]?.attrValue
|
||||
if (webUrl) {
|
||||
window.open(webUrl)
|
||||
} else {
|
||||
console.log('一键申请===================>', props.dataList)
|
||||
localStorage.setItem(
|
||||
'applyList',
|
||||
JSON.stringify([
|
||||
{
|
||||
arr: [
|
||||
{
|
||||
delFlag: props.dataList.delFlag,
|
||||
description: props.dataList.description,
|
||||
resourceId: props.dataList.id,
|
||||
resourceName: props.dataList.name,
|
||||
time: props.dataList.createDate,
|
||||
type: props.dataList.type,
|
||||
componentType: '图层服务',
|
||||
},
|
||||
],
|
||||
deptId: props.dataList.deptId,
|
||||
deptName: props.dataList.deptName,
|
||||
},
|
||||
])
|
||||
)
|
||||
router.push({
|
||||
path: '/apply',
|
||||
})
|
||||
}
|
||||
}
|
||||
// 收藏
|
||||
const scFlag2 = ref(true)
|
||||
|
|
|
@ -6,9 +6,40 @@
|
|||
<detailsPageconetentTree />
|
||||
</div>
|
||||
<div class="details-pageconetent-left" v-else>
|
||||
<detailsPageInfrastructureTree />
|
||||
<detailsPageInfrastructureTree v-show="flag != '6'" />
|
||||
</div>
|
||||
<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
|
||||
v-for="item in titleName"
|
||||
|
@ -23,31 +54,18 @@
|
|||
backgroundSize: 'cover',
|
||||
}"
|
||||
></span>
|
||||
<span>{{ item.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="resultListSearchInput-father">
|
||||
<div class="resultListSearchInput-son">
|
||||
模糊搜索
|
||||
<a-input-search
|
||||
v-model:value="searchValue"
|
||||
placeholder="请输入关键词"
|
||||
enter-button="搜索"
|
||||
size="large"
|
||||
@search="getAppResources"
|
||||
@change="onSearch"
|
||||
class="resultListSearchInput"
|
||||
/>
|
||||
<button class="button-reset" @click="chongzhi()">重置</button>
|
||||
<button
|
||||
v-if="Cardsname == '应用资源'"
|
||||
class="button-reset"
|
||||
@click="applyAll()"
|
||||
style="margin-left: 0.1rem"
|
||||
>
|
||||
全部申请
|
||||
</button>
|
||||
<div class="hengxian"></div>
|
||||
<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" :key="listKey">
|
||||
|
@ -160,46 +178,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="top" v-else-if="Cardsname === '基础设施'">
|
||||
<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="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-father">
|
||||
<div class="resultListSearchInput-son">
|
||||
模糊搜索
|
||||
<a-input-search
|
||||
|
@ -207,11 +186,107 @@
|
|||
placeholder="请输入关键词"
|
||||
enter-button="搜索"
|
||||
size="large"
|
||||
@search="getAppResources"
|
||||
@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 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>
|
||||
<KnowledgeBase
|
||||
|
@ -225,6 +300,19 @@
|
|||
<i></i>
|
||||
</a-tooltip>
|
||||
</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
|
||||
|
@ -408,7 +496,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="top-content-father">
|
||||
<infrastructurePage />
|
||||
<infrastructurePage ref="camera" :searchValue="searchValue" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="top" v-else>
|
||||
|
@ -708,6 +796,7 @@
|
|||
pageWithAttrs,
|
||||
getDataResource,
|
||||
getIntegrationServicesList,
|
||||
getCountByFuzzyQuery,
|
||||
} from '@/api/home.js'
|
||||
import { getSgcList } from '@/api/personalCenter'
|
||||
import { useRouter } from 'vue-router'
|
||||
|
@ -729,6 +818,12 @@
|
|||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
//会议室传的标识6
|
||||
const flag = ref('')
|
||||
|
||||
const handleAdd = (value) => {
|
||||
flag.value = value
|
||||
}
|
||||
const titleName = ref(titleNameArray)
|
||||
|
||||
const openMonitor = () => {
|
||||
|
@ -748,7 +843,8 @@
|
|||
const currentPageSize = ref(5)
|
||||
const pageSizeOptions = ref(['5', '10', '20', '50'])
|
||||
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 searchValue = ref(str)
|
||||
let tecHnosphere = router.currentRoute.value.query.tecHnosphere
|
||||
|
@ -772,7 +868,7 @@
|
|||
type: Cardsname.value,
|
||||
name: '',
|
||||
infoList: [],
|
||||
orderField: 'visits', // total 综合 visits 访问量 applyCount 申请量 score 评分 collectCount 收藏量
|
||||
orderField: '', // 传空为默认排序 total 综合 visits 访问量 applyCount 申请量 score 评分 collectCount 收藏量
|
||||
orderType: 'DESC', // ASC 升序 DESC 降序
|
||||
}
|
||||
//西海岸查询参数
|
||||
|
@ -847,10 +943,14 @@
|
|||
}
|
||||
|
||||
// 重置数据
|
||||
const chongzhi = () => {
|
||||
const chongzhi = (flag) => {
|
||||
loading.value = true
|
||||
// 重置模糊查字段
|
||||
searchValue.value = ''
|
||||
if (!flag) {
|
||||
searchValue.value = ''
|
||||
globalFlag.value = false
|
||||
globalData.data = []
|
||||
}
|
||||
paramsGetResources.name = searchValue.value
|
||||
// 重置筛选条件
|
||||
ListContent.records.forEach((val) => {
|
||||
|
@ -873,7 +973,7 @@
|
|||
paramsGetResources.name = ''
|
||||
paramsGetResources.shareCondition = ''
|
||||
paramsGetResources.infoList = []
|
||||
paramsGetResources.orderField = 'total'
|
||||
paramsGetResources.orderField = ''
|
||||
paramsGetResources.orderType = 'DESC'
|
||||
mybus.emit('chongzhi')
|
||||
getAppResources()
|
||||
|
@ -990,9 +1090,98 @@
|
|||
const resourceList = reactive({ data: [] })
|
||||
const videoList = reactive({ data: [] })
|
||||
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 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) => {
|
||||
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) {
|
||||
let str = ''
|
||||
let r = null
|
||||
|
@ -1289,7 +1478,11 @@
|
|||
getNewList()
|
||||
|
||||
if (!tecHnosphere && !appLiCation) {
|
||||
getAppResources()
|
||||
if (searchValue.value && !select2) {
|
||||
globalSearch()
|
||||
} else {
|
||||
getAppResources2()
|
||||
}
|
||||
}
|
||||
})
|
||||
// 全部申请
|
||||
|
@ -1350,7 +1543,7 @@
|
|||
)
|
||||
// router.currentRoute.value.query.select
|
||||
tagFlag.value = false
|
||||
chongzhi()
|
||||
chongzhi(true)
|
||||
getNewList()
|
||||
})
|
||||
}
|
||||
|
@ -1359,6 +1552,40 @@
|
|||
location.reload()
|
||||
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 {
|
||||
listKey,
|
||||
ListContent,
|
||||
|
@ -1375,6 +1602,7 @@
|
|||
Cardsname,
|
||||
getNewList,
|
||||
getAppResources,
|
||||
getAppResources2,
|
||||
chongzhi,
|
||||
onSearch,
|
||||
onShowSizeChange,
|
||||
|
@ -1399,6 +1627,17 @@
|
|||
getShoppingCartList,
|
||||
whoShow1,
|
||||
applyAll,
|
||||
handleAdd,
|
||||
flag,
|
||||
abilitySquare,
|
||||
visibleAbilitySquare,
|
||||
showAbilitySquare,
|
||||
abilitySquareFunction,
|
||||
abilitySquareFunctionData,
|
||||
showAbilitySquareNum,
|
||||
globalData,
|
||||
globalSearch,
|
||||
camera,
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
@ -1427,6 +1666,10 @@
|
|||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@font-face {
|
||||
font-family: 'webfont';
|
||||
src: url('~@/assets/capacitySquare/webfont.ttf');
|
||||
}
|
||||
.resultListSearchInput-father {
|
||||
background: #f3f5f9;
|
||||
padding: 0.2rem;
|
||||
|
@ -1696,13 +1939,13 @@
|
|||
|
||||
.top-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
font-size: 0.2rem;
|
||||
font-family: 'Alibaba PuHuiTi';
|
||||
color: #000000;
|
||||
line-height: 0.34rem;
|
||||
|
||||
margin-bottom: 0.2rem;
|
||||
.photo {
|
||||
display: inline-block;
|
||||
height: 0.44rem;
|
||||
|
@ -1711,7 +1954,7 @@
|
|||
}
|
||||
|
||||
div {
|
||||
margin: 0 0.2rem;
|
||||
// margin: 0 0.2rem;
|
||||
padding: 0 0.1rem;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
|
@ -1852,6 +2095,95 @@
|
|||
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 {
|
||||
width: 10.87rem;
|
||||
|
|
|
@ -114,7 +114,10 @@
|
|||
<a-form-item
|
||||
label="应用背景"
|
||||
name="applicationBackground"
|
||||
:rules="[{ required: true, message: '请输入应用背景' }]"
|
||||
:rules="[
|
||||
{ required: true, message: '请输入应用背景' },
|
||||
{ min: 50, message: '应用背景最少为50个字' },
|
||||
]"
|
||||
>
|
||||
<a-textarea
|
||||
placeholder="请输入应用背景"
|
||||
|
@ -123,7 +126,7 @@
|
|||
/>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div>
|
||||
<!-- <div>
|
||||
<a-form-item
|
||||
label="期望效果"
|
||||
name="effectWish"
|
||||
|
@ -135,8 +138,8 @@
|
|||
:rows="4"
|
||||
/>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<a-form-item
|
||||
</div> -->
|
||||
<!-- <a-form-item
|
||||
style="color: #666; font-size: 16px"
|
||||
label="申请单附件"
|
||||
name="applyDoc"
|
||||
|
@ -175,7 +178,7 @@
|
|||
<div style="margin-top: 8px">上传限一个文件</div>
|
||||
</div>
|
||||
</a-upload>
|
||||
</a-form-item>
|
||||
</a-form-item> -->
|
||||
<div class="bottom-btn">
|
||||
<a-button
|
||||
style="
|
||||
|
@ -799,11 +802,21 @@
|
|||
console.log(`selected ${value}`)
|
||||
}
|
||||
const systemHandleSearch = (value) => {
|
||||
console.log(`search ${value}`)
|
||||
text.value = value
|
||||
systemOptions.value = systemOptions2.value.filter(
|
||||
(item) => item.label.search(text.value) > -1
|
||||
)
|
||||
// console.log(`search ${value}`)
|
||||
// text.value = value
|
||||
// systemOptions.value = systemOptions2.value.filter(
|
||||
// (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({
|
||||
pageNum: 1,
|
||||
|
@ -835,7 +848,14 @@
|
|||
console.log('focus')
|
||||
// console.log(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 = []
|
||||
}
|
||||
// const filterOption = (input, option) => {
|
||||
|
|
|
@ -6,10 +6,13 @@
|
|||
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-xihaian" v-else></div>
|
||||
城市云脑通用能力服务平台
|
||||
<div class="name-content">
|
||||
<p>城市云脑通用能力服务平台</p>
|
||||
<p>(United Capacity System)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-for="item in navList"
|
||||
|
@ -175,6 +178,12 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
// 返回首页
|
||||
const goToHome = () => {
|
||||
router.push({
|
||||
path: '/home',
|
||||
})
|
||||
}
|
||||
// 跳转页面
|
||||
const jumpPage = (item) => {
|
||||
// console.log(item)
|
||||
|
@ -352,6 +361,7 @@
|
|||
font-size: 0.16rem;
|
||||
}
|
||||
.name {
|
||||
cursor: pointer;
|
||||
font-size: 0.22rem;
|
||||
font-family: header-typeface;
|
||||
margin-right: 0.2rem;
|
||||
|
@ -360,7 +370,7 @@
|
|||
.name-bg {
|
||||
height: 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%;
|
||||
margin-right: 0.15rem;
|
||||
}
|
||||
|
@ -372,6 +382,16 @@
|
|||
background-size: 100%;
|
||||
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 {
|
||||
width: 1.2rem;
|
||||
|
@ -432,6 +452,16 @@
|
|||
box-shadow: 0 0.02rem 0.1rem rgba(0, 0, 0, 0.1);
|
||||
.name {
|
||||
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 {
|
||||
cursor: pointer;
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<div class="img" :style="{ 'background-image': `url(${abilityInfo.bgImg || ''})` }"></div>
|
||||
<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' : ''">
|
||||
{{ item }}</div>
|
||||
{{ (item || item === 0) ? item : '--' }}</div>
|
||||
</div>
|
||||
<div class="no-data" v-else>
|
||||
<a-empty description="暂无数据" />
|
||||
|
@ -15,8 +15,6 @@ const props = defineProps({
|
|||
abilityInfo: { type: Object, default: () => { } },
|
||||
})
|
||||
|
||||
console.log('abilityInfo------------>', props.abilityInfo);
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
|
|
|
@ -118,6 +118,7 @@
|
|||
? 'ywzj'
|
||||
: ''
|
||||
"
|
||||
@click="toView('details', item)"
|
||||
v-else-if="
|
||||
selectCardsname !== '基础设施' &&
|
||||
selectCardsname !== '融合服务' &&
|
||||
|
@ -131,7 +132,7 @@
|
|||
selectCardsname === '融合服务' || selectCardsname === '赋能场景'
|
||||
"
|
||||
></div>
|
||||
<div class="right">
|
||||
<div class="right" @click="toView('details', item)">
|
||||
<div class="header">
|
||||
<span style="display: flex; align-items: center; width: 680px">
|
||||
{{ item.name }}
|
||||
|
@ -163,6 +164,43 @@
|
|||
p-id="3065"
|
||||
></path>
|
||||
</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>
|
||||
<div class="header-right">
|
||||
<div
|
||||
|
@ -200,24 +238,10 @@
|
|||
<span>{{ item.createDate.substring(11, 19) }}</span>
|
||||
</template>
|
||||
<template v-else>--</template>
|
||||
<!-- <span>{{ item.createDate || '--' }}</span> -->
|
||||
</div>
|
||||
<!-- <div>
|
||||
更新时间:
|
||||
<span>{{ item.updateDate || '--' }}</span> -->
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="dec">
|
||||
<!-- <div
|
||||
v-if="
|
||||
selectCardsname !== '基础设施' &&
|
||||
selectCardsname !== '数据资源' &&
|
||||
selectCardsname !== '融合服务'
|
||||
"
|
||||
>
|
||||
<span>{{ item.shareType || '--' }}</span>
|
||||
</div> -->
|
||||
<div
|
||||
v-if="
|
||||
selectCardsname !== '融合服务' &&
|
||||
|
@ -273,21 +297,15 @@
|
|||
收藏量:{{ item.collectCount || 0 }}次
|
||||
</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 class="right" v-if="selectCardsname !== '基础设施'">
|
||||
<div class="shopping" :key="shoppingKey">
|
||||
<template
|
||||
v-if="
|
||||
selectCardsname == '组件服务' ||
|
||||
(selectCardsname == '组件服务' &&
|
||||
item.infoList.filter(
|
||||
(val) => val.attrType == '外部服务地址'
|
||||
).length === 0) ||
|
||||
(selectCardsname == '应用资源' && whoShow1.itShowQingDao)
|
||||
"
|
||||
>
|
||||
|
@ -298,7 +316,7 @@
|
|||
<span
|
||||
class="shopping-on"
|
||||
v-else
|
||||
@click="addShoppingCart(item, index)"
|
||||
@click.stop="addShoppingCart(item, index)"
|
||||
></span>
|
||||
</template>
|
||||
</div>
|
||||
|
@ -306,12 +324,12 @@
|
|||
<span
|
||||
class="sc-down"
|
||||
v-if="item.isCollect == 'false'"
|
||||
@click="addCollect(item)"
|
||||
@click.stop="addCollect(item)"
|
||||
></span>
|
||||
<span
|
||||
class="sc-on"
|
||||
v-if="item.isCollect == 'true'"
|
||||
@click="addCollect(item)"
|
||||
@click.stop="addCollect(item)"
|
||||
></span>
|
||||
</div>
|
||||
<div
|
||||
|
@ -321,11 +339,14 @@
|
|||
cardType == '组件服务' && findComponentName(item, '智能算法')
|
||||
"
|
||||
>
|
||||
<span class="pk-on" @click="goComparePk(item, index)"></span>
|
||||
<span
|
||||
class="pk-on"
|
||||
@click.stop="goComparePk(item, index)"
|
||||
></span>
|
||||
</div>
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="toView('details', item)"
|
||||
@click.stop="toView('details', item)"
|
||||
v-if="!whoShow1.itShowBaoTou"
|
||||
>
|
||||
查看详情
|
||||
|
@ -336,21 +357,13 @@
|
|||
selectCardsname === '融合服务' ||
|
||||
selectCardsname === '赋能场景'
|
||||
"
|
||||
@click="handleAKeyApplication(item)"
|
||||
@click.stop="handleAKeyApplication(item)"
|
||||
>
|
||||
一键申请
|
||||
</a-button>
|
||||
<!-- <a-button
|
||||
style="margin-left: 10px"
|
||||
v-show="
|
||||
cardType == '组件服务' && findComponentName(item, '智能算法')
|
||||
"
|
||||
>
|
||||
免费试用
|
||||
</a-button> -->
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="toView('apply', item)"
|
||||
@click.stop="toView('apply', item)"
|
||||
v-show="
|
||||
cardType == '组件服务' ||
|
||||
(cardType == '应用资源' && whoShow1.itShowQingDao)
|
||||
|
@ -612,37 +625,55 @@
|
|||
})
|
||||
} else {
|
||||
if (type === 'apply') {
|
||||
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 == '组件类型'
|
||||
)[0] &&
|
||||
item.infoList.filter(
|
||||
// 外部服务地址跳转到外部
|
||||
const webUrl = item.infoList.filter(
|
||||
(val) => val.attrType == '外部服务地址'
|
||||
)[0]?.attrValue
|
||||
if (webUrl) {
|
||||
window.open(webUrl)
|
||||
} else {
|
||||
if (
|
||||
!(
|
||||
props.selectCardsname === '应用资源' ||
|
||||
props.selectCardsname === '组件服务'
|
||||
) ||
|
||||
whoShow1.itShowBaoTou
|
||||
) {
|
||||
return
|
||||
}
|
||||
// 内部跳转申请页面
|
||||
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 == '组件类型'
|
||||
)[0].attrValue) ||
|
||||
'',
|
||||
},
|
||||
],
|
||||
deptId: item.deptId,
|
||||
deptName: item.deptName,
|
||||
},
|
||||
])
|
||||
)
|
||||
router.push({
|
||||
path: '/apply',
|
||||
})
|
||||
)[0] &&
|
||||
item.infoList.filter(
|
||||
(val) => val.attrType == '组件类型'
|
||||
)[0].attrValue) ||
|
||||
'',
|
||||
},
|
||||
],
|
||||
deptId: item.deptId,
|
||||
deptName: item.deptName,
|
||||
},
|
||||
])
|
||||
)
|
||||
router.push({
|
||||
path: '/apply',
|
||||
})
|
||||
}
|
||||
} else {
|
||||
console.log(
|
||||
'111111111111111111===========>',
|
||||
|
|
|
@ -43,14 +43,21 @@
|
|||
<template #title>{{ val.title }}</template>
|
||||
<span class="name">
|
||||
{{ val.title }}
|
||||
<span
|
||||
v-if="item.title === '区级'"
|
||||
style="
|
||||
display: inline-block;
|
||||
margin-right: 4px;
|
||||
white-space: nowrap;
|
||||
"
|
||||
>
|
||||
({{ val.total }})
|
||||
</span>
|
||||
</span>
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<span v-if="item.title !== '区级'">{{ val.total }}</span>
|
||||
<span v-else>
|
||||
<span style="display: inline-block; margin-right: 4px">
|
||||
{{ val.total }}
|
||||
</span>
|
||||
<down-outlined v-show="!val.show" />
|
||||
<up-outlined v-show="val.show" />
|
||||
</span>
|
||||
|
|
|
@ -19,17 +19,22 @@
|
|||
<div class="hengxian"></div>
|
||||
</div>
|
||||
</div>
|
||||
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2"
|
||||
:resourceList="resourceList" :resourceTotal="resourceTotal" :selectCardsname="number == 0 ? '融合服务' : '赋能场景'" />
|
||||
<div class="pagination">
|
||||
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage"
|
||||
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper :total="resourceTotal"
|
||||
:page-size-options="pageSizeOptions" @change="pageChange" @showSizeChange="onShowSizeChange" />
|
||||
</div>
|
||||
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem">
|
||||
<a-empty />
|
||||
<div v-loading="loadingData">
|
||||
<searchResultList v-show="resourceList.data && resourceList.data.length > 0" :key="listKey2"
|
||||
:resourceList="resourceList" :resourceTotal="resourceTotal"
|
||||
:selectCardsname="number == 0 ? '融合服务' : '赋能场景'" />
|
||||
<div class="pagination">
|
||||
<a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage"
|
||||
v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper
|
||||
:total="resourceTotal" :page-size-options="pageSizeOptions" @change="pageChange"
|
||||
@showSizeChange="onShowSizeChange" />
|
||||
</div>
|
||||
<div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem">
|
||||
<a-empty />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<home-footer></home-footer>
|
||||
</template>
|
||||
|
@ -58,6 +63,7 @@ export default defineComponent({
|
|||
const resourceList = reactive({ data: [] })
|
||||
const resourceTotal = ref(0)
|
||||
const current = ref(1)
|
||||
const loadingData = ref(false)
|
||||
// 选项卡
|
||||
const titleName = ref([
|
||||
{
|
||||
|
@ -120,6 +126,8 @@ export default defineComponent({
|
|||
|
||||
// 获取融合服务列表
|
||||
const getIntegrationList = () => {
|
||||
loadingData.value = true;
|
||||
console.log('获取融合服务列表------------>');
|
||||
let postData = {
|
||||
limit: currentPageSize.value,
|
||||
page: currentPage.value,
|
||||
|
@ -130,13 +138,17 @@ export default defineComponent({
|
|||
}
|
||||
getIntegrationServicesList(postData).then(
|
||||
(res) => {
|
||||
loadingData.value = false;
|
||||
if (res.data.code !== 0) {
|
||||
return message.error(res.data.msg)
|
||||
}
|
||||
console.log('res.data------------>', res.data);
|
||||
|
||||
resourceList.data = res.data.data.list || []
|
||||
resourceTotal.value = res.data.data.total || 0
|
||||
},
|
||||
(err) => {
|
||||
loadingData.value = false;
|
||||
message.error(err)
|
||||
}
|
||||
)
|
||||
|
@ -180,6 +192,7 @@ export default defineComponent({
|
|||
}
|
||||
|
||||
onMounted(() => {
|
||||
console.log('222----onMounted-------->', 222);
|
||||
listKey2.value++
|
||||
getAppResources()
|
||||
})
|
||||
|
@ -215,6 +228,7 @@ export default defineComponent({
|
|||
titleName,
|
||||
changeCards,
|
||||
number,
|
||||
loadingData,
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
|
|
@ -20,7 +20,9 @@
|
|||
</div>
|
||||
</div>
|
||||
<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 class="btn-box">
|
||||
<a-button size="big" class="btn-text" type="primary" @click="handleAKeyApplication()">
|
||||
|
@ -29,12 +31,11 @@
|
|||
</template>
|
||||
申请使用
|
||||
</a-button>
|
||||
<a-button size="big" class="btn-text" :type="detailInfoObj.isCollect == 'true' ? 'primary' : ''"
|
||||
@click="addCollect()">
|
||||
<a-button size="big" class="btn-text" type="primary" @click="addCollect()">
|
||||
<template #icon>
|
||||
<form-outlined />
|
||||
</template>
|
||||
收藏
|
||||
{{ detailInfoObj.isCollect == 'true' ? '已收藏' : '收藏' }}
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -79,21 +80,25 @@ const abilityList = ref([
|
|||
{
|
||||
name: '数据资源',
|
||||
bgImg: require('../../assets/home/integration/sjzyDetail.png'),
|
||||
list: []
|
||||
list: [],
|
||||
showTextKey: 'zyname',
|
||||
},
|
||||
{
|
||||
name: '组件服务',
|
||||
bgImg: require('../../assets/home/integration/zjfwDetail.png'),
|
||||
list: []
|
||||
list: [],
|
||||
showTextKey: 'name',
|
||||
},
|
||||
{
|
||||
name: '基础设施',
|
||||
bgImg: require('../../assets/home/integration/jcssDetail.png'),
|
||||
list: []
|
||||
list: [],
|
||||
showTextKey: 'channelName',
|
||||
},
|
||||
])
|
||||
const imgUrl = ref('')
|
||||
|
||||
|
||||
// 融合服务--详情
|
||||
const getIntegrationServicesDeatil = (id) => {
|
||||
loadingPage.value = true
|
||||
|
@ -109,7 +114,7 @@ const getIntegrationServicesDeatil = (id) => {
|
|||
let fuseResourceList = detailInfoObj.value.fuseResourceList || []
|
||||
abilityList.value.map(v => {
|
||||
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 == '服务图片') || []
|
||||
imgUrl.value = imgList[0] && imgList[0].attrValue || ''
|
||||
|
@ -299,12 +304,10 @@ getIntegrationServicesDeatil(id)
|
|||
|
||||
.name {
|
||||
font-size: 0.16rem;
|
||||
margin-bottom: 0.2rem;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
|
||||
.area {
|
||||
margin-bottom: 0.2rem;
|
||||
margin: 0.1rem 0;
|
||||
}
|
||||
|
||||
.desc {
|
||||
|
@ -319,7 +322,7 @@ getIntegrationServicesDeatil(id)
|
|||
|
||||
.btn-box {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
bottom: -15px;
|
||||
left: 0.2rem;
|
||||
|
||||
.btn-text {
|
||||
|
@ -341,5 +344,4 @@ getIntegrationServicesDeatil(id)
|
|||
.list-box {
|
||||
padding: 0.4rem;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
@ -226,6 +226,7 @@
|
|||
longitude: this.mapSearchParam.gpsX || '',
|
||||
latitude: this.mapSearchParam.gpsY || '',
|
||||
radius: this.mapSearchParam.radius || '',
|
||||
status: 1,
|
||||
}
|
||||
let paramsFather = ''
|
||||
let i = 1
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="navigation">
|
||||
<div class="navigation bg-pan-bl">
|
||||
<div class="main" v-if="qeihuan">
|
||||
<div class="top">
|
||||
<span
|
||||
|
@ -147,6 +147,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="imgBox tracking-in-expand">
|
||||
<img src="~@/assets/newHome/slogan.png" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
@ -154,6 +157,7 @@
|
|||
import { ref } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useStore } from 'vuex'
|
||||
import { message } from 'ant-design-vue'
|
||||
const store = useStore()
|
||||
const router = useRouter()
|
||||
const topList = ref([
|
||||
|
@ -225,11 +229,11 @@
|
|||
appLiCation: '',
|
||||
})
|
||||
const changeCard = (name) => {
|
||||
// if (select.value == name) {
|
||||
// select.value = ''
|
||||
// } else {
|
||||
select.value = name
|
||||
// }
|
||||
if (select.value == name && whoShow.itShowQingDao) {
|
||||
select.value = ''
|
||||
} else {
|
||||
select.value = name
|
||||
}
|
||||
snum.value.select = select.value
|
||||
}
|
||||
function selectCard(value) {
|
||||
|
@ -279,24 +283,29 @@
|
|||
}
|
||||
const mohuchaxun = ref('组件服务')
|
||||
function onSearch() {
|
||||
snum.value.str = text.value
|
||||
console.log('===================>', text.value)
|
||||
store.commit('home/selectCardsData', snum.value)
|
||||
router.push({
|
||||
path: '/DetailsPageconetent',
|
||||
query: snum.value,
|
||||
})
|
||||
if (text.value) {
|
||||
snum.value.str = text.value
|
||||
console.log('===================>', text.value)
|
||||
store.commit('home/selectCardsData', snum.value)
|
||||
router.push({
|
||||
path: '/DetailsPageconetent',
|
||||
query: snum.value,
|
||||
})
|
||||
} else {
|
||||
message.warning('请输入查询内容!')
|
||||
}
|
||||
// router.push({ path: '/DetailsPageconetent' })
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.navigation {
|
||||
height: 4.8rem;
|
||||
height: 5.8rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
// justify-content: center;
|
||||
align-items: center;
|
||||
background: url('~@/assets/newHome/banner-main.jpg') no-repeat;
|
||||
background-size: cover;
|
||||
background-size: 150%;
|
||||
:deep(.ant-btn) > span {
|
||||
font-size: 0.16rem;
|
||||
}
|
||||
|
@ -306,6 +315,7 @@
|
|||
background: rgba(255, 255, 255, 0.18);
|
||||
padding: 0.2rem 0.4rem;
|
||||
border-radius: 0.02rem;
|
||||
margin-top: 1.36rem;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
@ -387,6 +397,7 @@
|
|||
background: rgba(255, 255, 255, 0.18);
|
||||
padding: 0.24rem 0.2rem;
|
||||
border-radius: 0.02rem;
|
||||
margin-top: 1.36rem;
|
||||
.gaoji-top {
|
||||
width: 8.7rem;
|
||||
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>
|
||||
|
|
|
@ -132,7 +132,7 @@
|
|||
box-shadow: 0.05rem 0.05rem 0.1rem #ccc;
|
||||
padding: 0 1.5rem;
|
||||
position: absolute;
|
||||
top: 4rem;
|
||||
top: 5rem;
|
||||
left: 3rem;
|
||||
.item {
|
||||
display: flex;
|
||||
|
|
|
@ -113,6 +113,37 @@
|
|||
</div>
|
||||
</a-modal>
|
||||
</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>
|
||||
</template>
|
||||
|
@ -142,6 +173,7 @@
|
|||
abilityToTypeFunctionData.value = item
|
||||
}
|
||||
let abilityToType = ref(['组件服务', '应用资源'])
|
||||
let abilitySquare = ref(['智能算法', '图层服务', '应用资源'])
|
||||
let componentType = ref([
|
||||
'智能算法',
|
||||
'图层服务',
|
||||
|
@ -154,6 +186,11 @@
|
|||
const showModal = () => {
|
||||
visible.value = true
|
||||
}
|
||||
// 能力广场
|
||||
const visibleAbilitySquare = ref(false)
|
||||
const showAbilitySquare = () => {
|
||||
visibleAbilitySquare.value = true
|
||||
}
|
||||
let componentTypeValueOld = ref('')
|
||||
function componentTypeValueFunction(item) {
|
||||
if (componentTypeValueOld.value != item) {
|
||||
|
@ -252,6 +289,28 @@
|
|||
watch(abilityToTypeFunctionData, () => {
|
||||
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>
|
||||
<style lang="less">
|
||||
.shangjia-class {
|
||||
|
@ -571,4 +630,11 @@
|
|||
background-size: contain;
|
||||
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>
|
||||
|
|
|
@ -162,6 +162,7 @@
|
|||
:action="upLoadUrl"
|
||||
:headers="headers"
|
||||
@change="handleChange"
|
||||
:maxCount="1"
|
||||
>
|
||||
<a-button
|
||||
style="
|
||||
|
@ -181,7 +182,7 @@
|
|||
文件上传
|
||||
</a-button>
|
||||
<span style="font-size: 14px; color: #999">
|
||||
支持doc、docx、jpg、png、jpeg、pdf、xlxs、ppt类型文件
|
||||
支持doc、docx、jpg、png、jpeg、pdf、xlxs、ppt类型文件(仅限一个)
|
||||
</span>
|
||||
</a-upload>
|
||||
</a-form-item>
|
||||
|
@ -346,6 +347,13 @@
|
|||
const fileList = ref([])
|
||||
const subimtFlag = ref(true)
|
||||
const processStartHandle = () => {
|
||||
if (formName.detailsField.length > 0) {
|
||||
let detailsField = ''
|
||||
formName.detailsField.map((item) => {
|
||||
detailsField += item + ';'
|
||||
})
|
||||
formName.detailsField = detailsField
|
||||
}
|
||||
if (id.value) {
|
||||
updateDemandForm(formName).then((upres) => {
|
||||
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;
|
||||
}
|