演示提交

This commit is contained in:
熊丽君
2022-02-16 08:54:56 +08:00
parent d6684a154b
commit 43023de455
33 changed files with 2417 additions and 1633 deletions

View File

@ -5,7 +5,7 @@ VITE_APP_TITLE = xxx管理系统
VITE_APP_ENV = 'production'
# xxx管理系统/生产环境
VITE_APP_BASE_API = '/prod-api'
VITE_APP_BASE_API = '/api'
# 是否在打包时开启压缩,支持 gzip 和 brotli
VITE_BUILD_COMPRESS = gzip,brotli

View File

@ -33,7 +33,7 @@ export function register(data) {
// 获取用户详细信息
export function getInfo() {
return request({
url: '/getInfo',
url: '/enterprise/v1/user/info',
method: 'get'
})
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 79 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

View File

@ -1,8 +1,12 @@
<template>
<el-breadcrumb class="app-breadcrumb" separator="/">
<transition-group name="breadcrumb">
<el-breadcrumb-item v-for="(item,index) in levelList" :key="item.path">
<span v-if="item.redirect === 'noRedirect' || index == levelList.length - 1" class="no-redirect">{{ item.meta.title }}</span>
<el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
<span
v-if="item.redirect === 'noRedirect' || index == levelList.length - 1"
class="no-redirect"
>{{ item.meta.title }}</span
>
<a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
</el-breadcrumb-item>
</transition-group>
@ -12,42 +16,44 @@
<script setup>
const route = useRoute();
const router = useRouter();
const levelList = ref([])
const levelList = ref([]);
function getBreadcrumb() {
// only show routes with meta.title
let matched = route.matched.filter(item => item.meta && item.meta.title);
const first = matched[0]
let matched = route.matched.filter((item) => item.meta && item.meta.title);
const first = matched[0];
// 判断是否为首页
if (!isDashboard(first)) {
matched = [{ path: '/index', meta: { title: '首页' } }].concat(matched)
matched = [{ path: "/admin", meta: { title: "首页" } }].concat(matched);
}
levelList.value = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
levelList.value = matched.filter(
(item) => item.meta && item.meta.title && item.meta.breadcrumb !== false
);
}
function isDashboard(route) {
const name = route && route.name
const name = route && route.name;
if (!name) {
return false
return false;
}
return name.trim() === 'Index'
return name.trim() === "Index";
}
function handleLink(item) {
const { redirect, path } = item
const { redirect, path } = item;
if (redirect) {
router.push(redirect)
return
router.push(redirect);
return;
}
router.push(path)
router.push(path);
}
watchEffect(() => {
// if you go to the redirect page, do not update the breadcrumbs
if (route.path.startsWith('/redirect/')) {
return
if (route.path.startsWith("/redirect/")) {
return;
}
getBreadcrumb()
})
getBreadcrumb();
});
getBreadcrumb();
</script>

View File

@ -1,35 +1,35 @@
<template>
<div class="webFooter">
<div class="wrap">
<el-row>
<el-col :span="4">
<div class="tit">解决方案</div>
<p><a href="">大型企业服务</a></p>
<p><a href="">科研院所服务</a></p>
<p><a href="">政府区域服务</a></p>
</el-col>
<el-col :span="4">
<div class="tit">创新服务</div>
<p><a href="">科技快报</a></p>
<p><a href="">海外人才推荐</a></p>
</el-col>
<el-col :span="8">
<div class="tit">联系我们</div>
<p><a href="">客服电话400-666-8888</a></p>
<p><a href="">邮箱zhongkeyun@163.cn</a></p>
<p><a href="">地址安徽省合肥市科大讯飞大楼</a></p>
</el-col>
<el-col :span="4" style="text-align: center;">
<div class="webFooter">
<div class="wrap">
<el-row>
<el-col :span="4">
<div class="tit">解决方案</div>
<p><a href="">大型企业服务</a></p>
<p><a href="">科研院所服务</a></p>
<p><a href="">政府区域服务</a></p>
</el-col>
<el-col :span="4">
<div class="tit">创新服务</div>
<p><a href="">科技快报</a></p>
<p><a href="">海外人才推荐</a></p>
</el-col>
<el-col :span="8">
<div class="tit">联系我们</div>
<p><a href="">客服电话400-666-8888</a></p>
<p><a href="">邮箱zhongkeyun@163.cn</a></p>
<p><a href="">地址安徽省合肥市科大讯飞大楼</a></p>
</el-col>
<!-- <el-col :span="4" style="text-align: center;">
<div class="tit">二维码</div>
<p><img class="qrcode" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fbpic.588ku.com%2Felement_origin_min_pic%2F01%2F39%2F53%2F71573cc4a35de96.jpg&refer=http%3A%2F%2Fbpic.588ku.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1643849770&t=80c12feeca42dad377bbdde1d6e78f33" alt=""></p>
</el-col>
<el-col :span="4" style="text-align: center;">
<div class="tit">二维码</div>
<p><img class="qrcode" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fbpic.588ku.com%2Felement_origin_min_pic%2F01%2F39%2F53%2F71573cc4a35de96.jpg&refer=http%3A%2F%2Fbpic.588ku.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1643849770&t=80c12feeca42dad377bbdde1d6e78f33" alt=""></p>
</el-col>
</el-row>
</div>
</el-col> -->
</el-row>
</div>
</div>
</template>
<script setup lang="ts">
@ -38,26 +38,26 @@ import { onMounted, reactive, watch } from "vue";
<style lang="scss" scoped>
.webFooter {
background: #DEE9FF;
background: #dee9ff;
}
.wrap {
width: 1000px;
margin: 0 auto;
padding: 100px 0;
font-size: 14px;
width: 1000px;
margin: 0 auto;
padding: 100px 0;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333333;
.tit {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333333;
.tit {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333333;
}
.qrcode {
width: 88px;
height: 88px;
}
}
.qrcode {
width: 88px;
height: 88px;
}
}
</style>

View File

@ -1,20 +1,25 @@
<template>
<div class="navbar">
<hamburger id="hamburger-container" :is-active="getters.sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!$store.state.settings.topNav" />
<top-nav id="topmenu-container" class="topmenu-container" v-if="$store.state.settings.topNav" />
<hamburger
id="hamburger-container"
:is-active="getters.sidebar.opened"
class="hamburger-container"
@toggleClick="toggleSideBar"
/>
<breadcrumb
id="breadcrumb-container"
class="breadcrumb-container"
v-if="!$store.state.settings.topNav"
/>
<top-nav
id="topmenu-container"
class="topmenu-container"
v-if="$store.state.settings.topNav"
/>
<div class="right-menu">
<template v-if="getters.device !== 'mobile'">
<header-search id="header-search" class="right-menu-item" />
<el-tooltip content="源码地址" effect="dark" placement="bottom">
<ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
</el-tooltip>
<el-tooltip content="文档地址" effect="dark" placement="bottom">
<ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
</el-tooltip>
<!-- <header-search id="header-search" class="right-menu-item" /> -->
<screenfull id="screenfull" class="right-menu-item hover-effect" />
@ -30,12 +35,10 @@
</div>
<template #dropdown>
<el-dropdown-menu>
<router-link to="/user/profile">
<!-- /user/profile -->
<router-link to="">
<el-dropdown-item>个人中心</el-dropdown-item>
</router-link>
<el-dropdown-item @click="setLayout">
<span>布局设置</span>
</el-dropdown-item>
<el-dropdown-item divided @click="logout">
<span>退出登录</span>
</el-dropdown-item>
@ -48,38 +51,40 @@
</template>
<script setup>
import { ElMessageBox } from 'element-plus'
import Breadcrumb from '@/components/Breadcrumb'
import TopNav from '@/components/TopNav'
import Hamburger from '@/components/Hamburger'
import Screenfull from '@/components/Screenfull'
import SizeSelect from '@/components/SizeSelect'
import HeaderSearch from '@/components/HeaderSearch'
import RuoYiGit from '@/components/RuoYi/Git'
import RuoYiDoc from '@/components/RuoYi/Doc'
import { ElMessageBox } from "element-plus";
import Breadcrumb from "@/components/Breadcrumb";
import TopNav from "@/components/TopNav";
import Hamburger from "@/components/Hamburger";
import Screenfull from "@/components/Screenfull";
import SizeSelect from "@/components/SizeSelect";
import HeaderSearch from "@/components/HeaderSearch";
import RuoYiGit from "@/components/RuoYi/Git";
import RuoYiDoc from "@/components/RuoYi/Doc";
const store = useStore();
const getters = computed(() => store.getters);
function toggleSideBar() {
store.dispatch('app/toggleSideBar')
store.dispatch("app/toggleSideBar");
}
function logout() {
ElMessageBox.confirm('确定注销并退出系统吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
store.dispatch('LogOut').then(() => {
location.href = '/index';
ElMessageBox.confirm("确定注销并退出系统吗?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
store.dispatch("LogOut").then(() => {
location.href = "/";
});
})
}).catch(() => { });
.catch(() => {});
}
const emits = defineEmits(['setLayout'])
const emits = defineEmits(["setLayout"]);
function setLayout() {
emits('setLayout');
emits("setLayout");
}
</script>

View File

@ -1,12 +1,28 @@
<template>
<div :class="{ 'has-logo': showLogo }" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
<div
:class="{ 'has-logo': showLogo }"
:style="{
backgroundColor:
sideTheme === 'theme-dark'
? variables.menuBackground
: variables.menuLightBackground,
}"
>
<logo v-if="showLogo" :collapse="isCollapse" />
<el-scrollbar :class="sideTheme" wrap-class="scrollbar-wrapper">
<el-menu
:default-active="activeMenu"
:collapse="isCollapse"
:background-color="sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground"
:text-color="sideTheme === 'theme-dark' ? variables.menuColor : variables.menuLightColor"
:background-color="
sideTheme === 'theme-dark'
? variables.menuBackground
: variables.menuLightBackground
"
:text-color="
sideTheme === 'theme-dark'
? variables.menuColor
: variables.menuLightColor
"
:unique-opened="true"
:active-text-color="theme"
:collapse-transition="false"
@ -24,14 +40,14 @@
</template>
<script setup>
import Logo from './Logo'
import SidebarItem from './SidebarItem'
import variables from '@/assets/styles/variables.module.scss'
import Logo from "./Logo";
import SidebarItem from "./SidebarItem";
import variables from "@/assets/styles/variables.module.scss";
const route = useRoute();
const store = useStore();
const sidebarRouters = computed(() => store.getters.sidebarRouters);
const sidebarRouters = computed(() => store.getters.sidebarRouters);
const showLogo = computed(() => store.state.settings.sidebarLogo);
const sideTheme = computed(() => store.state.settings.sideTheme);
const theme = computed(() => store.state.settings.theme);
@ -44,6 +60,5 @@ const activeMenu = computed(() => {
return meta.activeMenu;
}
return path;
})
});
</script>

View File

@ -25,17 +25,16 @@ router.beforeEach((to, from, next) => {
} else {
if (store.getters.roles.length === 0) {
// 判断当前用户是否已拉取完user_info信息
store.dispatch('GetInfo').then(() => {
next({ ...to, replace: true })
// store.dispatch('GenerateRoutes').then(accessRoutes => {
// // 根据roles权限生成可访问的路由表
// accessRoutes.forEach(route => {
// if (!isHttp(route.path)) {
// router.addRoute(route) // 动态添加可访问路由表
// }
// })
// next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
// })
store.dispatch('GetInfo').then((res) => {
store.dispatch('GenerateRoutes',res.data.select_identity).then(accessRoutes => {
// 根据roles权限生成可访问的路由表
// accessRoutes.forEach(route => {
// if (!isHttp(route.path)) {
// router.addRoute(route) // 动态添加可访问路由表
// }
// })
next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
})
}).catch(err => {
store.dispatch('LogOut').then(() => {
ElMessage.error(err)

View File

@ -1,5 +1,6 @@
import { createWebHistory, createRouter } from 'vue-router'
import Layout from '@/layout'
import ParentView from '@/components/ParentView'
/**
* Note: 路由配置项
@ -27,6 +28,7 @@ export const constantRoutes = [
path: '/',
name: 'Home',
component: () => import('../views/websiteLayout.vue'),
hidden:true,
children: [
{
path: 'login',
@ -126,6 +128,7 @@ export const constantRoutes = [
{
path: '/identity',
component: () => import('@/views/identity/layout'),
hidden:true,
children:[
{
path:'index',
@ -166,44 +169,19 @@ export const constantRoutes = [
]
},
{
path: '/one',
component: Layout,
redirect: '/one/enterprise',
children: [
{
path: 'enterprise',
component: () => import('@/views/admin/one/index'),
name: 'Enterprise',
meta: { title: '首页', icon: 'dashboard', affix: true }
}
]
},
{
path: '/two',
component: Layout,
redirect: '/two/expert',
children: [
{
path: 'expert',
component: () => import('@/views/admin/two/index'),
name: 'Expert',
meta: { title: '首页', icon: 'dashboard', affix: true }
}
]
},
{
path: '/three',
component: Layout,
redirect: '/three/research',
children: [
{
path: 'research',
component: () => import('@/views/admin/three/index'),
name: 'Research',
meta: { title: '首页', icon: 'dashboard', affix: true }
}
]
},
path: '/admin',
component: Layout,
redirect: '/admin/index',
children: [
{
path: 'index',
component: () => import('@/views/admin/index'),
name: 'Index',
meta: { title: '首页', icon: 'dashboard', affix: true },
},
],
},
{
path: '/user',
component: Layout,
@ -285,6 +263,85 @@ export const constantRoutes = [
}
];
export const enterpriseRoutes = [
{
path: '/one',
component: Layout,
children: [
{
path: 'enterprise',
component: () => import('@/views/admin/one/index'),
name: 'Enterprise',
meta: { title: '账号管理', icon: 'dashboard' }
}
]
},
]
export const expertRoutes=[
{
path: '/account',
component: Layout,
meta: { title: '账号管理', icon: 'dashboard' },
alwaysShow:true,
redirect: 'noRedirect',
children: [
{
path: 'bill',
component: () => import('@/views/admin/two/account/bill'),
name: 'Bill',
meta: { title: '账单列表', icon: 'dashboard' }
}
]
},
// {
// path: '/technology',
// component: Layout,
// meta: { title: '技术管理', icon: 'dashboard' },
// alwaysShow:true,
// redirect: 'noRedirect',
// children: [
// {
// path: 'achievement',
// component: ParentView,
// meta: { title: '成果列表', icon: 'list' },
// alwaysShow:true,
// redirect: 'noRedirect',
// children:[
// {
// path: 'release',
// component: () => import('@/views/admin/two/technology/release'),
// name: 'release',
// meta: { title: '发布成果', icon: 'dashboard' }
// }
// ]
// },
// {
// path: 'research',
// component: () => import('@/views/admin/two/technology/research'),
// name: 'Research',
// meta: { title: '科研项目列表', icon: 'dashboard' }
// }
// ]
// },
]
export const researchRoutes=[
{
path: '/three',
component: Layout,
children: [
{
path: 'research',
component: () => import('@/views/admin/three/index'),
name: 'Research',
meta: { title: '菜单3', icon: 'dashboard' }
}
]
},
]
const router = createRouter({
history: createWebHistory(),
routes: constantRoutes,

View File

@ -20,7 +20,7 @@ export default {
/**
* 是否显示 tagsView
*/
tagsView: true,
tagsView: false,
/**
* 是否固定头部

View File

@ -1,4 +1,4 @@
import { constantRoutes } from '@/router'
import router,{ constantRoutes,enterpriseRoutes,expertRoutes,researchRoutes } from '@/router'
import { getRouters } from '@/api/menu'
import Layout from '@/layout/index'
import ParentView from '@/components/ParentView'
@ -37,22 +37,47 @@ const permission = {
},
actions: {
// 生成路由
GenerateRoutes({ commit }) {
GenerateRoutes({ commit },role) {
return new Promise(resolve => {
// 向后端请求路由数据
getRouters().then(res => {
const sdata = JSON.parse(JSON.stringify(res.data))
const rdata = JSON.parse(JSON.stringify(res.data))
const defaultData = JSON.parse(JSON.stringify(res.data))
const sidebarRoutes = filterAsyncRouter(sdata)
const rewriteRoutes = filterAsyncRouter(rdata, false, true)
const defaultRoutes = filterAsyncRouter(defaultData)
commit('SET_ROUTES', rewriteRoutes)
commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes))
commit('SET_DEFAULT_ROUTES', sidebarRoutes)
commit('SET_TOPBAR_ROUTES', defaultRoutes)
resolve(rewriteRoutes)
let data = []
if (role == 1) {
// 企业
data = enterpriseRoutes
} else if (role == 2) {
// 专家
data = expertRoutes
} else if (role == 4) {
// 研究机构
data = researchRoutes
} else if (role == 8) {
// 实验室
} else if (role == 16) {
// 科技经纪人
}
data.map(item=>{
router.addRoute(item)
})
commit('SET_ROUTES', constantRoutes.concat(data))
commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(data))
commit('SET_DEFAULT_ROUTES', constantRoutes.concat(data))
commit('SET_TOPBAR_ROUTES', data)
resolve(constantRoutes.concat(data))
// 向后端请求路由数据
// getRouters().then(res => {
// const sdata = JSON.parse(JSON.stringify(res.data))
// const rdata = JSON.parse(JSON.stringify(res.data))
// const defaultData = JSON.parse(JSON.stringify(res.data))
// const sidebarRoutes = filterAsyncRouter(sdata)
// const rewriteRoutes = filterAsyncRouter(rdata, false, true)
// const defaultRoutes = filterAsyncRouter(defaultData)
// commit('SET_ROUTES', rewriteRoutes)
// commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes))
// commit('SET_DEFAULT_ROUTES', sidebarRoutes)
// commit('SET_TOPBAR_ROUTES', defaultRoutes)
// resolve(rewriteRoutes)
// })
})
}
}

View File

@ -51,8 +51,7 @@ const user = {
// 获取用户信息
GetInfo({ commit, state }) {
return new Promise((resolve, reject) => {
settled().then(res => {
res.data['avatar'] = ''
getInfo().then(res => {
const avatar = res.data.avatar == "" ? defAva : import.meta.env.VITE_APP_BASE_API + res.data.avatar;
if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
@ -61,8 +60,9 @@ const user = {
} else {
commit('SET_ROLES', ['ROLE_DEFAULT'])
}
commit('SET_NAME', res.data.userName)
commit('SET_NAME', res.data.name)
commit('SET_AVATAR', avatar)
localStorage.setItem('select_identity',res.data.select_identity)
resolve(res)
}).catch(error => {
reject(error)

26
src/views/admin/index.vue Normal file
View File

@ -0,0 +1,26 @@
<template>
<component :is="componentId"></component>
</template>
<script setup>
import index1 from "./one/index.vue";
import index2 from "./two/index.vue";
import index3 from "./three/index.vue";
const route = useRoute();
const role = localStorage.getItem("select_identity");
const componentId = shallowRef(null);
onMounted(() => {
if (role == 1) {
componentId.value = index1;
} else if (role == 2) {
componentId.value = index2;
} else if (role == 4) {
componentId.value = index3;
} else if (role == 8) {
componentId.value = index3;
} else if (role == 16) {
componentId.value = index3;
} else {
alert("暂无身份");
}
});
</script>

View File

@ -1,3 +1,3 @@
<template>
<div>index</div>
<div>one-home</div>
</template>

View File

@ -1,3 +1,3 @@
<template>
<div>index3</div>
<div>three-home</div>
</template>

View File

@ -0,0 +1,3 @@
<template>
<div>bill</div>
</template>

View File

@ -0,0 +1,136 @@
<template>
<div :class="className" :style="{ height: height, width: width }" />
</template>
<script>
import echarts from "echarts";
// require("echarts/theme/macarons"); // echarts theme
// import resize from "./mixins/resize";
export default {
// mixins: [resize],
props: {
className: {
type: String,
default: "chart",
},
width: {
type: String,
default: "100%",
},
height: {
type: String,
default: "350px",
},
autoResize: {
type: Boolean,
default: true,
},
chartData: {
type: Object,
required: true,
},
},
data() {
return {
chart: null,
};
},
watch: {
chartData: {
deep: true,
handler(val) {
this.setOptions(val);
},
},
},
mounted() {
this.$nextTick(() => {
this.initChart();
});
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
this.chart = echarts.init(this.$el, "macarons");
this.setOptions(this.chartData);
},
setOptions({ expectedData, actualData, keys, arr } = {}) {
this.chart.setOption({
tooltip: {},
xAxis: [
{
type: "category",
boundaryGap: false,
data: [
"2021-01",
"2021-02",
"2021-03",
"2021-04",
"2021-05",
"2021-06",
"2021-07",
"2021-08",
"2021-09",
"2021-10",
"2021-11",
"2021-12",
],
axisPointer: {
type: "shadow",
},
},
],
yAxis: [
{
type: "value",
min: 0,
axisLabel: {
formatter: "{value}",
},
splitLine: {
show: false, //不显示网格线
},
splitArea: {
show: false, //不显示网格区域
},
},
],
grid: {
containLabel: true,
width: "99%",
left: 0,
top: 30,
bottom: 0,
},
series: [
{
name: "",
type: "line",
data: [
2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2,
],
areaStyle: {
color: "#dbeefc",
},
itemStyle: {
normal: {
color: "rgba(73, 169,238, 1)",
},
},
// symbol: "none",
// smooth: true,
// showSymbol: false,
},
],
});
},
},
};
</script>

View File

@ -1,3 +1,273 @@
<template>
<div>index2</div>
</template>
<div class="app-container">
<el-row :gutter="40" class="panel-group">
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-people">
<svg-icon icon-class="message" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">总收入创新币</div>
<div class="card-panel-num">124,345</div>
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-message">
<svg-icon icon-class="message" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">总收入金额</div>
<div class="card-panel-num">54,323</div>
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-money">
<svg-icon icon-class="message" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">总充值创新币</div>
<div class="card-panel-num">124,345</div>
</div>
</div>
</el-col>
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
<div class="card-panel">
<div class="card-panel-icon-wrapper icon-shopping">
<svg-icon icon-class="message" class-name="card-panel-icon" />
</div>
<div class="card-panel-description">
<div class="card-panel-text">总充值创新币金额</div>
<div class="card-panel-num">54,323</div>
</div>
</div>
</el-col>
</el-row>
<div class="card-panel surplus-currency">
<span style="margin-right: 50px; font-size: 16px; font-weight: 700"
>剩余创新币98</span
>
<el-button class="x_btns">创新币充值</el-button>
</div>
<el-card>
<template #header>
<div>快捷功能</div>
</template>
<div class="card_body">
<div class="card_item">
<img
style="width: 70px; height: 70px; border-radius: 50%"
src="https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg"
/>
<div>发布成果</div>
</div>
<div class="card_item">
<img
style="width: 70px; height: 70px; border-radius: 50%"
src="https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg"
/>
<div>发布需求</div>
</div>
</div>
</el-card>
<el-card style="margin-top: 20px">
<template #header>
<div>数据统计</div>
</template>
<el-descriptions :column="4">
<el-descriptions-item label="发布成果:">
<span style="color: #f97c7c; font-weight: 700"> 0 </span
></el-descriptions-item
>
<el-descriptions-item label="成果需求:"
><span style="color: #f97c7c; font-weight: 700"> 0 </span
></el-descriptions-item
>
<el-descriptions-item label=""></el-descriptions-item>
<el-descriptions-item label="发布视频:"
><span style="color: #f97c7c; font-weight: 700"> 0 </span
></el-descriptions-item
>
<el-descriptions-item label="已报名活动:"
><span style="color: #f97c7c; font-weight: 700"> 0 </span>
</el-descriptions-item>
<el-descriptions-item label="我的收藏:"
><span style="color: #f97c7c; font-weight: 700"> 0 </span
></el-descriptions-item
>
<el-descriptions-item label="代表专利:"
><span style="color: #f97c7c; font-weight: 700"> 0 </span
></el-descriptions-item
>
<el-descriptions-item label="我的沦文:"
><span style="color: #f97c7c; font-weight: 700"> 0 </span
></el-descriptions-item
>
</el-descriptions>
</el-card>
<el-card style="margin-top: 20px">
<template #header>
<div>收益走势</div>
</template>
<el-row :gutter="20">
<el-col :span="3" style="border-right: 1px solid #e4e7ed">
<div style="margin-top: 15px">累计收益</div>
<div style="font-size: 28px">4320.00</div>
<div style="margin-top: 100px">本月收益</div>
<div style="font-size: 28px">342.00</div>
<div>
<el-icon color="#f04133">
<caret-bottom />
</el-icon>
<span style="color: #f04133">10%</span>
<span>同比上月</span>
</div>
</el-col>
<el-col :span="21">
<!-- :chart-data="lineChartData3" -->
<div style="margin-left: 20px">近一年收益走势</div>
<LineChart />
</el-col>
</el-row>
</el-card>
</div>
</template>
<script setup>
import LineChart from "./components/LineChart.vue";
</script>
<style lang="scss" scoped>
::v-deep .el-card__header {
padding-top: 0;
padding-bottom: 0;
div {
height: 40px;
line-height: 40px;
}
}
.panel-group {
.card-panel-col {
margin-bottom: 20px;
}
.card-panel {
height: 108px;
cursor: pointer;
font-size: 12px;
position: relative;
overflow: hidden;
color: #666;
border: 1px solid #ccc;
background: #fff;
box-shadow: 4px 4px 40px rgba(0, 0, 0, 0.05);
border-color: rgba(0, 0, 0, 0.05);
&:hover {
.card-panel-icon-wrapper {
color: #fff;
}
.icon-people {
background: #36a3f7;
}
.icon-message {
background: #40c9c6;
}
.icon-money {
background: #36a3f7;
}
.icon-shopping {
background: #34bfa3;
}
}
.icon-people {
color: #36a3f7;
}
.icon-message {
color: #40c9c6;
}
.icon-money {
color: #36a3f7;
}
.icon-shopping {
color: #34bfa3;
}
.card-panel-icon-wrapper {
float: left;
margin: 14px 0 0 14px;
padding: 16px;
transition: all 0.38s ease-out;
border-radius: 6px;
}
.card-panel-icon {
float: left;
font-size: 48px;
}
.card-panel-description {
float: right;
font-weight: bold;
margin: 26px;
margin-left: 0px;
.card-panel-text {
line-height: 18px;
color: rgba(0, 0, 0, 0.45);
font-size: 16px;
margin-bottom: 12px;
}
.card-panel-num {
font-size: 28px;
}
}
}
}
.surplus-currency {
margin-bottom: 20px;
height: 108px;
background-color: #f2f2f2;
padding: 20px 0 0 50px;
}
.card_body {
display: flex;
.card_item {
text-align: center;
margin-right: 50px;
}
}
@media (max-width: 550px) {
.card-panel-description {
display: none;
}
.card-panel-icon-wrapper {
float: none !important;
width: 100%;
height: 100%;
margin: 0 !important;
.svg-icon {
display: block;
margin: 14px auto !important;
float: none !important;
}
}
}
</style>

View File

@ -0,0 +1,3 @@
<template>
<div>release</div>
</template>

View File

@ -0,0 +1,3 @@
<template>
<div>research</div>
</template>

View File

@ -110,7 +110,7 @@ function handlePage(item) {
routeData = router.resolve({ path: "/one" });
} else if (item.id == 2) {
// 专家
routeData = router.resolve({ path: "/two" });
routeData = router.resolve({ path: "/admin" });
} else if (item.id == 4) {
// 研究机构
routeData = router.resolve({ path: "/three" });

View File

@ -88,7 +88,7 @@
</template>
<script setup>
import { getCodeImg } from "@/api/login";
import { getCodeNum } from "@/api/login";
import Cookies from "js-cookie";
import { encrypt, decrypt } from "@/utils/jsencrypt";
import Register from "./register.vue";
@ -156,7 +156,7 @@ function handleLogin() {
}
function getCode() {
getCodeImg().then((res) => {
getCodeNum().then((res) => {
captchaOnOff.value =
res.captchaOnOff === undefined ? true : res.captchaOnOff;
if (captchaOnOff.value) {

View File

@ -1,51 +1,57 @@
<template>
<div class="box conter1000">
<div class="_head">
<div class="_l">
<el-image
style="width: 358px; height: 100%; vertical-align: middle"
:src="state.data.image"
fit="cover"
></el-image>
</div>
<div class="_r">
<p class="_title text_hidden">{{state.data.title }}</p>
<p class="_brief text_hidden">
<!-- 修改样式 -->
活动简介{{state.data.description || '暂无'}}</p>
<p class="_classif">活动分类{{state.data.industry}}</p>
<p class="_time">
活动时间{{ parseTime(state.data.begin_at) }} ~ {{parseTime(state.data.finish_at) }}
</p>
<p class="_place text_hidden">
活动地点{{state.data.address}}
</p>
<p class="_user">
<el-button class="x_btns" disabled>已报名</el-button>
<span class="_num"><span class="x_blue">{{state.data.join_count}}</span> 人报名</span>
</p>
</div>
<div class="_head">
<div class="_l">
<el-image
style="width: 358px; height: 100%; vertical-align: middle"
:src="state.data.image"
fit="cover"
></el-image>
</div>
<div class="_info">
<div class="_l">
<p class="_tit">活动详情</p>
<div class="html" v-html="state.data.content"></div>
</div>
<div class="_r">联系我</div>
<div class="_r">
<p class="_title text_hidden">{{ state.data.title }}</p>
<p class="_brief text_hidden">
<!-- 修改样式 -->
活动简介{{ state.data.description || "暂无" }}
</p>
<p class="_classif">活动分类{{ state.data.industry }}</p>
<p class="_time">
活动时间{{ parseTime(state.data.begin_at) }} ~
{{ parseTime(state.data.finish_at) }}
</p>
<p class="_place text_hidden">活动地点{{ state.data.address }}</p>
<p class="_user">
<el-button class="x_btns" disabled>已报名</el-button>
<span class="_num"
><span class="x_blue">{{ state.data.join_count }}</span>
人报名</span
>
</p>
</div>
</div>
<div class="_info">
<div class="_l">
<p class="_tit">活动详情</p>
<div class="html" v-html="state.data.content"></div>
</div>
<div class="_r">
<webContact />
</div>
</div>
</div>
</template>
<script setup>
import webFooter from "@/components/webFooter/index.vue";
import webBreadcrumb from "@/components/webBreadcrumb/index.vue";
import request from '@/utils/request'
function detail (id) {
import webContact from "@/components/webContact/index.vue";
import request from "@/utils/request";
function detail(id) {
return request({
url: '/v1/activity/detail',
method: 'post',
data: { id }
})
url: "/v1/activity/detail",
method: "post",
data: { id },
});
}
const loading = ref(true);
@ -55,104 +61,107 @@ const state = reactive({
});
const route = useRoute();
watch(route, () => {
getData()
})
getData();
});
onMounted(() => {
getData()
getData();
});
function getData () {
function getData() {
let id = route.params.id;
if (!id) return
detail(id).then(res => {
if (200 == res.code) {
state.data = res.data;
if (!id) return;
detail(id)
.then((res) => {
if (200 == res.code) {
state.data = res.data;
loading.value = false;
}
})
.catch(() => {
loading.value = false;
}
}).catch(() => {
loading.value = false;
})
});
}
</script>
<style lang="scss" scoped>
.box {
._head {
padding: 20px;
background-color: #fff;
display: flex;
._r {
padding-left: 18px;
p {
margin: 11px 0;
}
._title {
font-size: 18px;
font-weight: 500;
color: #333333;
line-height: 30px;
height: 60px;
}
._brief,
._classif,
._time,
._place {
font-size: 14px;
.box {
._head {
padding: 20px;
background-color: #fff;
display: flex;
._r {
padding-left: 18px;
p {
margin: 11px 0;
}
._title {
font-size: 18px;
font-weight: 500;
color: #333333;
line-height: 30px;
height: 60px;
}
._brief,
._classif,
._time,
._place {
font-size: 14px;
font-weight: 400;
color: #666666;
}
._brief,
._place {
line-height: 24px;
height: 48px;
}
._user {
margin-bottom: 0;
display: flex;
align-items: flex-end;
._num {
margin-left: 10px;
font-size: 16px;
font-weight: 400;
color: #666666;
}
._brief, ._place {
line-height: 24px;
height: 48px;
}
._user {
margin-bottom: 0;
display: flex;
align-items: flex-end;
._num {
margin-left: 10px;
font-size: 16px;
font-weight: 400;
color: #666666;
.x_blue {
font-size: 30px;
}
.x_blue {
font-size: 30px;
}
}
}
}
._info {
display: flex;
margin-top: 16px;
margin-bottom: 35px;
._l {
width: 662px;
margin-right: 14px;
padding: 14px 40px 0 20px;
background-color: #fff;
._tit {
&::before {
content: "";
display: inline-block;
margin-right: 5px;
width: 5px;
height: 5px;
background-color: #0054ff;
vertical-align: middle;
}
}
._txt {
margin-bottom: 45px;
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
}
._r {
flex: 1;
background-color: #fff;
}
}
}
._info {
display: flex;
margin-top: 16px;
margin-bottom: 35px;
._l {
width: 662px;
margin-right: 14px;
padding: 14px 40px 0 20px;
background-color: #fff;
._tit {
&::before {
content: "";
display: inline-block;
margin-right: 5px;
width: 5px;
height: 5px;
background-color: #0054ff;
vertical-align: middle;
}
}
._txt {
margin-bottom: 45px;
font-size: 14px;
font-weight: 400;
color: #666666;
line-height: 24px;
}
}
._r {
flex: 1;
background-color: #fff;
}
}
}
</style>

View File

@ -1,11 +1,17 @@
<template>
<div class="box">
<div style="position: absolute; top: 0; left: 50%">
<webReleaseActive
v-model:dialogVisible="dialogVisible"
></webReleaseActive>
</div>
<div class="wrap">
<div class="tit">
<div class="left">科技活动</div>
<div class="right">
<!-- @click="dialogVisible = true" -->
<div class="publish">发布活动</div>
<div class="more">更多</div>
<div class="more" @click="handlePage">更多</div>
</div>
</div>
<div class="content">
@ -25,52 +31,68 @@
</div>
<div class="item">
<div class="img">
<img src="https://t7.baidu.com/it/u=1820929524,3700012367&fm=193&f=GIF" />
<img
src="https://t7.baidu.com/it/u=1820929524,3700012367&fm=193&f=GIF"
/>
</div>
<div class="dess">
<div class="txt">助力工厂公辅系统数字化及节能提效助力工厂公辅系统数字化及节能提效</div>
<div class="txt">
助力工厂公辅系统数字化及节能提效助力工厂公辅系统数字化及节能提效
</div>
<div class="dess1">
<div class="time">活动时间2021-11-01 08:00</div>
<div>1988人已观看</div>
<div class="time">活动时间2021-11-01 08:00</div>
<div>1988人已观看</div>
</div>
<div class="enroll">19.9元报名</div>
</div>
</div>
<div class="item">
<div class="img">
<img src="https://t7.baidu.com/it/u=1820929524,3700012367&fm=193&f=GIF" />
<img
src="https://t7.baidu.com/it/u=1820929524,3700012367&fm=193&f=GIF"
/>
</div>
<div class="dess">
<div class="txt">助力工厂公辅系统数字化及节能提效助力工厂公辅系统数字化及节能提效</div>
<div class="txt">
助力工厂公辅系统数字化及节能提效助力工厂公辅系统数字化及节能提效
</div>
<div class="dess1">
<div class="time">活动时间2021-11-01 08:00</div>
<div>1988人已观看</div>
<div class="time">活动时间2021-11-01 08:00</div>
<div>1988人已观看</div>
</div>
<div class="enroll">19.9元报名</div>
</div>
</div>
<div class="item">
<div class="img">
<img src="https://t7.baidu.com/it/u=1820929524,3700012367&fm=193&f=GIF" />
<img
src="https://t7.baidu.com/it/u=1820929524,3700012367&fm=193&f=GIF"
/>
</div>
<div class="dess">
<div class="txt">助力工厂公辅系统数字化及节能提效助力工厂公辅系统数字化及节能提效</div>
<div class="txt">
助力工厂公辅系统数字化及节能提效助力工厂公辅系统数字化及节能提效
</div>
<div class="dess1">
<div class="time">活动时间2021-11-01 08:00</div>
<div>1988人已观看</div>
<div class="time">活动时间2021-11-01 08:00</div>
<div>1988人已观看</div>
</div>
<div class="enroll">19.9元报名</div>
</div>
</div>
<div class="item">
<div class="img">
<img src="https://t7.baidu.com/it/u=1820929524,3700012367&fm=193&f=GIF" />
<img
src="https://t7.baidu.com/it/u=1820929524,3700012367&fm=193&f=GIF"
/>
</div>
<div class="dess">
<div class="txt">助力工厂公辅系统数字化及节能提效助力工厂公辅系统数字化及节能提效</div>
<div class="txt">
助力工厂公辅系统数字化及节能提效助力工厂公辅系统数字化及节能提效
</div>
<div class="dess1">
<div class="time">活动时间2021-11-01 08:00</div>
<div>1988人已观看</div>
<div class="time">活动时间2021-11-01 08:00</div>
<div>1988人已观看</div>
</div>
<div class="enroll end">已结束</div>
</div>
@ -82,7 +104,13 @@
<script setup lang="ts">
import { defineComponent, onMounted, reactive } from "vue";
import webReleaseActive from "@/components/webReleaseActive/index.vue";
const router = useRouter();
const dialogVisible = ref(false);
function handlePage() {
router.push("/activity");
}
</script>
<style lang="scss" scoped>
@ -152,7 +180,7 @@ import { defineComponent, onMounted, reactive } from "vue";
overflow: hidden;
.txt {
overflow: hidden;
text-overflow:ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
}
.dess1 {
@ -164,17 +192,16 @@ import { defineComponent, onMounted, reactive } from "vue";
width: 90px;
height: 30px;
line-height: 30px;
background: #0054FF;
background: #0054ff;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
text-align: center;
&.end {
background: #B4B4B4;
background: #b4b4b4;
}
}
}
img {
top: 0;

View File

@ -47,52 +47,56 @@
<script setup lang="ts">
import { reactive, onMounted, getCurrentInstance, ref } from "vue";
const { proxy } = getCurrentInstance();
import index1 from './comp/index1.vue';
import index2 from './comp/index2.vue';
import index3 from './comp/index3.vue';
import index4 from './comp/index4.vue';
import index5 from './comp/index5.vue';
import index6 from './comp/index6.vue';
import index7 from './comp/index7.vue';
import index8 from './comp/index8.vue';
import index1 from "./comp/index1.vue";
import index2 from "./comp/index2.vue";
import index3 from "./comp/index3.vue";
import index4 from "./comp/index4.vue";
import index5 from "./comp/index5.vue";
import index6 from "./comp/index6.vue";
import index7 from "./comp/index7.vue";
import index8 from "./comp/index8.vue";
const loading = ref(true);
setTimeout(() => {
loading.value = false;
}, 1000)
}, 1000);
onMounted(() => {
})
function next() { // 往下切换
onMounted(() => {});
function next() {
// 往下切换
let len = 8; // 页面的个数
if (state.fullpage.current + 1 <= len) { // 如果当前页面编号+1 小于总个数,则可以执行向下滑动
if (state.fullpage.current + 1 <= len) {
// 如果当前页面编号+1 小于总个数,则可以执行向下滑动
state.fullpage.current += 1; // 页面+1
move(state.fullpage.current); // 执行切换
}
}
function pre() {// 往上切换
if (state.fullpage.current - 1 > 0) { // 如果当前页面编号-1 大于0则可以执行向下滑动
state.fullpage.current -= 1;// 页面+1
move(state.fullpage.current);// 执行切换
function pre() {
// 往上切换
if (state.fullpage.current - 1 > 0) {
// 如果当前页面编号-1 大于0则可以执行向下滑动
state.fullpage.current -= 1; // 页面+1
move(state.fullpage.current); // 执行切换
}
}
function move(index) {
state.fullpage.isScrolling = true; // 为了防止滚动多页,需要通过一个变量来控制是否滚动
directToMove(index); //执行滚动
setTimeout(() => { //这里的动画是1s执行完使用setTimeout延迟1s后解锁
setTimeout(() => {
//这里的动画是1s执行完使用setTimeout延迟1s后解锁
state.fullpage.isScrolling = false;
}, 1010);
}
function directToMove(index) {
let height = proxy.$refs["fullPage"]['clientHeight']; //获取屏幕的宽度
let scrollPage = proxy.$refs["fullPageContainer"]; // 获取执行tarnsform的元素
let height = proxy.$refs["fullPage"]["clientHeight"]; //获取屏幕的宽度
let scrollPage = proxy.$refs["fullPageContainer"]; // 获取执行tarnsform的元素
let scrollHeight; // 计算滚动的告诉,是往上滚还往下滚
scrollHeight = -(index - 1) * height + "px";
scrollPage.style.transform = `translateY(${scrollHeight})`;
state.fullpage.current = index;
}
function mouseWheelHandle(event) { // 监听鼠标监听
function mouseWheelHandle(event) {
// 监听鼠标监听
// 添加冒泡阻止
let evt = event || window.event;
if (evt.stopPropagation) {
@ -100,7 +104,8 @@ function mouseWheelHandle(event) { // 监听鼠标监听
} else {
evt.returnValue = false;
}
if (state.fullpage.isScrolling) { // 判断是否可以滚动
if (state.fullpage.isScrolling) {
// 判断是否可以滚动
return false;
}
let e = event.originalEvent || event;
@ -113,11 +118,10 @@ function mouseWheelHandle(event) { // 监听鼠标监听
}
let state = reactive({
fullpage: {
current: 1, // 当前的页面编号
isScrolling: false, // 是否在滚动,是为了防止滚动多页,需要通过一个变量来控制是否滚动
deltaY: 0 // 返回鼠标滚轮的垂直滚动量保存的鼠标滚动事件的deleteY,用来判断是往下还是往上滚
deltaY: 0, // 返回鼠标滚轮的垂直滚动量保存的鼠标滚动事件的deleteY,用来判断是往下还是往上滚
},
showBox: 0,
boxList: [
@ -136,26 +140,26 @@ let state = reactive({
zIndex: 1,
title: "index3",
},
// {
// comp: index4,
// zIndex: 1,
// title: "index4",
// },
// {
// comp: index5,
// zIndex: 1,
// title: "index5",
// },
// {
// comp: index6,
// zIndex: 1,
// title: "index6",
// },
// {
// comp: index7,
// zIndex: 1,
// title: "index7",
// },
{
comp: index4,
zIndex: 1,
title: "index4",
},
{
comp: index5,
zIndex: 1,
title: "index5",
},
{
comp: index6,
zIndex: 1,
title: "index6",
},
{
comp: index7,
zIndex: 1,
title: "index7",
},
{
comp: index8,
zIndex: 1,
@ -167,9 +171,6 @@ let state = reactive({
out: "animate__animated animate__fadeOutDown",
},
});
</script>
<style lang="scss" scoped>

View File

@ -8,7 +8,9 @@
v-for="item in state.kind"
:key="item.id"
@click="handleActive(item.id, item.title)"
>{{ item.title }}</div>
>
{{ item.title }}
</div>
</div>
<div class="_r">
<div style="width: 70%">
@ -23,7 +25,11 @@
<div class="_info">
<p class="text_hidden">{{ item.title }}</p>
<div class="_tags">
<el-tag class="x_fff x_bg_blue">{{ item.description }}</el-tag>
<el-tooltip :content="item.description" placement="top">
<el-tag class="x_fff x_bg_blue">{{
item.description
}}</el-tag>
</el-tooltip>
</div>
</div>
<div class="_detail" @click="handleDetail(item.id)">查看详情</div>
@ -46,85 +52,93 @@
<script setup>
import webFooter from "@/components/webFooter/index.vue";
import request from '@/utils/request'
import request from "@/utils/request";
const router = useRouter();
const loading = ref(true);
const listLoading = ref(true);
const state = reactive({
kind: [],
kindId: '',
kindId: "",
list: [],
pageNum: 1,
total: 1,
pageSize: 9,
pageSizes: [9, 9 << 1, 9 << 2, 9 << 3],
pageSizes: [9, 9 << 1, 9 << 2, 9 << 3],
title: "",
});
function kind () {
function kind() {
return request({
url: '/v1/service/innovate/kind',
method: 'get',
})
url: "/v1/service/innovate/kind",
method: "get",
});
}
function innovate () {
function innovate() {
return request({
url: '/v1/service/innovate',
method: 'post',
data: { kind_id: state.kindId, page_num: state.pageNum, page_size: state.pageSize, title: state.title }
})
url: "/v1/service/innovate",
method: "post",
data: {
kind_id: state.kindId,
page_num: state.pageNum,
page_size: state.pageSize,
title: state.title,
},
});
}
function getDataList () {
function getDataList() {
listLoading.value = true;
innovate().then(res => {
if (200 == res.code) {
state.total = res.data.count;
state.list = res.data.data;
innovate()
.then((res) => {
if (200 == res.code) {
state.total = res.data.count;
state.list = res.data.data;
listLoading.value = false;
}
})
.catch(() => {
listLoading.value = false;
}
}).catch(() => {
listLoading.value = false;
})
});
}
onMounted(() => {
init();
});
function init () {
function init() {
loading.value = true;
kind().then(res => {
if (200 == res.code) {
state.kind = res.data;
if (res.data.length > 0) {
state.kindId = res.data[0].id;
getDataList();
kind()
.then((res) => {
if (200 == res.code) {
state.kind = res.data;
if (res.data.length > 0) {
state.kindId = res.data[0].id;
getDataList();
}
loading.value = false;
}
})
.catch(() => {
loading.value = false;
}
}).catch(() => {
loading.value = false;
})
});
}
function handleDetail (id) {
function handleDetail(id) {
let routeData = router.resolve({ path: `/innovate/detail/${id}` });
window.open(routeData.href, '_blank');
window.open(routeData.href, "_blank");
}
function handleActive (id, title) {
function handleActive(id, title) {
state.kindId = id;
state.pageNum = 1;
state.title = "";
getDataList();
}
function handleQuery () {
function handleQuery() {
state.pageNum = 1;
getDataList();
}
</script>
<style lang="scss" scoped>
@ -201,6 +215,8 @@ function handleQuery () {
margin: 10px 0 0;
.el-tag {
font-size: 14px;
width: 100%;
overflow: hidden;
}
}
}

View File

@ -1,162 +1,172 @@
<template>
<div class="box">
<div class="wrap">
<div class="img">
<!-- <img :src="data.image" alt /> -->
<img src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF" />
</div>
<div class="content">
<div class="tit">
<span style="cursor: pointer;" @click="handleDetail(data.id)">姓名{{ data.name }}</span>
<div>
<span style="vertical-align: middle;">匹配度</span>
<el-rate style="display: inline-block" v-model="state.val" disabled></el-rate>
</div>
</div>
<!-- <div class="labelList">
<div class="box">
<div class="wrap">
<div class="img">
<!-- <img :src="data.image" alt /> -->
<el-image :src="data.image" fit="fill"></el-image>
</div>
<div class="content">
<div class="tit">
<span style="cursor: pointer" @click="handleDetail(data.id)"
>姓名{{ data.name }}</span
>
<div>
<span style="vertical-align: middle">匹配度</span>
<el-rate
style="display: inline-block"
v-model="state.val"
disabled
></el-rate>
</div>
</div>
<!-- <div class="labelList">
<div v-for="item in data.industrys">{{ item }}</div>
</div>-->
<div v-if="data.industrys" class="line">
所属领域
<span>{{ data.industrys[data.industrys.length - 1] }}</span>
</div>
<div class="line">
所在机构
<span>{{ data.research_name }}</span>
</div>
<div
v-if="data.patent_title"
class="line"
v-for="(patent_title,index) in data.patent_title"
:key="index"
>{{ patent_title }}</div>
</div>
<div class="keywordsWrap">
<div class="keywords">
<wordcloud v-if="data.keywords" :data="createdData(data.keywords)"></wordcloud>
</div>
</div>
<div v-if="data.industrys" class="line">
所属领域
<span>{{ data.industrys[data.industrys.length - 1] }}</span>
</div>
<slot></slot>
<div class="line">
所在机构
<span>{{ data.research_name }}</span>
</div>
<div
v-if="data.patent_title"
class="line"
v-for="(patent_title, index) in data.patent_title"
:key="index"
>
{{ patent_title }}
</div>
</div>
<div class="keywordsWrap">
<div class="keywords">
<wordcloud
v-if="data.keywords"
:data="createdData(data.keywords)"
></wordcloud>
</div>
</div>
</div>
<slot></slot>
</div>
</template>
<script setup>
import wordcloud from './wordcloud.vue'
import wordcloud from "./wordcloud.vue";
const router = useRouter();
import collectAndVisit from './collectAndVisit.vue'
import collectAndVisit from "./collectAndVisit.vue";
const props = defineProps({
data: {
type: Object,
required: true,
},
data: {
type: Object,
required: true,
},
});
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/4/detail/${id}` });
window.open(routeData.href, '_blank');
function handleDetail(id) {
let routeData = router.resolve({ path: `/searchList/4/detail/${id}` });
window.open(routeData.href, "_blank");
}
const state = reactive({
val: 3,
val: 3,
});
function createdData (arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e => {
l.push({ name: e, value: 30 })
return { name: e, value: 30 }
})
return l;
function createdData(arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr));
snap.map((e) => {
l.push({ name: e, value: 30 });
return { name: e, value: 30 };
});
return l;
}
</script>
<style lang="scss" scoped>
.box {
width: 100%;
background: #ffffff;
padding: 20px;
box-sizing: border-box;
.wrap {
display: flex;
flex-direction: row;
.img {
width: 90px;
margin-right: 12px;
margin-right: 10px;
display: flex;
align-items: center;
justify-content: center;
img {
width: 90px;
height: 90px;
border-radius: 50%;
}
}
.keywordsWrap {
display: flex;
align-items: center;
justify-content: center;
}
.keywords {
width: 129px;
height: 129px;
}
.content {
flex: 1;
overflow: hidden;
.labelList {
overflow: hidden;
div {
padding: 2px 4px;
float: left;
background: #0054ff;
border-radius: 4px;
margin-right: 5px;
margin-bottom: 5px;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #ffffff;
}
}
.line {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin: 10px 0;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
}
}
.tit {
overflow: hidden;
display: flex;
& > span {
flex: 1;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
overflow: hidden;
}
& > div {
width: 175px;
vertical-align: middle;
}
}
}
width: 100%;
background: #ffffff;
padding: 20px;
box-sizing: border-box;
.wrap {
display: flex;
flex-direction: row;
.img {
width: 90px;
margin-right: 12px;
margin-right: 10px;
display: flex;
align-items: center;
justify-content: center;
.el-image {
width: 90px;
height: 90px;
border-radius: 50%;
}
}
.keywordsWrap {
display: flex;
align-items: center;
justify-content: center;
}
.keywords {
width: 129px;
height: 129px;
}
.content {
flex: 1;
overflow: hidden;
.labelList {
overflow: hidden;
div {
padding: 2px 4px;
float: left;
background: #0054ff;
border-radius: 4px;
margin-right: 5px;
margin-bottom: 5px;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #ffffff;
}
}
.line {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin: 10px 0;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
}
}
.tit {
overflow: hidden;
display: flex;
& > span {
flex: 1;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
overflow: hidden;
}
& > div {
width: 175px;
vertical-align: middle;
}
}
}
}
}
</style>

View File

@ -1,10 +1,14 @@
<template>
<div class="index">
<searchContainer bannerKey="首页>企业库" title="企业库" @handleQuery="handleQuery">
<searchContainer
bannerKey="首页>企业库>企业列表"
title="企业库"
@handleQuery="handleQuery"
>
<template v-slot>
<el-row type="flex" style="padding: 20px 0;">
<el-row type="flex" style="padding: 20px 0">
<div style="flex: 1">
<div style="position: relative;">
<div style="position: relative">
<industrySelect @industryChange="industryChange"></industrySelect>
<div class="total">
共找到
@ -12,28 +16,37 @@
</div>
<div v-loading="loading">
<div class="item" v-for="item in state.list" :key="item.id">
<el-row type="flex" style="padding: 40px 20px;">
<el-row type="flex" style="padding: 40px 20px">
<div class="img">
<!-- <img :src="item.image" alt /> -->
<img src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF" alt />
<img
src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF"
alt
/>
</div>
<div class="content">
<div class="tit" @click="handleDetail(item.id)">
<div style="float: right;">
<div class="tit" @click="handleDetail(item.id)">
<div style="float: right">
<span>匹配度</span>
<el-rate style="display: inline-block" v-model="state.val" disabled></el-rate>
<el-rate
style="display: inline-block"
v-model="state.val"
disabled
></el-rate>
</div>
<div class="text" style="flex: 1">{{ item.name }}</div>
</div>
<div class="line">
企业规模 <span>{{item.kind_title}}</span>
企业规模 <span>{{ item.kind_title }}</span>
</div>
<div class="line">
核心产品及应用场景 <span>{{item.product}}</span>
核心产品及应用场景 <span>{{ item.product }}</span>
</div>
<div class="line">
企业网站 <a :href="item.url"><span>{{item.url}}</span></a>
企业网站
<a :href="item.url"
><span>{{ item.url }}</span></a
>
</div>
</div>
<div class="keywords" style="flex: 1">
@ -63,16 +76,19 @@
<script setup>
import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request'
import request from "@/utils/request";
const router = useRouter();
import { onMounted } from 'vue';
import searchContainer from './components/searchContainer.vue'
import industrySelect from './components/industrySelect.vue'
import wordcloud from './components/wordcloud.vue'
import { onMounted } from "vue";
import searchContainer from "./components/searchContainer.vue";
import industrySelect from "./components/industrySelect.vue";
import wordcloud from "./components/wordcloud.vue";
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: {keyword: state.keyword}});
window.open(routeData.href, '_blank');
function handleDetail(id) {
let routeData = router.resolve({
path: `/searchList/0/detail/${id}`,
query: { keyword: state.keyword },
});
window.open(routeData.href, "_blank");
}
const loading = ref(true);
@ -81,33 +97,35 @@ const state = reactive({
total: 1,
pageSize: 10,
pageSizes: [10, 10 << 1, 10 << 2, 10 << 3],
keyword: '',
keyword: "",
industryList: [],
id1: '',
id2: '',
id3: '',
id1: "",
id2: "",
id3: "",
val: 3,
arr: [{
"name": "Cat",
"value": 26
},
{
"name": "fish",
"value": 19
}]
arr: [
{
name: "Cat",
value: 26,
},
{
name: "fish",
value: 19,
},
],
});
function createdData(arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e=>{
l.push({name: e,value: 30})
return {name: e,value: 30}
})
let snap = JSON.parse(JSON.stringify(arr));
snap.map((e) => {
l.push({ name: e, value: 30 });
return { name: e, value: 30 };
});
return l;
}
function search () {
let industry = '';
function search() {
let industry = "";
if (state.id1) {
industry += state.id1;
}
@ -118,19 +136,23 @@ function search () {
industry += `-${state.id3}`;
}
return request({
url: '/v1/search',
method: 'post',
data: { industry, mode: 1, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword }
})
url: "/v1/search",
method: "post",
data: {
industry,
mode: 1,
page_num: state.pageNum,
page_size: state.pageSize,
keyword: state.keyword,
},
});
}
function handleQuery (keyword) {
function handleQuery(keyword) {
state.keyword = keyword;
getDataList()
getDataList();
}
function industryChange (industry) {
function industryChange(industry) {
if (industry.id1) {
state.id1 = industry.id1;
}
@ -140,23 +162,24 @@ function industryChange (industry) {
if (industry.id3) {
state.id3 = industry.id3;
}
getDataList()
getDataList();
}
function getDataList () {
function getDataList() {
loading.value = true;
search().then(res => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
search()
.then((res) => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
loading.value = false;
}
})
.catch(() => {
loading.value = false;
}
}).catch(() => {
loading.value = false;
})
});
}
</script>
<style lang="scss" scoped>
@ -189,9 +212,9 @@ function getDataList () {
.img {
width: 90px;
margin-right: 12px;
display: flex;
align-items:center;
justify-content:center;
display: flex;
align-items: center;
justify-content: center;
img {
width: 90px;
height: 90px;
@ -208,13 +231,12 @@ function getDataList () {
color: #666666;
margin: 10px 0;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
}
}
}
.keywords {
flex: 1;

View File

@ -1,403 +1,420 @@
<template>
<div v-loading="loading">
<searchContainer bannerKey="首页>企业库" title="企业库" @handleQuery="handleQuery">
<template v-slot>
<div class="head">
<el-breadcrumb separator="/">
<el-breadcrumb-item>
<span class="one">找企业</span>
</el-breadcrumb-item>
<el-breadcrumb-item>
<span>企业详情</span>
</el-breadcrumb-item>
</el-breadcrumb>
<div v-loading="loading">
<searchContainer
bannerKey="首页>企业库>企业详情"
title="企业库"
@handleQuery="handleQuery"
>
<template v-slot>
<div class="head">
<el-breadcrumb separator="/">
<el-breadcrumb-item>
<span class="one">找企业</span>
</el-breadcrumb-item>
<el-breadcrumb-item>
<span>企业详情</span>
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<el-row type="flex">
<div style="flex: 1">
<div class="item">
<el-row type="flex" style="padding: 40px 20px">
<div class="img">
<!-- <img :src="state.companyDetail.image" alt /> -->
<img
src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF"
alt
/>
</div>
<el-row type="flex">
<div style="flex: 1">
<div class="item">
<el-row type="flex" style="padding: 40px 20px;">
<div class="img">
<!-- <img :src="state.companyDetail.image" alt /> -->
<img
src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF"
alt
/>
</div>
<div class="content">
<div class="tit">
<div style="float: right;">
<span>匹配度</span>
<el-rate
style="display: inline-block"
v-model="state.val"
disabled
></el-rate>
</div>
<div
class="text"
style="flex: 1"
>{{ state.companyDetail.name }}</div>
</div>
<div class="line">
企业规模:
<span>{{ state.companyDetail.introduce }}</span>
</div>
<div class="line">
核心产品及应用场景:
<span>{{ state.companyDetail.product }}</span>
</div>
<div class="line">
企业网站:
<a :href="state.companyDetail.url">
<span>{{ state.companyDetail.url }}</span>
</a>
</div>
</div>
<div class="keywords" style="flex: 1">
<wordcloud
v-if="state.companyDetail.keywords"
:data="createdData(state.companyDetail.keywords)"
></wordcloud>
</div>
<div class="btns">
<div class="order">预约对接</div>
<div class="share">一键分享</div>
</div>
</el-row>
</div>
<div class="product">
<div style="padding: 20px 0;">
<div class="pointTit">企业简介</div>
</div>
<div class="html" v-html="state.companyDetail.introduce"></div>
<div style="padding: 20px 0;">
<div class="pointTit">生产方向</div>
</div>
<section v-if="state.companyDetail.directions">
<div v-for="item in state.companyDetail.directions" class="describe">{{state.companyDetail.introduce}}</div>
</section>
<div style="padding: 20px 0;">
<div class="pointTit">产品列表</div>
</div>
<section v-for="item in state.companyProduct" :key="item.id">
<div style="border: 1px solid #DCDCDC;margin-bottom: 10px;">
<productItem :data="item"></productItem>
</div>
</section>
</div>
<div style="padding: 20px 0;">
<div class="pointTit">企业推荐</div>
</div>
<div>
<div class="item" v-for="item in state.list" :key="item.id">
<el-row type="flex" style="padding: 40px 20px;">
<div class="img">
<!-- <img :src="item.image" alt /> -->
<img
src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF"
alt
/>
</div>
<div class="content">
<div class="tit" @click="handleDetail(item.id)">
<div style="float: right;">
<span>匹配度</span>
<el-rate
style="display: inline-block"
v-model="state.val"
disabled
></el-rate>
</div>
<div
class="text"
style="flex: 1"
>{{ item.name.repeat(10) }}</div>
</div>
<div class="line">
企业规模
<span>{{ item.kind_title }}</span>
</div>
<div class="line">
核心产品及应用场景
<span>{{ item.product }}</span>
</div>
<div class="line">
企业网站
<a :href="item.url">
<span>{{ item.url }}</span>
</a>
</div>
</div>
<div class="keywords" style="flex: 1">
<wordcloud :data="createdData(item.keywords)"></wordcloud>
</div>
</el-row>
</div>
</div>
<div class="content">
<div class="tit">
<div style="float: right">
<span>匹配度</span>
<el-rate
style="display: inline-block"
v-model="state.val"
disabled
></el-rate>
</div>
<div class="r"><webContact /></div>
<div class="text" style="flex: 1">
{{ state.companyDetail.name }}
</div>
</div>
<div class="line">
企业规模:
<span>{{ state.companyDetail.introduce }}</span>
</div>
<div class="line">
核心产品及应用场景:
<span>{{ state.companyDetail.product }}</span>
</div>
<div class="line">
企业网站:
<a :href="state.companyDetail.url">
<span>{{ state.companyDetail.url }}</span>
</a>
</div>
</div>
<div class="keywords" style="flex: 1">
<wordcloud
v-if="state.companyDetail.keywords"
:data="createdData(state.companyDetail.keywords)"
></wordcloud>
</div>
<div class="btns">
<div class="order">预约对接</div>
<div class="share">一键分享</div>
</div>
</el-row>
</div>
<div class="product">
<div style="padding: 20px 0">
<div class="pointTit">企业简介</div>
</div>
<div class="html" v-html="state.companyDetail.introduce"></div>
<div style="padding: 20px 0">
<div class="pointTit">生产方向</div>
</div>
<section v-if="state.companyDetail.directions">
<div
v-for="item in state.companyDetail.directions"
class="describe"
>
{{ state.companyDetail.introduce }}
</div>
</section>
<div style="padding: 20px 0">
<div class="pointTit">产品列表</div>
</div>
<section v-for="item in state.companyProduct" :key="item.id">
<div style="border: 1px solid #dcdcdc; margin-bottom: 10px">
<productItem :data="item"></productItem>
</div>
</section>
</div>
<div style="padding: 20px 0">
<div class="pointTit">企业推荐</div>
</div>
<div>
<div class="item" v-for="item in state.list" :key="item.id">
<el-row type="flex" style="padding: 40px 20px">
<div class="img">
<!-- <img :src="item.image" alt /> -->
<img
src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF"
alt
/>
</div>
<div class="content">
<div class="tit" @click="handleDetail(item.id)">
<div style="float: right">
<span>匹配度</span>
<el-rate
style="display: inline-block"
v-model="state.val"
disabled
></el-rate>
</div>
<div class="text" style="flex: 1">
{{ item.name.repeat(10) }}
</div>
</div>
<div class="line">
企业规模
<span>{{ item.kind_title }}</span>
</div>
<div class="line">
核心产品及应用场景
<span>{{ item.product }}</span>
</div>
<div class="line">
企业网站
<a :href="item.url">
<span>{{ item.url }}</span>
</a>
</div>
</div>
<div class="keywords" style="flex: 1">
<wordcloud :data="createdData(item.keywords)"></wordcloud>
</div>
</el-row>
</template>
</searchContainer>
</div>
</div>
</div>
</div>
<div class="r"><webContact /></div>
</el-row>
</template>
</searchContainer>
</div>
</template>
<script setup>
import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request'
import request from "@/utils/request";
const router = useRouter();
const route = useRoute();
import { onMounted } from 'vue';
import searchContainer from './components/searchContainer.vue'
import wordcloud from './components/wordcloud.vue'
import productItem from './components/productItem.vue'
import { onMounted } from "vue";
import searchContainer from "./components/searchContainer.vue";
import wordcloud from "./components/wordcloud.vue";
import productItem from "./components/productItem.vue";
const loading = ref(true);
const state = reactive({
pageNum: 1,
pageSize: 4,
keyword: '',
val: 3,
companyDetail: {},
companyProduct: [],
arr: [{
"name": "Cat",
"value": 26
pageNum: 1,
pageSize: 4,
keyword: "",
val: 3,
companyDetail: {},
companyProduct: [],
arr: [
{
name: "Cat",
value: 26,
},
{
"name": "fish",
"value": 19
}]
name: "fish",
value: 19,
},
],
});
// 建议 列表前4条
function recommend () {
return request({
url: '/v1/search',
method: 'post',
data: { mode: 1, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword }
})
function recommend() {
return request({
url: "/v1/search",
method: "post",
data: {
mode: 1,
page_num: state.pageNum,
page_size: state.pageSize,
keyword: state.keyword,
},
});
}
// 公司详情
function company (id) {
return request({
url: '/v1/manage/company',
method: 'post',
data: { company_id: id }
})
function company(id) {
return request({
url: "/v1/manage/company",
method: "post",
data: { company_id: id },
});
}
function companyProduct (id) {
return request({
url: '/v1/manage/company/product',
method: 'post',
data: { company_id: id, page_num: 1, page_size: 10, }
})
function companyProduct(id) {
return request({
url: "/v1/manage/company/product",
method: "post",
data: { company_id: id, page_num: 1, page_size: 10 },
});
}
function createdData (arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e => {
l.push({ name: e, value: 30 })
return { name: e, value: 30 }
})
return l;
function createdData(arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr));
snap.map((e) => {
l.push({ name: e, value: 30 });
return { name: e, value: 30 };
});
return l;
}
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: { keyword: state.keyword } });
window.open(routeData.href, '_blank');
function handleDetail(id) {
let routeData = router.resolve({
path: `/searchList/0/detail/${id}`,
query: { keyword: state.keyword },
});
window.open(routeData.href, "_blank");
}
function handleList (mode, keyword) {
router.push({ path: `/searchList/${mode}`, query: { keyword } });
function handleList(mode, keyword) {
router.push({ path: `/searchList/${mode}`, query: { keyword } });
}
// 首次加载数据,其后跳转页面
let flag = true;
function handleQuery (keyword) {
state.keyword = keyword;
if (flag) {
getDataList();
flag = false;
} else {
handleList(0, keyword);
}
function handleQuery(keyword) {
state.keyword = keyword;
if (flag) {
getDataList();
flag = false;
} else {
handleList(0, keyword);
}
}
function getDataList () {
loading.value = true;
recommend().then(res => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
}
})
let id = route.params.id;
if (!id) return
company(id).then(res => {
if (200 == res.code) {
state.companyDetail = res.data;
loading.value = false;
}
}).catch(() => {
function getDataList() {
loading.value = true;
recommend().then((res) => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
}
});
let id = route.params.id;
if (!id) return;
company(id)
.then((res) => {
if (200 == res.code) {
state.companyDetail = res.data;
loading.value = false;
});
companyProduct(id).then(res => {
if (200 == res.code) {
state.companyProduct = res.data.data;
}
}
})
.catch(() => {
loading.value = false;
});
companyProduct(id).then((res) => {
if (200 == res.code) {
state.companyProduct = res.data.data;
}
});
}
</script>
<style lang="scss" scoped>
.head {
padding: 15px 0px;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
}
.one {
color: #333333;
}
padding: 15px 0px;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
}
.one {
color: #333333;
}
}
.r {
display: inline-block;
width: 325px;
margin-left: 14px;
min-height: 200px;
display: inline-block;
width: 325px;
margin-left: 14px;
min-height: 200px;
}
.product {
width: 661px;
box-sizing: border-box;
padding: 20px;
background: #fff;
.describe {
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin-bottom: 5px;
}
width: 661px;
box-sizing: border-box;
padding: 20px;
background: #fff;
.describe {
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin-bottom: 5px;
}
}
.pointTit {
position: relative;
padding-left: 10px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333333;
&:before {
content: "";
top: 8px;
left: 0px;
position: absolute;
display: block;
width: 5px;
height: 5px;
background: #0054ff;
}
position: relative;
padding-left: 10px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333333;
&:before {
content: "";
top: 8px;
left: 0px;
position: absolute;
display: block;
width: 5px;
height: 5px;
background: #0054ff;
}
}
.item {
overflow: hidden;
background-color: #fff;
margin-bottom: 16px;
.btns {
overflow: hidden;
background-color: #fff;
margin-bottom: 16px;
padding-top: 20px;
width: 100%;
.btns {
overflow: hidden;
padding-top: 20px;
width: 100%;
div {
text-align: center;
float: right;
cursor: pointer;
user-select: none;
width: 101px;
height: 36px;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 36px;
box-sizing: border-box;
&:hover {
opacity: 0.7;
}
}
.share {
color: #333333;
background: #f2f6ff;
border: 1px solid #dcdcdc;
margin-right: 10px;
}
.order {
background: #0054ff;
color: #ffffff;
border: none;
}
}
div {
text-align: center;
float: right;
cursor: pointer;
user-select: none;
width: 101px;
height: 36px;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 36px;
box-sizing: border-box;
&:hover {
opacity: 0.7;
}
}
.share {
color: #333333;
background: #f2f6ff;
border: 1px solid #dcdcdc;
margin-right: 10px;
}
.order {
background: #0054ff;
color: #ffffff;
border: none;
}
.img {
width: 90px;
margin-right: 12px;
display: flex;
align-items: center;
justify-content: center;
img {
width: 90px;
height: 90px;
border-radius: 50%;
}
}
.content {
display: inline-block;
width: 390px;
.line {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin: 10px 0;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
}
}
}
.keywords {
flex: 1;
width: 129px;
height: 129px;
}
.tit {
width: 100%;
overflow: hidden;
cursor: pointer;
.text {
margin-right: 200px;
overflow: hidden;
.img {
width: 90px;
margin-right: 12px;
display: flex;
align-items: center;
justify-content: center;
img {
width: 90px;
height: 90px;
border-radius: 50%;
}
}
.content {
display: inline-block;
width: 390px;
.line {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin: 10px 0;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
}
}
}
.keywords {
flex: 1;
width: 129px;
height: 129px;
}
.tit {
width: 100%;
overflow: hidden;
cursor: pointer;
.text {
margin-right: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
}
text-overflow: ellipsis;
white-space: nowrap;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
}
}
}
</style>

View File

@ -1,10 +1,14 @@
<template>
<div class="index">
<searchContainer bannerKey="首页>找成果" title="成果库" @handleQuery="handleQuery">
<searchContainer
bannerKey="首页>成果库>成果列表"
title="成果库"
@handleQuery="handleQuery"
>
<template v-slot>
<el-row type="flex" style="padding: 20px 0;">
<el-row type="flex" style="padding: 20px 0">
<div style="flex: 1">
<div style="position: relative;">
<div style="position: relative">
<industrySelect @industryChange="industryChange"></industrySelect>
<div class="total">
共找到
@ -12,28 +16,37 @@
</div>
<div v-loading="loading">
<div class="item" v-for="item in state.list" :key="item.id">
<el-row type="flex" style="padding: 40px 20px;">
<el-row type="flex" style="padding: 40px 20px">
<div class="img">
<!-- <img :src="item.image" alt /> -->
<img src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF" alt />
<img
src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF"
alt
/>
</div>
<div class="content">
<div class="tit" @click="handleDetail(item.id)">
<div style="float: right;">
<div class="tit" @click="handleDetail(item.id)">
<div style="float: right">
<span>匹配度</span>
<el-rate style="display: inline-block" v-model="state.val" disabled></el-rate>
<el-rate
style="display: inline-block"
v-model="state.val"
disabled
></el-rate>
</div>
<div class="text" style="flex: 1">{{ item.name }}</div>
</div>
<div class="line">
企业规模 <span>{{item.kind_title}}</span>
企业规模 <span>{{ item.kind_title }}</span>
</div>
<div class="line">
核心产品及应用场景 <span>{{item.product}}</span>
核心产品及应用场景 <span>{{ item.product }}</span>
</div>
<div class="line">
企业网站 <a :href="item.url"><span>{{item.url}}</span></a>
企业网站
<a :href="item.url"
><span>{{ item.url }}</span></a
>
</div>
</div>
<div class="keywords" style="flex: 1">
@ -63,16 +76,19 @@
<script setup>
import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request'
import request from "@/utils/request";
const router = useRouter();
import { onMounted } from 'vue';
import searchContainer from './components/searchContainer.vue'
import industrySelect from './components/industrySelect.vue'
import wordcloud from './components/wordcloud.vue'
import { onMounted } from "vue";
import searchContainer from "./components/searchContainer.vue";
import industrySelect from "./components/industrySelect.vue";
import wordcloud from "./components/wordcloud.vue";
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: {keyword: state.keyword}});
window.open(routeData.href, '_blank');
function handleDetail(id) {
let routeData = router.resolve({
path: `/searchList/0/detail/${id}`,
query: { keyword: state.keyword },
});
window.open(routeData.href, "_blank");
}
const loading = ref(true);
@ -81,33 +97,35 @@ const state = reactive({
total: 1,
pageSize: 10,
pageSizes: [10, 10 << 1, 10 << 2, 10 << 3],
keyword: '',
keyword: "",
industryList: [],
id1: '',
id2: '',
id3: '',
id1: "",
id2: "",
id3: "",
val: 3,
arr: [{
"name": "Cat",
"value": 26
},
{
"name": "fish",
"value": 19
}]
arr: [
{
name: "Cat",
value: 26,
},
{
name: "fish",
value: 19,
},
],
});
function createdData(arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e=>{
l.push({name: e,value: 30})
return {name: e,value: 30}
})
let snap = JSON.parse(JSON.stringify(arr));
snap.map((e) => {
l.push({ name: e, value: 30 });
return { name: e, value: 30 };
});
return l;
}
function search () {
let industry = '';
function search() {
let industry = "";
if (state.id1) {
industry += state.id1;
}
@ -118,19 +136,23 @@ function search () {
industry += `-${state.id3}`;
}
return request({
url: '/v1/search',
method: 'post',
data: { industry, mode: 2, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword }
})
url: "/v1/search",
method: "post",
data: {
industry,
mode: 2,
page_num: state.pageNum,
page_size: state.pageSize,
keyword: state.keyword,
},
});
}
function handleQuery (keyword) {
function handleQuery(keyword) {
state.keyword = keyword;
getDataList()
getDataList();
}
function industryChange (industry) {
function industryChange(industry) {
if (industry.id1) {
state.id1 = industry.id1;
}
@ -140,23 +162,27 @@ function industryChange (industry) {
if (industry.id3) {
state.id3 = industry.id3;
}
getDataList()
getDataList();
}
function getDataList () {
function getDataList() {
loading.value = true;
search().then(res => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
search()
.then((res) => {
if (200 == res.code) {
// 总条数
// state.total = res.data.count;
// state.list = res.data.data;
// todo... detail页暂无
state.total = 0;
state.list = [];
loading.value = false;
}
})
.catch(() => {
loading.value = false;
}
}).catch(() => {
loading.value = false;
})
});
}
</script>
<style lang="scss" scoped>
@ -189,9 +215,9 @@ function getDataList () {
.img {
width: 90px;
margin-right: 12px;
display: flex;
align-items:center;
justify-content:center;
display: flex;
align-items: center;
justify-content: center;
img {
width: 90px;
height: 90px;
@ -208,13 +234,12 @@ function getDataList () {
color: #666666;
margin: 10px 0;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
}
}
}
.keywords {
flex: 1;

View File

@ -1,10 +1,14 @@
<template>
<div class="index">
<searchContainer bannerKey="首页>找专家" title="专家库" @handleQuery="handleQuery">
<searchContainer
bannerKey="首页>专家库>专家列表"
title="专家库"
@handleQuery="handleQuery"
>
<template v-slot>
<el-row type="flex" style="padding: 20px 0;">
<el-row type="flex" style="padding: 20px 0">
<div style="flex: 1">
<div style="position: relative;">
<div style="position: relative">
<industrySelect @industryChange="industryChange"></industrySelect>
<div class="total">
共找到
@ -12,7 +16,7 @@
</div>
<div v-loading="loading">
<section v-for="item in state.list" :key="item.id">
<expertItem style="width: 661px;" :data="item"></expertItem>
<expertItem style="width: 661px" :data="item"></expertItem>
</section>
</div>
@ -36,17 +40,20 @@
<script setup>
import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request'
import request from "@/utils/request";
const router = useRouter();
import { onMounted } from 'vue';
import searchContainer from './components/searchContainer.vue'
import industrySelect from './components/industrySelect.vue'
import expertItem from './components/expertItem.vue'
import wordcloud from './components/wordcloud.vue'
import { onMounted } from "vue";
import searchContainer from "./components/searchContainer.vue";
import industrySelect from "./components/industrySelect.vue";
import expertItem from "./components/expertItem.vue";
import wordcloud from "./components/wordcloud.vue";
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: {keyword: state.keyword}});
window.open(routeData.href, '_blank');
function handleDetail(id) {
let routeData = router.resolve({
path: `/searchList/0/detail/${id}`,
query: { keyword: state.keyword },
});
window.open(routeData.href, "_blank");
}
const loading = ref(true);
@ -55,33 +62,35 @@ const state = reactive({
total: 1,
pageSize: 10,
pageSizes: [10, 10 << 1, 10 << 2, 10 << 3],
keyword: '',
keyword: "",
industryList: [],
id1: '',
id2: '',
id3: '',
id1: "",
id2: "",
id3: "",
val: 3,
arr: [{
"name": "Cat",
"value": 26
},
{
"name": "fish",
"value": 19
}]
arr: [
{
name: "Cat",
value: 26,
},
{
name: "fish",
value: 19,
},
],
});
function createdData(arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e=>{
l.push({name: e,value: 30})
return {name: e,value: 30}
})
let snap = JSON.parse(JSON.stringify(arr));
snap.map((e) => {
l.push({ name: e, value: 30 });
return { name: e, value: 30 };
});
return l;
}
function search () {
let industry = '';
function search() {
let industry = "";
if (state.id1) {
industry += state.id1;
}
@ -92,19 +101,23 @@ function search () {
industry += `-${state.id3}`;
}
return request({
url: '/v1/search',
method: 'post',
data: { industry, mode: 5, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword }
})
url: "/v1/search",
method: "post",
data: {
industry,
mode: 5,
page_num: state.pageNum,
page_size: state.pageSize,
keyword: state.keyword,
},
});
}
function handleQuery (keyword) {
function handleQuery(keyword) {
state.keyword = keyword;
getDataList()
getDataList();
}
function industryChange (industry) {
function industryChange(industry) {
if (industry.id1) {
state.id1 = industry.id1;
}
@ -114,23 +127,24 @@ function industryChange (industry) {
if (industry.id3) {
state.id3 = industry.id3;
}
getDataList()
getDataList();
}
function getDataList () {
function getDataList() {
loading.value = true;
search().then(res => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
search()
.then((res) => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
loading.value = false;
}
})
.catch(() => {
loading.value = false;
}
}).catch(() => {
loading.value = false;
})
});
}
</script>
<style lang="scss" scoped>
@ -153,5 +167,4 @@ function getDataList () {
min-height: 200px;
background-color: #fff;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@ -1,21 +1,34 @@
<template>
<div class="small" v-loading="loading">
<div class="_title">
<div v-if="!state.banner" style="height: 394px; background-color: #108de9"></div>
<div
v-if="!state.banner"
style="height: 394px; background-color: #108de9"
></div>
<div v-else style="height: 394px">
<img :src="state.banner" style="width: 100%;height: 100%;" alt="banner" />
<img
:src="state.banner"
style="width: 100%; height: 100%"
alt="banner"
/>
</div>
<div v-if="state.caseList.length" class="_li" :class="isFixed ? '_fixed' : ''">
<div
v-if="state.caseList.length"
class="_li"
:class="isFixed ? '_fixed' : ''"
>
<ul class="conter1000">
<li
:class="activeId == item.id ? '_active' : ''"
v-for="(item, index) in state.caseList"
:key="item.id"
@click="setScrollTop(item.id, index)"
>{{ item.title }}</li>
>
{{ item.title }}
</li>
</ul>
</div>
<h2 v-else style="text-align: center; line-height: 100px;">暂无数据</h2>
<h2 v-else style="text-align: center; line-height: 100px">暂无数据</h2>
</div>
<div class="box" v-show="!isShowMore">
<div
@ -25,13 +38,20 @@
:key="index"
:data-id="item.id"
>
<h3 class="_tit text-center" style="font-size: 24px; color: #333333">{{ item.title }}</h3>
<h3 class="_tit text-center" style="font-size: 24px; color: #333333">
{{ item.title }}
</h3>
<div class="_info conter1000">
<div class="_r" v-if="isOddEvenNumber(index)">
<img :src="item.image" alt srcset />
</div>
<div class="_l" :class="isOddEvenNumber(index) ? '_paddingl' : '_paddingr'">
<h3 :class="isOddEvenNumber(index) ? 'text-right' : ''">{{ item.title }}</h3>
<div
class="_l"
:class="isOddEvenNumber(index) ? '_paddingl' : '_paddingr'"
>
<h3 :class="isOddEvenNumber(index) ? 'text-right' : ''">
{{ item.title }}
</h3>
<!-- <p>{{ item.description }}</p> -->
<p>{{ item.description }}</p>
</div>
@ -41,14 +61,24 @@
</div>
<div class="_list conter1400">
<ul>
<li v-for="child in item.children" :key="item.id" @click="handlePath(item.id)">
<el-image style="width: 100%; height: 135px" :src="child.image" fit="cover"></el-image>
<li
v-for="child in item.children"
:key="child.id"
@click="handlePath(child.id)"
>
<el-image
style="width: 100%; height: 135px"
:src="child.image"
fit="cover"
></el-image>
<div class="_head text_hidden">{{ child.title }}</div>
<div class="_detail text_hidden">{{ child.description }}</div>
</li>
</ul>
<div class="_liBtn text-right">
<el-button class="x_btns" @click="handleShowMore(item)">查看更多</el-button>
<el-button class="x_btns" @click="handleShowMore(item)"
>查看更多</el-button
>
</div>
</div>
</div>
@ -65,27 +95,32 @@
import { nextTick, onMounted } from "vue";
import seeMore from "./components/seeMore.vue";
import webFooter from "@/components/webFooter/index.vue";
import request from '@/utils/request'
import request from "@/utils/request";
import { banner } from "@/api/website/home/index";
const router = useRouter();
function handlePath (id) {
let routeData = router.resolve({ path: `/solution/detail/${id}/`});
window.open(routeData.href, '_blank');
function handlePath(id) {
let routeData = router.resolve({ path: `/solution/detail/${id}/` });
window.open(routeData.href, "_blank");
}
function solution_case (mode) {
function solution_case(mode) {
return request({
url: '/v1/service/solution_case',
method: 'post',
data: { mode }
})
url: "/v1/service/solution_case",
method: "post",
data: { mode },
});
}
const loading = ref(true);
const oneLevelTitle = ref({});
const modeDict = { 'small': 101, 'large': 102, 'government': 103, 'scientific': 104 };
const keyDict = { 'small': '解决方案>中小型企业', 'large': '解决方案>大型企业服务', 'government': '解决方案>政府区域服务', 'scientific': '解决方案>政府区域服务' };
const modeDict = { small: 101, large: 102, government: 103, scientific: 104 };
const keyDict = {
small: "解决方案>中小型企业服务",
large: "解决方案>大型企业服务",
government: "解决方案>政府区域服务",
scientific: "解决方案>政府区域服务",
};
const isShowMore = ref(false);
const activeId = ref("");
const itemRefs = [];
@ -96,41 +131,43 @@ const setItemRef = (el) => {
};
const state = reactive({
caseList: [],
banner: ''
banner: "",
});
const scrollTop = ref(0);
const isFixed = ref(false);
const route = useRoute();
watch(route, () => {
init0()
})
init0();
});
onMounted(() => {
init0()
init0();
});
function init0 () {
function init0() {
let name = route.params.name;
if(!name) return
if (!name) return;
let mode = modeDict[name];
let key = keyDict[name];
solution_case(mode).then(res => {
solution_case(mode).then((res) => {
if (200 == res.code) {
state.caseList = res.data
state.caseList = res.data;
init();
}
})
});
loading.value = true;
banner(key).then(res => {
if (200 == res.code) {
state.banner = res.data.images
banner(key)
.then((res) => {
if (200 == res.code) {
state.banner = res.data.images;
loading.value = false;
}
})
.catch(() => {
loading.value = false;
}
}).catch(() => {
loading.value = false;
})
});
}
function init () {
function init() {
if (state.caseList.length) {
activeId.value = state.caseList[0].id;
}
@ -149,7 +186,7 @@ function init () {
});
});
}
function getScroll () {
function getScroll() {
return {
left:
window.pageXOffset ||
@ -163,7 +200,7 @@ function getScroll () {
0,
};
}
function setScrollTop (id, index) {
function setScrollTop(id, index) {
// if (isShowMore.value) return false;
isShowMore.value = false;
nextTick(() => {
@ -174,10 +211,10 @@ function setScrollTop (id, index) {
});
activeId.value = id;
}
function isOddEvenNumber (num) {
function isOddEvenNumber(num) {
return num % 2 == 0 ? false : true;
}
function handleShowMore (item) {
function handleShowMore(item) {
oneLevelTitle.value = item;
window.scrollTo({
top: 0,
@ -250,7 +287,7 @@ function handleShowMore (item) {
}
}
._r {
width: 520px;
width: 420px;
background: #f2f6ff;
img {
width: 100%;