index.vue 9.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337
  1. <template>
  2. <div class="app-container home">
  3. <!-- <h3 class="toolbar">
  4. <span class="title">数据累计</span>
  5. </h3> -->
  6. <div class="page01-con page04-con mt20">
  7. <h1 class="page01-title">
  8. <img src="../assets/images/icon15.png"/>数据累计
  9. </h1>
  10. </div>
  11. <template v-if="userType == 'ADMIN'">
  12. <el-row :gutter="20">
  13. <el-col :span="8">
  14. <div class="stat_box">
  15. <i class="icon icon_1"></i>
  16. <span class="num">{{info.entSumCnt || 0}}</span>
  17. <span class="label">企业总数</span>
  18. </div>
  19. </el-col>
  20. <el-col :span="8">
  21. <div class="stat_box">
  22. <i class="icon icon_9"></i>
  23. <span class="num">{{info.entValidCnt || 0}}</span>
  24. <span class="label">服务中企业</span>
  25. </div>
  26. </el-col>
  27. <el-col :span="8">
  28. <div class="stat_box">
  29. <i class="icon icon_8"></i>
  30. <span class="num">{{info.entExpiredCnt || 0}}</span>
  31. <span class="label">服务已到期企业</span>
  32. </div>
  33. </el-col>
  34. <el-col :span="8">
  35. <router-link to="project/project">
  36. <div class="stat_box">
  37. <i class="icon icon_5"></i>
  38. <span class="num">{{info.proSumCnt || 0}}</span>
  39. <span class="label">项目总数</span>
  40. </div>
  41. </router-link>
  42. </el-col>
  43. <el-col :span="8">
  44. <div class="stat_box">
  45. <i class="icon icon_6"></i>
  46. <span class="num">{{info.proFinishCnt || 0}}</span>
  47. <span class="label">已完成项目</span>
  48. </div>
  49. </el-col>
  50. <el-col :span="8">
  51. <div class="stat_box">
  52. <i class="icon icon_7"></i>
  53. <span class="num">{{info.proUnfinishCnt || 0}}</span>
  54. <span class="label">待完成项目</span>
  55. </div>
  56. </el-col>
  57. </el-row>
  58. </template>
  59. <template v-if="userType == 'GOV_PROV' || userType == 'GOV_CITY' || userType == 'GOV_DISTRI'">
  60. <el-row :gutter="20">
  61. <el-col :span="8">
  62. <div class="stat_box">
  63. <i class="icon icon_1"></i>
  64. <span class="num">{{info.entSumCnt || 0}}</span>
  65. <span class="label">企业总数</span>
  66. </div>
  67. </el-col>
  68. <el-col :span="8">
  69. <div class="stat_box">
  70. <i class="icon icon_1"></i>
  71. <span class="num">{{info.proFinishCnt || 0}}</span>
  72. <span class="label">项目申报数</span>
  73. </div>
  74. </el-col>
  75. </el-row>
  76. </template>
  77. <template v-if="userType == 'ENT_ADMIN' || userType == 'ENT_TECH' || userType == 'ENT_ADMIN_TECH' || userType == 'ENT_FIN' || userType == 'ENT_ADMIN_FIN'">
  78. <el-row :gutter="20">
  79. <el-col :span="8">
  80. <router-link to="project/project-declare">
  81. <div class="stat_box">
  82. <i class="icon icon_5"></i>
  83. <span class="num">{{info.proSumCnt || 0}}</span>
  84. <span class="label">项目总数</span>
  85. </div>
  86. </router-link>
  87. </el-col>
  88. <el-col :span="8">
  89. <div class="stat_box">
  90. <i class="icon icon_6"></i>
  91. <span class="num">{{info.proFinishCnt || 0}}</span>
  92. <span class="label">已完成项目</span>
  93. </div>
  94. </el-col>
  95. <el-col :span="8">
  96. <div class="stat_box">
  97. <i class="icon icon_7"></i>
  98. <span class="num">{{info.proUnfinishCnt || 0}}</span>
  99. <span class="label">待完成项目</span>
  100. </div>
  101. </el-col>
  102. </el-row>
  103. </template>
  104. <template v-if="roleTypeFlag">
  105. <!-- <h3 class="toolbar">
  106. <span class="title">年度信息管理</span>
  107. <div class="tool">
  108. <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleYear">添加加计年度基本信息</el-button>
  109. </div>
  110. </h3> -->
  111. <div class="page01-con page04-con">
  112. <h1 class="page01-title">
  113. <img src="../assets/images/icon15.png"/>年度信息管理
  114. <!-- <a>更多</a> -->
  115. <a @click="handleYear">
  116. <img src="../assets/images/icon16.png"/>
  117. 添加年度基本信息
  118. </a>
  119. </h1>
  120. </div>
  121. <el-table v-loading="loading" :data="list" border>
  122. <el-table-column label="申报年度" prop="projectYear"></el-table-column>
  123. <el-table-column label="企业名称" prop="entName" align="center" width="180"/>
  124. <el-table-column label="职工数" prop="totoalPersons" align="center" width="180" />
  125. <el-table-column label="销售收入" prop="sales"></el-table-column>
  126. <el-table-column label="研发收入" prop="techInvest"></el-table-column>
  127. <el-table-column label="占销售收入比例" prop="techRate"></el-table-column>
  128. <el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width" fixed="right">
  129. <template slot-scope="scope">
  130. <!-- <template v-if="!roleTypeFlag && (scope.row.reportState == 1 || scope.row.reportState == 2)"> -->
  131. <el-button type="text" @click="handleEdit(scope.row)">编辑</el-button>
  132. <!-- </template> -->
  133. </template>
  134. </el-table-column>
  135. </el-table>
  136. <!-- <h3 class="toolbar mt10">
  137. <span class="title">已申报项目</span>
  138. <div class="tool">
  139. <el-button type="text" size="mini" @click="$router.push('/project/project-declare')">查看更多</el-button>
  140. </div>
  141. </h3> -->
  142. <div class="page01-con page04-con mt20">
  143. <h1 class="page01-title">
  144. <img src="../assets/images/icon15.png"/>已申报项目
  145. <a @click="$router.push('/project/project-declare')">更多</a>
  146. </h1>
  147. </div>
  148. <el-table v-loading="loading" :data="declareList" border>
  149. <el-table-column label="申报年度" prop="projectYear"></el-table-column>
  150. <el-table-column label="项目起止时间" align="center">
  151. <template slot-scope="scope">
  152. <span>{{scope.row.projectStartDate}} - {{scope.row.projectEndDate}}</span>
  153. </template>
  154. </el-table-column>
  155. <el-table-column label="项目名称" prop="projectName" align="center"/>
  156. </el-table>
  157. </template>
  158. </div>
  159. </template>
  160. <script>
  161. import {getIndexDataApi} from "@/api/common/common.js"
  162. import {yearListApi,listProjectApi} from "@/api/enterprise/project/project"
  163. export default {
  164. name: "Index",
  165. computed: {
  166. userType() {
  167. return this.$store.state.user.userType
  168. },
  169. roleTypeFlag() {
  170. let roleType = this.$store.state.user.roles.join(',')
  171. return ['entAdmin'].includes(roleType) //判断是否为技术负责人,财务负责人
  172. }
  173. },
  174. data() {
  175. return {
  176. // 版本号
  177. version: "1.0.0",
  178. info: {},
  179. list: [],
  180. declareList: [],
  181. total: 0,
  182. queryParams: {
  183. pageNum: 1,
  184. pageSize: 10,
  185. },
  186. params: {
  187. reportState: '4'
  188. }
  189. };
  190. },
  191. created() {
  192. this.getData()
  193. this.getList()
  194. this.getDeclareList()
  195. },
  196. methods: {
  197. goTarget(href) {
  198. window.open(href, "_blank");
  199. },
  200. getData() {
  201. getIndexDataApi().then(res => {
  202. this.info = res.data || {}
  203. })
  204. },
  205. getList() {
  206. this.loading = true;
  207. yearListApi(this.queryParams).then(response => {
  208. this.list = response.data.records;
  209. // this.total = response.data.total;
  210. this.loading = false;
  211. });
  212. },
  213. //添加年度信息 type用来区分tab页是否可以切换
  214. handleYear() {
  215. this.$router.push({name: 'editProject', query: {type: 'year'}})
  216. },
  217. //编辑
  218. handleEdit(row) {
  219. this.$router.push({name: 'editProject', query: {year: row.projectYear, entId: row.entId, type: 'update', activeName: '1', source: 'add'}})
  220. },
  221. getDeclareList() {
  222. this.loading = true;
  223. listProjectApi(this.params).then(response => {
  224. this.declareList = response.data.records;
  225. this.total = response.data.total;
  226. this.loading = false;
  227. });
  228. },
  229. }
  230. };
  231. </script>
  232. <style scoped lang="scss">
  233. img {
  234. border: none;
  235. vertical-align: middle;
  236. max-width: 100%;
  237. }
  238. .page04-con h1{
  239. text-align:left;
  240. padding-left:20px;
  241. padding-right:50px;
  242. }
  243. .page04-con h1 img{
  244. display:inline-block;
  245. margin-right:10px;
  246. }
  247. .page04-con h1 span{
  248. float:right;
  249. font-weight:normal;
  250. margin-right:20px;
  251. cursor:pointer;
  252. }
  253. .page04-con h1 a{
  254. float:right;
  255. color:#fff;
  256. font-weight:700;
  257. }
  258. .page01-title{
  259. background:#4882b5;
  260. font-size:18px;
  261. color:#fff;
  262. font-weight:700;
  263. margin-bottom:5px;
  264. text-align:center;
  265. line-height:48px;
  266. border-radius:6px;
  267. display:block;
  268. }
  269. .home {
  270. blockquote {
  271. padding: 10px 20px;
  272. margin: 0 0 20px;
  273. font-size: 17.5px;
  274. border-left: 5px solid #eee;
  275. }
  276. hr {
  277. margin-top: 20px;
  278. margin-bottom: 20px;
  279. border: 0;
  280. border-top: 1px solid #eee;
  281. }
  282. .col-item {
  283. margin-bottom: 20px;
  284. }
  285. ul {
  286. padding: 0;
  287. margin: 0;
  288. }
  289. font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  290. font-size: 13px;
  291. color: #676a6c;
  292. overflow-x: hidden;
  293. ul {
  294. list-style-type: none;
  295. }
  296. h4 {
  297. margin-top: 0px;
  298. }
  299. h2 {
  300. margin-top: 10px;
  301. font-size: 26px;
  302. font-weight: 100;
  303. }
  304. p {
  305. margin-top: 10px;
  306. b {
  307. font-weight: 700;
  308. }
  309. }
  310. .update-log {
  311. ol {
  312. display: block;
  313. list-style-type: decimal;
  314. margin-block-start: 1em;
  315. margin-block-end: 1em;
  316. margin-inline-start: 0;
  317. margin-inline-end: 0;
  318. padding-inline-start: 40px;
  319. }
  320. }
  321. }
  322. </style>