Skip to content

G
GaoQuIncubator
Commit 79a1b887 authored by xinzhedeai's avatar xinzhedeai
Browse files
Options

数据概览-孵化器概况

parent 1b5afb1b
Show whitespace changes
Inline Side-by-side
Showing with 725 additions and 920 deletions
src/api/system/overview.js 0 → 100644
View file @ 79a1b887
import request from '@/utils/request'
export function getData4panel0(data) { // 孵化器概况信息
return request({
url: 'api/incubator/profile?incubatorId='+data.incubatorId,
method: 'get',
})
}
export function getData4tech(data) {
return request({
url: 'api/incubator',
method: 'get',
})
}
export function del(ids) {
return request({
url: 'api/users',
method: 'delete',
data: ids
})
}
export function edit(data) {
return request({
url: 'api/incubator',
method: 'put',
data
})
}
export function add(data) {
return request({
url: 'api/incubator',
method: 'post',
data
})
}
export function editUser(data) {
return request({
url: 'api/users/center',
method: 'put',
data
})
}
export default { getData4panel0, getData4tech, add, edit, del }
src/layout/components/AppMain.vue
View file @ 79a1b887
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
</keep-alive> </keep-alive>
</transition> </transition>
<footer v-if="$route.path!=='/dashboard'" class="page-footer"></footer> <footer v-if="$route.path!=='/dashboard' && $route.path!=='/home/overview'" class="page-footer"></footer>
<!-- <div v-if="$store.state.settings.showFooter" id="el-main-footer"> <!-- <div v-if="$store.state.settings.showFooter" id="el-main-footer">
<span v-html="$store.state.settings.footerTxt" /> <span v-html="$store.state.settings.footerTxt" />
......
src/views/system/home/overview.vue
View file @ 79a1b887
...@@ -20,71 +20,83 @@ ...@@ -20,71 +20,83 @@
</ul> </ul>
</div> </div>
<div class="body"> <div class="bodyer">
<ul class="list"> <ul class="panelsWrapper">
<li class="overview tab_panel_0" v-if="activeIndex === 0"> <li class="overview tab_panel_0" v-if="activeIndex === 0">
<h2>威海高新区创业中心</h2> <h2>{{ data4panel0.incubatorName }}</h2>
<div class="contentWrapper"> <div class="contentWrapper">
<div class="left"> <div class="left">
<div class="item"> <div class="item">
<div class="title"> <div class="_title prefixDiv">
<span class="_left">总收入</span> <span class="_left">总收入</span>
<span class="_right">查看更多>></span> <span class="_right">查看更多>></span>
</div> </div>
<div class="body"> <div class="body">
<div class="_left"> <div class="_left">
<ul> <ul>
<li>孵化器总收入：12342万元</li> <li>孵化器总收入：{{ data4panel0.totalRevenue }}万元</li>
<li>综合服务收入：12342万元</li> <li>
<li>物业费收入：12342万元</li> 综合服务收入：{{ data4panel0.serviceRevenue }}万元
<li>房租费收入：12342万元</li> </li>
<li>投资收入：12342万元</li> <li>物业费收入：{{ data4panel0.propertyRevenue }}万元</li>
<li>政策性收入：12342万元</li> <li>房租费收入：{{ data4panel0.rentRevenue }}万元</li>
<li>其他：12342万元</li> <li>投资收入：{{ data4panel0.investmentRevenue }}万元</li>
<li>政策性收入：{{ data4panel0.policyRevenue }}万元</li>
<li>其他：{{ data4panel0.otherRevenue }}万元</li>
</ul> </ul>
</div> </div>
<div class="_right"> <div class="_right">
<div class="charts pie"></div> <div
ref="pieChart4panel0_1"
style="width: 300px; height: 300px"
class="charts pie"
></div>
</div> </div>
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<div class="title"> <div class="_title prefixDiv">
<span class="_left">总收入</span> <span class="_left">使用面积</span>
<span class="_right">查看更多>></span>
</div> </div>
<div class="body"> <div class="body">
<div class="_left"> <div class="_left">
<ul> <ul>
<li>运营机构:威海高新创业园运营管理有限公司</li> <li>孵化器使用总面积：{{ data4panel0.totalArea }}㎡</li>
<li>联 系人:联系人姓名</li> <li>
<li>联系电话:0631-1234567</li> 用于企业孵化的面积：{{ data4panel0.incubationArea }}㎡
<li>中心位于高新区内，交通便利</li> </li>
<li>剩余孵化面积：{{ data4panel0.remainingArea }}㎡</li>
</ul> </ul>
</div> </div>
<div class="_right"> <div class="_right">
<div class="charts pie"></div> <div
ref="pieChart4panel0_2"
style="width: 300px; height: 300px"
class="charts pie"
></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
<div class="item"> <div class="item">
<div class="title"> <div class="_title prefixDiv">
<span class="_left">简介</span> <span class="_left">简介</span>
<span class="_right">查看更多>></span>
</div> </div>
<div class="body"> <div class="body">
<div class="_top"> <div class="_top">
<ul> <ul>
<li>运营机构:威海高新创业园运营管理有限公司</li> <li>运营机构:{{ data4panel0.operatingAgency }}</li>
<li>联 系人:联系人姓名</li> <li>联 系人:{{ data4panel0.contactPerson }}</li>
<li>联系电话:0631-1234567</li> <li>联系电话:{{ data4panel0.contactPhone }}</li>
<li>中心位于高新区内，交通便利</li> <li>{{}}</li>
</ul> </ul>
</div> </div>
<div class="_bottom"> <div class="_bottom">
<img src="" alt="" /> <img
:src="`${baseAPI}file/${data4panel0.incubatorImage}`"
alt=""
/>
</div> </div>
</div> </div>
</div> </div>
...@@ -111,10 +123,10 @@ ...@@ -111,10 +123,10 @@
</li> </li>
</ul> </ul>
<el-pagination <el-pagination
@current-change="handleCurrentChange" @current-change="handleCurrentChange4panel0"
:current-page="currentPage" :current-page="currentPage4panel0"
:page-size="pageSize" :page-size="pageSize4panel0"
:total="totalItems" :total="totalItems4panel0"
layout="prev, pager, next" layout="prev, pager, next"
/> />
</div> </div>
...@@ -145,7 +157,6 @@ ...@@ -145,7 +157,6 @@
</ul> </ul>
</div> </div>
<div class="_title prefixDiv"> <div class="_title prefixDiv">
<div class="_left">创业创新企业情况</div> <div class="_left">创业创新企业情况</div>
</div> </div>
...@@ -157,7 +168,6 @@ ...@@ -157,7 +168,6 @@
</ul> </ul>
</div> </div>
<div class="_title prefixDiv"> <div class="_title prefixDiv">
<div class="_left">今年企业经营信息</div> <div class="_left">今年企业经营信息</div>
<div class="_right">查看更多>></div> <div class="_right">查看更多>></div>
...@@ -178,13 +188,15 @@ ...@@ -178,13 +188,15 @@
<div class="_body"> <div class="_body">
<dl> <dl>
<dd v-for="item in 10"> <dd v-for="item in 10">
<img src="" alt=""> <img src="" alt="" />
<h3>环境监测设备</h3> <h3>环境监测设备</h3>
<p>内置NB-IoT物联网SIM卡，把数据传 输到晶合云平台或客户私有云平台， 实现数据</p> <p>
内置NB-IoT物联网SIM卡，把数据传
输到晶合云平台或客户私有云平台， 实现数据
</p>
</dd> </dd>
</dl> </dl>
</div> </div>
</div> </div>
</li> </li>
<li class="tab_panel_4" v-if="activeIndex === 40"> <li class="tab_panel_4" v-if="activeIndex === 40">
...@@ -193,7 +205,7 @@ ...@@ -193,7 +205,7 @@
<el-input <el-input
placeholder="请输入姓名搜索" placeholder="请输入姓名搜索"
prefix-icon="el-icon-search" prefix-icon="el-icon-search"
v-model="searchText4teacher" v-model="searchText4panel0"
></el-input> ></el-input>
</div> </div>
<ul> <ul>
...@@ -212,34 +224,33 @@ ...@@ -212,34 +224,33 @@
<el-dialog <el-dialog
title="新增孵化器信息" title="新增孵化器信息"
:visible.sync="dialogVisible" :visible.sync="dialogVisible4panel0"
@close="resetForm" @close="resetForm"
> >
<el-form <el-form
label-width="170px" label-width="170px"
:inline="true" :inline="true"
:model="formInline" :model="formData4panel0"
class="demo-form-inline" class="demo-form-inline"
:label-position="labelPosition"
> >
<el-row> <el-row>
<el-form-item label="孵化器名称"> <el-form-item label="孵化器名称">
<el-input <el-input
v-model="formInline.incubatorName" v-model="formData4panel0.incubatorName"
placeholder="" placeholder=""
size="middle" size="middle"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="运行机构"> <el-form-item label="运行机构">
<el-input <el-input
v-model="formInline.operatingAgency" v-model="formData4panel0.operatingAgency"
placeholder="" placeholder=""
size="middle" size="middle"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="孵化器等级"> <el-form-item label="孵化器等级">
<el-select <el-select
v-model="formInline.incubatorLevel" v-model="formData4panel0.incubatorLevel"
style="width: 200px" style="width: 200px"
size="middle" size="middle"
> >
...@@ -253,409 +264,146 @@ ...@@ -253,409 +264,146 @@
</el-form-item> </el-form-item>
<el-form-item label="联系人"> <el-form-item label="联系人">
<el-input <el-input
v-model="formInline.contactPerson" v-model="formData4panel0.contactPerson"
placeholder="" placeholder=""
size="middle" size="middle"
></el-input> ></el-input>
</el-form-item> </el-form-item>
</el-row> </el-row>
<el-row>
<el-form-item label="联系电话">
<el-input
v-model="formInline.contactPhone"
placeholder=""
size="middle"
></el-input>
</el-form-item>
<el-form-item label="孵化器使用总面积(m²)">
<el-input
v-model="formInline.totalArea"
placeholder=""
size="middle"
></el-input>
</el-form-item>
<el-form-item label="用于企业孵化的面积(m²)">
<el-input
v-model="formInline.incubationArea"
placeholder=""
size="middle"
></el-input>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="孵化器地理位置">
<el-input
v-model="formInline.address"
placeholder=""
size="small"
style="width: 360px"
disabled
></el-input>
<div class="map-ctn" :style="'width:500px;' + 'height:300px' + ';'">
<cu-amap ref="amap" :options="amapOptions()" />
</div>
</el-form-item>
<el-form-item style="margin-left: 80px">
<el-upload
class="upload-demo"
:action="`${baseAPI}api/file/upload?modelName=incubator`"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:on-success="handleSuccess"
:on-error="handleError"
:limit="1"
:on-exceed="handleExceed"
:file-list="fileList"
:show-file-list="false"
style="margin-bottom: 6px"
>
<span
style="margin-right: 5px; margin-left: -17px; font-weight: bold"
>孵化器图片</span
>
<el-button size="mini" type="default">上传图片</el-button>
</el-upload>
<div :style="'width:500px;' + 'height:300px' + ';'">
<div class="imgShowraper">
<img
:src="`${baseAPI}file/${formInline.incubatorImage}`"
alt=""
width="500"
height="300px"
/>
</div>
</div>
</el-form-item>
</el-row>
</el-form> </el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="edit">确 定</el-button>
</div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
var baseAPI = var baseAPI =
process.env.NODE_ENV === "development" process.env.NODE_ENV === "development"
? process.env.VUE_APP_LOCAL_API + "/" ? process.env.VUE_APP_LOCAL_API + "/"
: (VUE_APP_API.ServiceURL || process.env.VUE_APP_LOCAL_API) + "/"; : (VUE_APP_API.ServiceURL || process.env.VUE_APP_LOCAL_API) + "/";
import crudHome from "@/api/system/home"; import overviewApi from "@/api/system/overview.js";
console.log(crudHome); import * as echarts from "echarts";
import IconSelect from "@/components/IconSelect";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { LOAD_CHILDREN_OPTIONS } from "@riophae/vue-treeselect";
import CRUD, { presenter, header, form, crud } from "@crud/crud";
import rrOperation from "@crud/RR.operation";
import crudOperation from "@crud/CRUD.operation";
import udOperation from "@crud/UD.operation";
import DateRangePicker from "@/components/DateRangePicker";
import dic from "@/api/system/dict";
import cuAmap from "@/components/AMap"; export default {
name: "Overview",
// crud交由presenter持有 components: {},
const defaultForm = {
id: null,
title: null,
menuSort: 999,
path: null,
component: null,
componentName: null,
iframe: false,
roles: [],
pid: 0,
icon: null,
cache: false,
hidden: false,
type: 0,
permission: null,
};
export default {
name: "Menu",
components: {
cuAmap,
Treeselect,
IconSelect,
crudOperation,
rrOperation,
udOperation,
DateRangePicker,
},
cruds() {
return CRUD({
title: "菜单",
url: "api/menus",
crudMethod: { ...crudHome },
});
},
mixins: [presenter(), header(), form(defaultForm), crud()],
data() { data() {
return { return {
// panel1,2,3 // 公共用
currentPage: 1, // 当前页码 baseAPI: baseAPI,
pageSize: 10, // 每页显示的条目数量 incubatorId: "",
totalItems: 100, // 总条目数
// 顶部切换菜单 // 顶部切换菜单
activeIndex: 0, activeIndex: 0,
searchText4teacher: "",
teacherList: [],
data: {
incubatorAllCount: 6,
incubatorCompanyCount: 10,
intermediaryAgencyCount: 10,
mentorAllCount: 7,
remainingArea: -99750,
total: 6,
totalArea: 382,
unIncubatorCompanyCount: 14,
list: [],
},
dialogVisible: false, // panel0
baseAPI: baseAPI, data4panel0: {},
labelPosition: "right", searchText4panel0: "",
fileList: [], currentPage4panel0: 1, // 当前页码
cmap: null, pageSize4panel0: 10, // 每页显示的条目数量
Dict: { selectList: [] }, totalItems4panel0: 100, // 总条目数
formInline: { dialogVisible4panel0: false,
formData4panel0: {
address: "", address: "",
contactPerson: "", contactPerson: "",
contactPhone: "",
id: "",
incubationArea: "",
incubatorImage: "",
incubatorLevel: 2,
incubatorName: "",
latitude: "",
longitude: "",
operatingAgency: "",
totalArea: "",
},
menus: [],
permission: {
add: ["admin", "menu:add"],
edit: ["admin", "menu:edit"],
del: ["admin", "menu:del"],
},
rules: {
title: [{ required: true, message: "请输入标题", trigger: "blur" }],
path: [{ required: true, message: "请输入地址", trigger: "blur" }],
}, },
}; };
}, },
computed: { computed: {},
// remainingArea() {
// return this.formInline.totalArea - this.formInline.incubationArea;
// },
},
mounted() { mounted() {
// this.getData(); this.incubatorId = this.$route.query.id;
dic.getCompanyDicts().then((res) => { this.getData4panel0();
console.log(res);
this.companyLevelList = res.body.incubatorLevel || [];
});
this.getData();
}, },
methods: { methods: {
handleCurrentChange(newPage) {
// 切换分页
this.currentPage = newPage;
// 这里可以添加代码来加载新页的数据
console.log(`当前页: ${newPage}`);
},
changeNav(index) { changeNav(index) {
this.activeIndex = ~~index; this.activeIndex = ~~index;
}, },
go2overview() { handleCurrentChange4panel0(newPage) {
alert("数据概览页开发ing~"); // 切换分页
this.currentPage4panel0 = newPage;
// 这里可以添加代码来加载新页的数据
console.log(`当前页: ${newPage}`);
}, },
handleSuccess(response, file) { initChart4panel0_1() {
// 处理上传成功 const chartDom = this.$refs.pieChart4panel0_1;
console.log("Upload success:", response, file); const myChart = echarts.init(chartDom);
this.formInline.incubatorImage = response.body; const option = {
// this.fileList.push(file); // 存储已上传文件 tooltip: {
// this.tableData.push({ trigger: "item",
// name: file.name,
// status: '上传成功',
// });
},
handleError(err, file) {
// 处理上传错误
console.error("Upload failed:", err, file);
this.tableData.push({
name: file.name,
status: "上传失败",
});
}, },
handleRemove(file, fileList) { series: [
console.log(file, fileList); {
name: "孵化器总收入",
type: "pie",
radius: "50%",
data: this.data4panel0.revenueChartData || [],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)",
}, },
handlePreview(file) {
console.log(file);
}, },
handleExceed(files, fileList) {
this.$message.warning(
`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
files.length + fileList.length
} 个文件`
);
}, },
beforeRemove(file, fileList) { ],
return this.$confirm(`确定移除 ${file.name}？`); };
myChart.setOption(option);
}, },
amapOptions(cmap) { initChart4panel0_2() {
var VUE = this; const chartDom = this.$refs.pieChart4panel0_2;
var self = this, const myChart = echarts.init(chartDom);
form = this.formInline;
return {
zoom: 12,
center: [122.050189, 37.515189],
//showLabel: true,
//pitch: 40,
onload: function (cmap) {
// debugger
VUE.cmap = cmap;
var center = cmap.options.center;
var lng = form.longitude || center[0],
lat = form.latitude || center[1];
if (lng && lat) {
cmap.setCenter([lng, lat]);
// 添加标记 const option = {
cmap.addMarker({ tooltip: {
lnglat: [lng, lat], trigger: "item",
title: "",
draggable: true,
dragend: function (e) {
// var lnglat = e.lnglat;
// cmap.deGeocode([lnglat.lng, lnglat.lat], function (addr) {
// form.address = addr;
// form.longitude = lnglat.lng;
// form.latitude = lnglat.lat;
// self.$forceUpdate();
// });
VUE.getAddrPlus(e, cmap);
}, },
}); series: [
} {
name: "孵化器使用总面积",
type: "pie",
radius: "50%",
data: this.data4panel0.areaChartData || [],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)",
}, },
click: function (e, cmap) {
// 经纬度坐标
VUE.getAddrPlus(e, cmap);
// var lnglat = e.lnglat;
// cmap.deGeocode([lnglat.lng, lnglat.lat], function (addr) {
// form.address = addr;
// form.longitude = lnglat.lng;
// form.latitude = lnglat.lat;
// });
cmap.marker && cmap.removeMarker();
// 添加标记
cmap.addMarker({
lnglat: [e.lnglat.lng, e.lnglat.lat],
title: "",
draggable: true,
dragend: function (e) {
// var lnglat = e.lnglat;
// cmap.deGeocode([lnglat.lng, lnglat.lat], function (addr) {
// form.address = addr;
// form.longitude = lnglat.lng;
// form.latitude = lnglat.lat;
// });
VUE.getAddrPlus(e, cmap, form);
}, },
});
}, },
],
}; };
},
getAddrPlus(e, cmap, form) {
var lnglat = e.lnglat;
let longitude = lnglat.lng;
let latitude = lnglat.lat;
// 创建逆地理编码对象 myChart.setOption(option);
let geocoder;
AMap.plugin("AMap.Geocoder", () => {
geocoder = new AMap.Geocoder({
radius: 1000,
extensions: "all",
});
console.log();
// 根据经纬度进行逆地理编码查询
geocoder.getAddress([longitude, latitude], (status, result) => {
if (status === "complete" && result.info === "OK") {
if (result.regeocode && result.regeocode.formattedAddress) {
let address = result.regeocode.formattedAddress;
this.formInline.address = address;
this.formInline.longitude = longitude;
this.formInline.latitude = latitude;
this.$forceUpdate();
console.log("精确地址获取", address);
}
} else {
console.error("获取地址失败");
}
});
});
},
onSubmit() {
console.log("submit!");
},
edit() {
if (this.formInline.incubatorName) {
}
crudHome.add(this.formInline).then((res) => {
if (res && res.code === 200) {
this.$message.success("保存成功"); // res.msg
this.getData();
this.dialogVisible = false;
}
});
}, },
getData(fn) { getData4panel0(fn) {
crudHome overviewApi
.getData4tech({ .getData4panel0({
page: 0, incubatorId: this.incubatorId,
size: 999,
}) })
.then((res) => { .then((res) => {
console.log(res, "getData4tech"); console.log(res, "getData4panel04tech");
this.data = res.body; this.data4panel0 = res.body;
this.initChart4panel0_1();
}); });
}, },
// 选中图标
selected(name) {
this.form.icon = name;
}, },
}, };
}; </script>
</script> <style rel="stylesheet/scss" lang="scss" scoped>
<style> .app-container {
/* .app-main {
background-color: #fff !important;
} */
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
.app-container {
padding: 20px; padding: 20px;
background-color: #fff; background-color: #fff;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
} }
.page-footer{ .page-footer {
display:none !important; display: none !important;
} }
.header { .header {
// 菜单标题头
background: #f5f7fa; background: #f5f7fa;
ul { ul {
display: flex; display: flex;
...@@ -685,19 +433,34 @@ ...@@ -685,19 +433,34 @@
} }
} }
} }
} }
.imgShowraper { .bodyer {
margin-left: 90px; // panels最外层容器
background-color: #fff;
}
.panelsWrapper {
// panels父容器
background: #f5f6fb;
display: flex;
flex-wrap: wrap;
& > li {
width: 100%;
height: 442px;
background: #ffffff;
position: relative;
} }
}
/**公共类 */ /**公共类 */
.divider { .divider {
width: 100%; width: 100%;
height: 1px; height: 1px;
border: 1px dashed #dddee1; border: 1px dashed #dddee1;
} }
.prefixDiv { .prefixDiv {
position: relative; position: relative;
&:before { &:before {
width: 4px; width: 4px;
...@@ -709,8 +472,8 @@ ...@@ -709,8 +472,8 @@
left: 16px; left: 16px;
content: ""; content: "";
} }
} }
.prefixPoint { .prefixPoint {
position: relative; position: relative;
&:before { &:before {
content: ""; content: "";
...@@ -723,11 +486,10 @@ ...@@ -723,11 +486,10 @@
top: 50%; /* 垂直居中 */ top: 50%; /* 垂直居中 */
transform: translateY(-50%); /* 精确居中 */ transform: translateY(-50%); /* 精确居中 */
} }
} }
/** 第五个面板 */ /** 第五个面板 */
.tab_panel_4 { .tab_panel_4 {
._title { ._title {
font-size: 16px; font-size: 16px;
color: #1890ff; color: #1890ff;
...@@ -801,15 +563,15 @@ ...@@ -801,15 +563,15 @@
} }
} }
} }
} }
.tab_panel_1 { .tab_panel_1 {
display: flex; display: flex;
padding: 10px; padding: 10px;
& > ._left { & > ._left {
flex: 1; flex: 1;
margin-right: 20px; margin-right: 20px;
height: 798px !important; height: 798px !important;
border: 1px solid #DDDEE1; border: 1px solid #dddee1;
padding: 20px; padding: 20px;
._title { ._title {
display: flex; display: flex;
...@@ -887,7 +649,7 @@ ...@@ -887,7 +649,7 @@
padding-left: 20px; padding-left: 20px;
} }
} }
dl{ dl {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
padding-left: 20px; padding-left: 20px;
...@@ -900,41 +662,29 @@ ...@@ -900,41 +662,29 @@
margin-left: 20px; margin-left: 20px;
margin-right: 20px; margin-right: 20px;
border: 1px solid #DDDEE1; border: 1px solid #dddee1;
margin-top: 10px; margin-top: 10px;
img{ img {
width: 250px; width: 250px;
height: 150px; height: 150px;
} }
h3{ h3 {
font-size: 15px; font-size: 15px;
color: #606266; color: #606266;
padding-left: 15px; padding-left: 15px;
} }
p{ p {
font-size: 13px; font-size: 13px;
color: #969AA3; color: #969aa3;
padding-left: 15px; padding-left: 15px;
line-height: 20px; line-height: 20px;
} }
} }
} }
} }
} }
.list {
// ul元素
background: #f5f6fb;
display: flex;
flex-wrap: wrap;
& > li {
width: 100%;
height: 442px;
background: #ffffff;
position: relative;
}
.overview { .tab_panel_0 {
h2 { h2 {
font-weight: 400; font-weight: 400;
font-size: 27px; font-size: 27px;
...@@ -943,6 +693,19 @@ ...@@ -943,6 +693,19 @@
padding-top: 16px; padding-top: 16px;
padding-bottom: 16px; padding-bottom: 16px;
} }
._title {
color: #1890ff;
height: 48px;
background: #e4f2ff;
font-weight: 400;
font-size: 16px;
line-height: 48px;
margin-bottom: 20px;
display: flex;
justify-content: space-between;
padding-left: 26px;
padding-right: 20px;
}
.contentWrapper { .contentWrapper {
border-top: 1px dashed #dddee1; border-top: 1px dashed #dddee1;
display: flex; display: flex;
...@@ -952,6 +715,8 @@ ...@@ -952,6 +715,8 @@
} }
.left { .left {
border-right: 1px dashed #dddee1; border-right: 1px dashed #dddee1;
padding-left: 20px;
padding-right: 20px;
.body { .body {
display: flex; display: flex;
._left, ._left,
...@@ -962,46 +727,35 @@ ...@@ -962,46 +727,35 @@
li { li {
font-size: 15px; font-size: 15px;
color: #606266; color: #606266;
line-height: 16px; line-height: 26px;
padding: 4px 42px; padding: 4px 42px;
} }
} }
.right { .right {
padding-left: 20px;
padding-right: 20px;
.body { .body {
display: flex; display: flex;
flex-direction: column;
} }
._top {
li { li {
font-size: 15px; font-size: 15px;
color: #606266; color: #606266;
line-height: 16px; line-height: 26px;
padding: 4px 42px; padding: 4px 42px;
} }
} }
._bottom {
padding-left: 40px;
img {
width: 418px;
height: 272px;
} }
} }
} }
.body {
background-color: #fff;
.title {
color: #1890ff;
height: 48px;
background: #e4f2ff;
font-weight: 400;
font-size: 16px;
line-height: 48px;
margin-bottom: 20px;
display: flex;
justify-content: space-between;
padding-left: 20px;
padding-right: 20px;
}
} }
// ::v-deep .el-input { }
// width: 200px; </style>
// }
// ::v-deep .el-input__inner {
// height: 38px;
// }
</style>
\ No newline at end of file
src/views/system/home/tech.vue
View file @ 79a1b887
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
</li> </li>
<li> <li>
<div class="title">创业导师</div> <div class="title">创业导师</div>
<div class="content">{{data.mentorAllCount}}家</div> <div class="content">{{data.mentorAllCount}}人</div>
</li> </li>
<li> <li>
<div class="title">孵化面积</div> <div class="title">孵化面积</div>
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
<div class="body"> <div class="body">
<ul class="list"> <ul class="list">
<li v-for="(item) in data.list" :key="item.id" @click="go2overview"> <li v-for="(item) in data.list" :key="item.id" @click="go2overview(item)">
<img :src="`${baseAPI}file/${item.incubatorImage}`"alt="" /> <img :src="`${baseAPI}file/${item.incubatorImage}`"alt="" />
<div class="introduce"> <div class="introduce">
<h2>{{ item.incubatorName }}</h2> <h2>{{ item.incubatorName }}</h2>
...@@ -298,8 +298,9 @@ export default { ...@@ -298,8 +298,9 @@ export default {
this.getData(); this.getData();
}, },
methods: { methods: {
go2overview(){ go2overview(item){
alert('数据概览页开发ing~') // alert('数据概览页开发ing~')
this.$router.push('/home/overview?id='+item.id)
}, },
handleSuccess(response, file) { handleSuccess(response, file) {
// 处理上传成功 // 处理上传成功
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment