代码拉取完成，页面将自动刷新
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" media="screen" />
<meta http-equiv="X-UA-Compatible" ;content="IE=edge, chrome=1">
<link rel="stylesheet" href="./static/css/company-output-value-detail.css">
<link rel="stylesheet" href="./static/css/commonality.css">
<link rel="stylesheet" href="lib/layui/css/layui.css" />
<script src="./static/js/main.js"></script>
<script src="./static/js/echarts.min.js"></script>
<script src="./static/js/vue.min.js"></script>
<script src="./static/js/vue-resource.min.js"></script>
<script src="./static/laydate/laydate.js"></script>
<title>企业销量分析</title>
</head>
<body>
<div class="detail" id="companyOutputValue">
<div class="nav">
<div class="nav-bar">
<ul>
<li>
<a href="./news-list.html">新闻</a>
</li>
<li>
<a href="./goods-list.html">商品信息</a>
</li>
<li class="selectBar-bor">
<a href="company-list.html">企业信息</a>
</li>
<li>
<a href="./output-value-detail.html">产值分析</a>
</li>
<li>
<a href="./map-detail.html">市场分布</a>
</li>
<li>
<a href="./product-list.html">产销分析</a>
</li>
<li>
<a href="./supply-demand-detail.html">供需分析</a>
</li>
</ul>
</div>
</div>
<div class="main">
<div class="main-mian">
<div class="main-center">
<div class="content-content">
<div>
<div class="content-name">
{{company.name}}
</div>
<div class="content-message">
{{company.contact}}
</div>
<div class="content-message">
{{company.contactWay}}
</div>
<div class="content-message">
{{company.address}}
</div>
<!-- <div class="content-description content-address">
<div>
</div>
<div>
{{company.contactWay}}
</div>
</div>
<div class="content-description content-address">
<div>
</div>
<div>
{{company.address}}
</div>
</div> -->
<div class="content-description" v-html="company.description">
<!-- <div>
</div> -->
</div>
</div>
</div>
<div class="content-content">
<div>
<div class="content-search">
<div>
统计年份：
</div>
<div>
<input type="text" id="gdpYears" v-model="gdp.years" required lay-verify="required" placeholder="请选择年份" readonly>
</div>
</div>
<div id="outputValueGdp" class="content-Gdp"></div>
</div>
</div>
<div class="content-content">
<div>
<div class="content-search">
<div>
统计年份：
</div>
<div>
<input type="text" id="salesYears" v-model="sales.years" required lay-verify="required" placeholder="请选择年份" readonly class="layui-input">
</div>
</div>
<div id="outputValueSales" class="content-Gdp"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script>
laydate.render({
elem: '#gdpYears', //指定元素
type: 'year',
range: true,
//得到日期生成的值，如：2017-08-18
//得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
//得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
done: function (value, date, endDate) {
companyOutputValue.gdp.beginYear = date.year;
companyOutputValue.gdp.endYear = endDate.year;
companyOutputValue.getGdp();
}
});
laydate.render({
elem: '#salesYears', //指定元素
type: 'year',
range: true,
//得到日期生成的值，如：2017-08-18
//得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
//得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
done: function (value, date, endDate) {
companyOutputValue.sales.beginYear = date.year;
companyOutputValue.sales.endYear = endDate.year;
companyOutputValue.getSales();
}
});
Vue.use(VueResource);
var companyOutputValue = new Vue({
el: "#companyOutputValue",
data: {
company: {
id: getUrlPara("id"),
name: null,
address: null,
contact: null,
contactWay: null,
description: null
},
gdp: {
beginYear: yearAfter(10),
endYear: currentYear(),
years: null
},
sales: {
beginYear: yearAfter(10),
endYear: currentYear(),
years: null
}
},
methods: {
getCompany: function () {
this.$http.get(getHttpServer() + "/api/web/company/" + this.company.id)
.then(function (response) {
if (response.data.code === 0) {
this.company = response.data.data
}
}).catch(function (response) {
});
},
getGdp: function () {
this.gdp.years = this.gdp.beginYear + " - " + this.gdp.endYear;
this.$http.get(getHttpServer() + "/api/web/statistical/company/" + this.company.id + "/gdp/" + this.gdp.beginYear + "/" + this.gdp.endYear)
.then(function (response) {
var outputValueGdp = response.data.data;
var outputValueGdpChart = echarts.init(document.getElementById('outputValueGdp'));
var outputValueGdpOption = {
title: {
text: this.gdp.beginYear + "~" + this.gdp.endYear + '年GDP'
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['GDP']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: outputValueGdp.years
},
yAxis: {
type: 'value'
},
series: [
{
name: 'GDP',
type: 'line',
data: outputValueGdp.gdp
}
]
};
outputValueGdpChart.setOption(outputValueGdpOption);
}).catch(function (response) {
});
},
getSales: function () {
this.sales.years = this.sales.beginYear + " - " + this.sales.endYear;
this.$http.get(getHttpServer() + "/api/web/statistical/company/" + this.company.id + "/sales/" + this.sales.beginYear + "/" + this.sales.endYear)
.then(function (response) {
var outputValueSales = response.data.data;
var outputValueSalesChart = echarts.init(document.getElementById('outputValueSales'));
var outputValueSalesOption = {
title: {
text: this.sales.beginYear + "~" + this.sales.endYear + '发展比'
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['线上', '线下']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'category',
boundaryGap: false,
data: outputValueSales.years
},
yAxis: {
type: 'value',
axisLabel: {
formatter: '{value} 个'
}
},
series: [
{
name: '线上',
type: 'line',
data: outputValueSales.online
},
{
name: '线下',
type: 'line',
data: outputValueSales.offline
}
]
};
outputValueSalesChart.setOption(outputValueSalesOption);
}).catch(function (response) {
});
}
}
});
companyOutputValue.getCompany();
companyOutputValue.getGdp();
companyOutputValue.getSales();
</script>
</html>
Loading...
举报
请认真填写举报原因，尽可能描述详细。
请选择举报类型
误判申诉
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化