提交 cd22c5b5 编写于 作者: 张磊's avatar 张磊

ex echart

上级 b3e11529
{
"env": {
"test": {
"presets": [
[
"@babel/preset-env",
{
"targets": {
"node": "current"
}
}
]
]
}
}
}
Android >= 4.0
iOS >= 7
\ No newline at end of file
# comment
deploy
node_modules
public
# https://editorconfig.org
root = true
[*]
charset = utf-8 #字符集utf-8
indent_style = space #缩进风格:空格
indent_size = 2 #缩进大小2
end_of_line = lf #换行符lf
insert_final_newline = true #结尾总是插入新的一行
trim_trailing_whitespace = true #行尾允许空格
[*.md]
insert_final_newline = false
trim_trailing_whitespace = false
\ No newline at end of file
NODE_ENV=dev
# baseUrl
BASE_URL=/learning-report/
# 路由 base
VUE_APP_BASE_ROUTE_URL=/learning-report
# 默认路由地址
VUE_APP_BASE_ROUTE=/
# 阿里云OSS对象存储地址
VUE_APP_OSS_URL=https://pica-h5-dev.yunqueyi.com/
# 模拟用户信息,如果有则发送模拟用户信息,只针对开发模式
# VUE_APP_MOCK_USER_INFO=eyJhdmF0YXIiOm51bGwsIm1vYmlsZSI6IjE4MTE3MDIzOTE2Iiwibmlja05hbWUiOiIxODEqKioqMzkxNiIsImlkZW50aWZ5U3RhdHVzIjpudWxsLCJ1c2VySWQiOiI2OTIzMDczNDM1ODQ2NjE1MDQiLCJsb2dpbkNoYW5uZWwiOiJtYW5pdWprLWNoYW5uZWwtY29uc3VtZXItYXBwIn0=
# 是否加密
VUE_APP_ENCRYPT=
# 是否开启 vConsole
VUE_APP_CONSOLE=true
# appid
VUE_APP_APPID=ab5cb3c1fd834ca1892cd7b3c6e57717
#生成骨架屏扫描地址(可选择本地)
VUE_APP_SKELETON='http://localhost:8083'
NUXT_ENV_APP=dev
NODE_ENV=production
# 自定义 VUE_APP_ENV
VUE_APP_ENV ='development'
VUE_APP_SERVICE_URL=https://dev-sc.yunqueyi.com
# 阿里云OSS对象存储地址
VUE_APP_OSS_URL=https://pica-h5-dev.yunqueyi.com/
# 模拟用户信息,如果有则发送模拟用户信息,只针对开发模式
VUE_APP_MOCK_USER_INFO=
# 是否加密
VUE_APP_ENCRYPT=
# 是否开启vConsole
VUE_APP_CONSOLE=true
# 是否开启打印 console.log
VUE_APP_HAS_CONSOLE=true
#OSS上传Bucket_Name
VUE_APP_BUCKET_NAME='pica-app-dev'
# appid
VUE_APP_APPID=wxf4e66242d31c81c2
NODE_ENV=dev
VUE_APP_ENV=development
VUE_APP_SERVICE_URL=https://dev-sc.yunqueyi.com
NUXT_ENV_APP=dev
# 模拟用户信息
VUE_APP_MOCK_USER_INFO=eyJhdmF0YXIiOm51bGwsIm1vYmlsZSI6IjE4MTE3MDIzOTE2Iiwibmlja05hbWUiOiIxODEqKioqMzkxNiIsImlkZW50aWZ5U3RhdHVzIjpudWxsLCJ1c2VySWQiOiI2OTIzMDczNDM1ODQ2NjE1MDQiLCJsb2dpbkNoYW5uZWwiOiJtYW5pdWprLWNoYW5uZWwtY29uc3VtZXItYXBwIn0=
VUE_APP_ENCRYPT=
VUE_APP_CONSOLE=true
# 本地开发环境
VUE_APP_IS_LOCAL=true
# appid
VUE_APP_APPID=wxf4e66242d31c81c2
# 本地token
VUE_APP_TOKEN=42789F2675384BFAB05EA57BDBED0E73
# mock的基础地址
VUE_APP_BASE_MOCK_URL=http://192.168.120.69:40001/mock/
# mock的工作空间地址
VUE_APP_MOCK_URL=12/
NODE_ENV=production
# 自定义 VUE_APP_ENV
VUE_APP_ENV ='production'
VUE_APP_SERVICE_URL=https://sc.yunqueyi.com
# 阿里云OSS对象存储地址
VUE_APP_OSS_URL=https://pica-h5.yunqueyi.com/
# 模拟用户信息,如果有则发送模拟用户信息,只针对开发模式
VUE_APP_MOCK_USER_INFO=
# 是否加密
VUE_APP_ENCRYPT=false
# 是否开启 vConsole
VUE_APP_CONSOLE=
# appid
VUE_APP_APPID=wx2c577552a2d28550
# app渠道
VUE_APP_CHANNEL=prod
# OSS 上传 Bucket_Name
VUE_APP_BUCKET_NAME='pica-app-prod'
#arms日志监控脚本
VUE_APP_ARMS=''
NODE_ENV=production
# 自定义 VUE_APP_ENV
VUE_APP_ENV ='testing'
VUE_APP_SERVICE_URL=https://test1-sc.yunqueyi.com
# 阿里云OSS对象存储地址
VUE_APP_OSS_URL=https://pica-h5-test.yunqueyi.com/
# 模拟用户信息,如果有则发送模拟用户信息,只针对开发模式
VUE_APP_MOCK_USER_INFO=
# 是否加密
VUE_APP_ENCRYPT=false
# 是否开启 vConsole
VUE_APP_CONSOLE=true
# 是否开启打印 console.log
VUE_APP_HAS_CONSOLE=true
# appid
VUE_APP_APPID=wxcaad75b7fff5659c
# APP 渠道
VUE_APP_CHANNEL=_test
# OSS上传Bucket_Name
VUE_APP_BUCKET_NAME='pica-app-test'
NODE_ENV=production
# 自定义 VUE_APP_ENV
VUE_APP_ENV ='uat'
VUE_APP_SERVICE_URL=https://uat-sc.yunqueyi.com
# 阿里云OSS对象存储地址
VUE_APP_OSS_URL=https://pica-h5-uat.yunqueyi.com/
# 模拟用户信息,如果有则发送模拟用户信息,只针对开发模式
VUE_APP_MOCK_USER_INFO=
# 是否加密
VUE_APP_ENCRYPT=false
# 是否开启vConsole
VUE_APP_CONSOLE=
# appid
VUE_APP_APPID=wx342ef0e5afee54a7
# OSS 上传 Bucket_Name
VUE_APP_BUCKET_NAME='pica-app-uat'
/h5-submodules-master
/node_modules
module.exports = {
root: true,
parserOptions: {
parser: 'babel-eslint',
sourceType: 'module'
},
env: {
browser: true,
node: true,
es6: true,
},
extends: ['plugin:vue/recommended', 'eslint:recommended'],
// 全局变量
globals: {
'gdp': true,
},
// add your custom rules here
//it is base on https://github.com/vuejs/eslint-config-vue
rules: {
'no-console': 0,
'no-debugger':0,
'comma-spacing': [2, { // 控制逗号前面没有空格,后面必须有空格
'before': false,
'after': true
}],
'arrow-spacing': [2, { // 要求箭头函数前后有空格
'before': true,
'after': true
}],
'no-multi-spaces': 2,// 禁止使用多个空格,
'no-spaced-func': 2,// 禁止 function 标识符和括号之间出现空格,this.getList () 报错
'semi-spacing': [2, {// 强制分号之前不允许有空格
'before': false,
'after': true
}],
'space-infix-ops': 2,// 要求操作符前后必须有空格: 2 + 3 2 === 2 3 > 2
'spaced-comment': [2, 'always'], // 强制在注释中 // 或 /* 使用一致的空格
'array-bracket-spacing': [2, 'never'],// 指定数组的元素之间要以空格隔开(, 后面), never参数:[ 之后和 ] 之前不能带空格,always参数:[ 之后和 ] 之前必须带空格
"space-before-blocks": 2, // if/function等的大括号之前需要有空格
'no-undef-init': 2,// 禁止将变量初始化为 undefined,保存时会将let a = undefined变成let a
'semi': [2, 'always'],//强制结尾必须有分号;
'prefer-const': 2,// 要求使用 const 声明那些声明后不再被修改的变量
'quotes': [2, 'single'],//js中强制使用单引号
'no-multiple-empty-lines': [2, {// 不允许多个空行,最多一行
'max': 1
}],
'vue/order-in-components': ['error', {
'order': [
'el',
'name',
'parent',
'functional',
['delimiters', 'comments'],
['components', 'directives', 'filters'],
'extends',
'mixins',
'inheritAttrs',
'model',
['props', 'propsData'],
'data',
'computed',
'watch',
'LIFECYCLE_HOOKS',
'methods',
['template', 'render'],
'renderError'
]
}],
'vue/attributes-order': ['error', {
'order': [
'DEFINITION',
'LIST_RENDERING',
'CONDITIONALS',
'RENDER_MODIFIERS',
'GLOBAL',
'UNIQUE',
'TWO_WAY_BINDING',
'OTHER_DIRECTIVES',
'OTHER_ATTR',
'EVENTS',
'CONTENT'
]
}],
}
}
# Created by .ignore support plugin (hsz.mobi)
### Node template
# Logs
logs
*.log
.DS_Store
node_modules
/dist
.history/
# local env files
update_*.sh
package-lock.json
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# TypeScript v1 declaration files
typings/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variables file
.env
# parcel-bundler cache (https://parceljs.org/)
.cache
# next.js build output
.next
# nuxt.js build output
.nuxt
# Nuxt generate
dist
# vuepress build output
.vuepress/dist
# Serverless directories
.serverless
# IDE / Editor
# Editor directories and files
.idea
.editorconfig
# Service worker
sw.*
# Mac OSX
.DS_Store
\ No newline at end of file
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
.proxy.js
.version
log/
logs/
# .pica.prompts.js
log
logs
.version
module.exports = {
'autoRouter': false,
'registry': "http://192.168.110.93:4873/",
'type': "h5",
'projectName': "learning-report",
'autoConfig': true,
'transition': false,
'useHistoryRouter': true,
'rewriteHtml': false,
'renderToBranch': false,
'srcAlias': "mn-template",
};
FROM nginx
RUN ln -sf /usr/share/zoneinfo/Asia/Shanghai /etc/localtime &&\
echo "Asia/shanghai" > /etc/timezone
COPY error.html /usr/share/nginx/html/error.html
COPY nginx.conf /etc/nginx/nginx.conf
COPY dist/ /usr/vue/learning-report/dist/
RUN chmod -R +rw /usr/share/nginx/html/error.html &&\
chown -R nginx:nginx /usr/share/nginx/html/error.html &&\
chmod -R +rw /usr/vue/learning-report/dist/ &&\
chown -R nginx:nginx /usr/vue/learning-report/dist/
# nuxt-ssr
# learning-report
> 请先查看每个目录的 md 文件
> nuxt ssr layout
## 启动
```shell script
npm run start
```
## Build Setup
## 编译打包
```shell script
#开发环境
npm run build:dev
#预发环境
npm run build:pre
#生产环境
npm run build:prod
#测试环境
npm run build:test
```
``` bash
# install dependencies
$ npm run install
## 插件配置
```js
module.exports = {
// 插件配置项
pluginOptions: {
// 蛮牛配置
pica: {
// CDN扩展JS资源排序: ['lodash', 'vue', 'vuex']
jsSort: [],
// CDN扩展CSS资源排序: ['vant.css']
cssSort: [],
// 骨架屏渲染的路由(手动配置)
skeletonRoutes: [
{
path: '/demo',
name: 'Demo',
meta: {
skeleton: true
}
},
],
// 启用自动配置骨架屏渲染路由
enableAutoSkeletonRoutes: false,
// 路由模式
routeMode: 'history',
// 骨架屏一次渲染几个路由
dpsLimit: 5,
// dps骨架屏渲染本地服务配置
dpsServer: {}
},
// 图片压缩
tinypng: {
key: ''
},
// 自动路由配置
autoRouting: {
chunkNamePrefix: 'page-'
}
}
};
# serve with hot reload at localhost:3000
$ npm run dev
```
# build for production and launch server
# 有环境变量 非本地打包请自行带上ENV => dev, test, uat, prod
$ ENV=上一行的变量 npm run build // eg: ENV=dev npm run build
$ npm run start // 对于 start 命令,可以根据需求自行 更改PORT (有部署冲突的时候会改)
## dpsServer
### port
服务监听端口,默认从8000开始查找可用端口
# generate static project // 暂时用不到
$ npm run generate
```
\ No newline at end of file
### proxy
反向代理中间件配置 @See [http-proxy-middleware](https://github.com/chimurai/http-proxy-middleware)
如果需要自定义返回:
```js
{
proxy: {
'^/app-gateway': (req, res, next) => {
res.json({ code: 200, data: {} });
res.end();
}
}
}
```
## 图片压缩
> 需要在`vue.config.js`中配置`pluginOptions.tinypng.key`的值。
```shell script
npm run tinypng
```
## 调用生成器
```shell script
vue invoke pica
```
## 根据 pica.prompts 生成封闭式模板
```shell script
npm run core
```
## 使用骨架屏
> 框架默认已开启骨架屏渲染。请查看`vue.config.js`
### 自动根据路由配置
需要在路由页面文件配置`route`
```json
{
"meta": {
"skeleton": true
}
}
```
如需自定义骨架
```json
{
"meta": {
"skeleton": {
"name": "必须和路由定义的name一致",
"path": "匹配当前路由的正则",
"pathname": "访问路由的path地址,例如: /mn/demo",
"skeletonId": "骨架屏路由ID,唯一即可"
}
}
}
```
## Jenkinsfile 构建
在 Jenkinsfile 文件中 `versionType = 'Patch';`,versionType 默认为 Patch,为小版本更新,1.2.3 对应 Major.Minor.Patch。
```bash
npm run build:test versionType:Patch
```
## 后台API接口反向代理
### 本地
如果`VUE_APP_MOCK_USER_INFO`不为空则走代理到本地。并且会在接口地址前加上`/proxy`.
默认会把`/proxy`的接口代理到`http://localhost:8081。
如需修改,请查看项目根目录的`.proxy.js`文件
### 走网关
如果`VUE_APP_MOCK_USER_INFO`为空则走代理到网关。并且会在接口地址前加上`/proxy/app-gateway`.
会把`/proxy`的接口代理到`VUE_APP_SERVICE_URL`环境变量,如该变量为空则默认为``
const path = require('path');
function resolve (dir) {
return path.join(__dirname, dir);
}
module.exports = {
resolve: {
alias: {
'@': resolve('src'),
'mn-template': resolve('node_modules/@pica-cli/vue-cli-plugin-pica-cli-plugin/core/src')
}
}
};
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
],
plugins: [
'@babel/plugin-proposal-object-rest-spread'
]
};
<!-- 提示信息:报表专用 -->
<template>
<div class="tips-info-wrapper">
<span>{{content}}</span>
</div>
</template>
<script>
export default {
props: {
content: {
type: String,
default: '报表数据来源包括用户参加正式考试,不包含摸底考试'
}
}
}
</script>
<style lang="less" scoped>
.tips-info-wrapper {
height: 44px;
line-height: 44px;
font-size: 20px;
padding: 0 15px;
text-align: center;
span {
display: inline-block;
width: 100%;
font-size: 13px;
font-weight: 400;
color: #676869;
}
}
</style>
\ No newline at end of file
<!-- 提示信息 -->
<template>
<div class="tips-info-wrapper">
<span>{{content}}</span>
</div>
</template>
<script>
export default {
props: {
content: {
type: String,
default: '报表数据来源包括用户参加正式考试,不包含摸底考试'
}
}
}
</script>
<style lang="less" scoped>
.tips-info-wrapper {
height: 44px;
line-height: 44px;
font-size: 20px;
padding: 0 15px;
span {
display: inline-block;
width: 100%;
font-size: 13px;
font-weight: 400;
color: #676869;
border-bottom: 1px solid #F0F1F2;
}
}
</style>
\ No newline at end of file
<!-- Tabs组件 -->
<template>
<div class="common-tabs-wrapper" :class="{'fixed': needFixed}">
<div class="sub-wrapper" :class="{'fixed': needFixed}">
<ul class="common-tabs" id="tabsWrapperId">
<li :id="'tabsItem' + index"
v-show="(item === '总体概况'
|| item === '人群分析'
|| item === '课程分析' && projectInfo.existCourse === 1)
|| (item === '考试分析' && projectInfo.existExam === 1)
|| (item === '学习效果分析' && projectInfo.existEffect === 1)"
v-for="(item, index) in tapList"
:class="{'active': index === cIndex}"
:key="index"
@click="clickTab(index)"
>{{item}}</li>
</ul>
<span class="over"></span>
<span class="border"></span>
</div>
</div>
</template>
<script>
export default {
data() {
return {
cIndex: 0,
tapList: [
"总体概况",
"人群分析",
"课程分析",
"考试分析",
"学习效果分析"
]
};
},
props: {
projectInfo: {
type: Object
},
needFixed: {
type: Boolean,
default: false
}
},
mounted() {},
methods: {
clickTab(index) {
this.cIndex = index;
this.$emit("tabClicked", index);
let tabsItemId = 'tabsItem' + index;
}
}
};
</script>
<style lang="less" scoped>
.common-tabs-wrapper {
.sub-wrapper {
display: flex;
position: relative;
width: 100%;
top: 0;
left: 0;
z-index: 1;
font-size: 13px;
width: 100%;
white-space: nowrap;
&.fixed {
position: fixed;
top: 70px;
width: 100%;
z-index: 1000000000;
background: #fff;
white-space: nowrap;
overflow-x: auto;
}
}
display: flex;
position: relative;
width: 100%;
top: 0;
left: 0;
z-index: 1000000000;
font-size: 13px;
.common-tabs {
width: 100%;
white-space: nowrap;
overflow-x: auto;
padding: 9px 0;
font-size: 13px;
// padding: 5px 0;
li {
display: inline-block;
height: 30px;
line-height: 30px;
font-size: 13px;
font-weight: 700;
margin: 0 6px;
color: #979899;
background: #f0f1f2;
padding: 0 12px;
border-radius: 30px;
&:first-child {
margin-left: 15px;
}
&:last-child {
margin-right: 15px;
}
&.active {
color: #449284;
background: #e3efed;
}
}
margin-top: 0;
}
.over {
display: block;
position: absolute;
bottom: 0px;
left: 0;
width: 100%;
height: 9px;
z-index: 10000000;
background: #fff;
}
.border {
display: block;
width: 100%;
height: 1px;
bottom: 0px;
left: 0;
border-bottom: 1px solid #f0f1f2;
position: absolute;
z-index: 10000000;
}
}
</style>
<!-- 选择地区组件 -->
<template>
<div class="select-wrapper" @touchmove.prevent.stop>
<div class="mask" @click="cancelSelect" @touchmove.prevent.stop>
<div class="address-wrap" @click.stop @touchmove.prevent.stop>
<div class="tip-header">
<span class="cancel-btn" @click="cancelSelect">取消</span>
<h3>选择地区</h3>
<button class="submit-btn" @click="confirm">确定</button>
<!-- <button :disabled="isDisabled" class="submit-btn" @click="confirm">确定</button> -->
</div>
<div class="my-org" v-show="areaList.currentOrgList.length">
<span>我所在机构</span>
<ul >
<li
class="list"
v-for="(provinceItem, index) in areaList.currentOrgList"
:key="index"
:class="{ active: provinceItem.selected }"
@click="provinceSelect(provinceItem, index, true)"
>
<span>{{ provinceItem.label }}</span>
<span v-show="provinceItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
</div>
<div class="address-select">
<ul class="show-address-header">
<li :class="{ active: isShowProvince }" class="item" @click="tabAddressClick(1)">
{{
value.provinceName
? value.provinceName
: '请选择'
}}
</li>
<li
v-show="value.provinceName && value.provinceName != '全部' && rank > 1 && areaList.cityList.length"
:class="{ active: isShowCity }"
class="item"
@click="tabAddressClick(2)"
>{{ value.cityName ? value.cityName : '请选择' }}</li>
<li
v-show="value.cityName && rank > 2 && areaList.countyList.length"
:class="{ active: isShowCounty }"
class="item"
@click="tabAddressClick(3)"
>
{{
value.countyName ? value.countyName : '请选择'
}}
</li>
<li
v-show="value.countyName && rank > 3 && areaList.townList.length"
:class="{ active: isShowTown }"
class="item"
@click="tabAddressClick(4)"
>{{ value.townName ? value.townName : '请选择' }}</li>
<li
v-show="value.townName && rank > 4 && areaList.newOrgList.length"
:class="{ active: isShowOrg }"
class="item"
@click="tabAddressClick(5)"
>{{ value.newOrgName ? value.newOrgName : '请选择' }}</li>
</ul>
<div class="address-content" @touchmove.stop>
<ul v-show="isShowProvince" id="province">
<li
v-for="(provinceItem, index) in areaList.provinceList"
:key="index"
:class="{ active: provinceItem.selected }"
@click="provinceSelect(provinceItem, index)"
>
<span>{{ provinceItem.label }}</span>
<span v-show="provinceItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
<ul v-show="isShowCity" id="city">
<li
v-for="(cityItem, index) in areaList.cityList"
:key="index"
:class="{ active: cityItem.selected }"
@click="citySelect(cityItem, index)"
>
<span>{{ cityItem.label }}</span>
<span v-show="cityItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
<ul v-show="isShowCounty" id="county">
<li
v-for="(countyItem, index) in areaList.countyList"
:key="index"
:class="{ active: countyItem.selected }"
@click="countySelect(countyItem, index)"
>
<span>{{ countyItem.label }}</span>
<span v-show="countyItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
<ul v-show="isShowTown" id="town">
<li
v-for="(townItem, index) in areaList.townList"
:key="index"
:class="{ active: townItem.selected }"
@click="townSelect(townItem, index)"
>
<span>{{ townItem.label }}</span>
<span v-show="townItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
<ul v-show="isShowOrg" id="org">
<li
v-for="(orgItem, index) in areaList.newOrgList"
:key="index"
:class="{ active: orgItem.selected }"
@click="orgSelect(orgItem, index)"
>
<span>{{ orgItem.label }}</span>
<span v-show="orgItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from "vuex";
import { getAreaOrOrgList } from "../../service";
export default {
name: "PicaArea",
data() {
return {
areaList: {
currentOrgList: [],
provinceList: [],
cityList: [],
countyList: [],
townList: [],
newOrgList: []
},
value: {
cityId: "",
cityName: "",
countyId: "",
countyName: "",
provinceId: "",
provinceName: "",
townId: "",
townName: "",
newOrgId: "",
newOrgName: "",
regionId: "",
areaDegree: 0,
},
isDisabled: true,
isShowProvince: true,
isShowCity: false,
isShowCounty: false,
isShowTown: false,
isShowOrg: false,
// 区域选择通用接口参数
queryParams: {
projectId: 374,
regionId: ""
},
currentOrgList: []
};
},
props: {
baseUrl: {
type: String,
default: ""
},
rank: {
type: Number | String,
default: 5
}
},
created() {
if (process.client) {
if (this.$route && this.$route.query) {
let cQuery = this.$route.query;
let hospitalIdList = cQuery.hospitalIdList || "";
this.queryParams.projectId = cQuery.projectId || "";
}
}
},
mounted() {
},
computed: {
...mapGetters({
projectId: "projectId",
provinceList: "provinceList"
})
},
watch: {
projectId(newVal) {
this.queryParams.projectId = newVal;
},
provinceList(newVal) {
newVal[0].selected = true;
this.value.provinceName = newVal[0].label;
this.value.areaDegree = newVal[0].degree;
this.value.regionId = newVal[0].id;
this.value.provinceId = newVal[0].id;
this.queryParams.regionId = newVal[0].id;
this.value.provinceName = newVal[0].label;
// this.areaList.provinceList = newVal;
// this.areaList.provinceList[0].selected = true;
// this.value.provinceName = this.areaList.provinceList[0].label;
// this.value.areaDegree = this.areaList.provinceList[0].degree;
// 包含所在机构
if(newVal[0].containHospitalFlag == 1) {
// this.value.provinceName = newVal[1].label;
// this.value.provinceName = '请选择';
this.areaList.currentOrgList = newVal.slice(0, 1);
this.areaList.provinceList = newVal.slice(1);
} else {
this.areaList.currentOrgList = [];
this.areaList.provinceList = newVal;
}
// this.value.provinceName = "全部";
}
},
methods: {
// 映射Store中的Actions
...mapActions({
setOrgList: "setOrgList",
}),
// 获取省列表
async getProvinceData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
this.areaList.provinceList = (res.data && res.data.list) || [];
this.areaList.provinceList.map(a => {
if (a.id == this.value.provinceId) {
a.selected = true;
}
});
}
});
},
// 获取城市列表
async getCityData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
this.areaList.cityList = (res.data && res.data.list) || [];
if (this.areaList.cityList.length === 0) {
this.isShowProvince = true;
this.isShowCity = false;
this.isDisabled = false;
}
this.areaList.cityList.map(a => {
if (a.id == this.value.cityId) {
a.selected = true;
}
});
}
});
},
// 获取区/县列表
async getCountyData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
this.areaList.countyList = (res.data && res.data.list) || [];
if (this.areaList.countyList.length === 0) {
this.isShowProvince = false;
this.isShowCity = true;
this.isShowCounty = false;
this.isDisabled = false;
}
this.areaList.countyList.map(a => {
if (a.id == this.value.countyId) {
a.selected = true;
}
});
}
});
},
// 获取乡/镇列表
async getTownData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
this.areaList.townList = (res.data && res.data.list) || [];
if (this.areaList.townList.length === 0) {
this.isShowProvince = false;
this.isShowCity = false;
this.isShowCounty = true;
this.isShowTown = false;
this.isDisabled = false;
}
this.areaList.townList.map(a => {
if (a.id == this.value.townId) {
a.selected = true;
}
});
}
});
},
// 获取最后一级的机构列表
async getOrgData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
this.areaList.newOrgList = (res.data && res.data.list) || [];
if (this.areaList.newOrgList.length === 0) {
this.isShowProvince = false;
this.isShowCity = false;
this.isShowCounty = false;
this.isShowTown = true;
this.isShowOrg = false;
this.isDisabled = false;
}
this.areaList.newOrgList.map(a => {
if (a.id == this.value.townId) {
a.selected = true;
}
});
}
});
},
// 选择省份的操作
provinceSelect(item, idx, isCurrent) {
this.value.regionId = item.id;
this.value.provinceId = item.id;
this.queryParams.regionId = item.id;
this.value.provinceName = item.label;
this.value.cityId = null;
this.value.cityName = "";
this.value.countyId = null;
this.value.countyName = "";
this.value.townId = null;
this.value.townName = "";
this.value.newOrgId = null;
this.value.newOrgName = ""
// 当前选中的样式
this.areaList.provinceList.map(a => (a.selected = false));
if(isCurrent) {
this.areaList.currentOrgList.map(a => (a.selected = true));
} else {
this.areaList.currentOrgList.map(a => (a.selected = false));
this.areaList.provinceList[idx].selected = true;
}
// this.areaList.provinceList.map(a => (a.selected = false));
// this.areaList.provinceList[idx].selected = true;
this.value.areaDegree = item.degree;
if (item.degree == 0) {
return;
}
//控制省市县乡数据展示与隐藏
this.isShowProvince = false;
this.isShowCounty = false;
this.isShowTown = false;
if (this.rank > 1 && item.degree != 5) {
this.isShowCity = true;
this.isDisabled = true;
this.getCityData(this.queryParams);
} else {
this.isShowProvince = true;
this.isShowCity = false;
this.isDisabled = false;
this.areaList.cityList = [];
this.areaList.countyList = [];
this.areaList.townList = [];
this.areaList.newOrgList = [];
}
},
// 选择市的操作
citySelect(item, idx) {
this.value.regionId = item.id;
this.value.cityId = item.id;
this.queryParams.regionId = item.id;
this.value.cityName = item.label;
this.value.countyId = null;
this.value.countyName = "";
this.value.townId = null;
this.value.townName = "";
this.value.newOrgId = null;
this.value.newOrgName = ""
// 当前选中的样式
this.areaList.cityList.map(a => (a.selected = false));
this.areaList.cityList[idx].selected = true;
this.value.areaDegree = item.degree;
if (item.degree == 0) {
return;
}
// 控制省市县乡数据展示与隐藏
this.isShowProvince = false;
this.isShowCity = false;
this.isShowTown = false;
if (this.rank > 2 && item.degree != 5) {
this.isShowCounty = true;
this.isDisabled = true;
this.getCountyData(this.queryParams);
} else {
this.isShowProvince = false;
this.isShowCity = true;
this.isShowCounty = false;
this.isDisabled = false;
this.areaList.countyList = [];
this.areaList.townList = [];
this.areaList.newOrgList = [];
}
},
// 选择区/县的操作
countySelect(item, idx) {
this.value.regionId = item.id;
this.value.countyId = item.id;
this.queryParams.regionId = item.id;
this.value.countyName = item.label;
this.value.townId = null;
this.value.townName = "";
this.value.newOrgId = null;
this.value.newOrgName = ""
// 当前选中的样式
this.areaList.countyList.map(a => (a.selected = false));
this.areaList.countyList[idx].selected = true;
this.value.areaDegree = item.degree;
if (item.degree == 0) {
return;
}
// 控制省市县乡数据展示与隐藏
this.isShowProvince = false;
this.isShowCity = false;
this.isShowCounty = false;
if (this.rank > 3 && item.degree != 5) {
this.isShowTown = true;
this.isDisabled = true;
this.getTownData(this.queryParams);
} else {
this.isShowProvince = false;
this.isShowCity = false;
this.isShowCounty = true;
this.isShowTown = false;
this.isDisabled = false;
this.areaList.townList = [];
this.areaList.newOrgList = [];
}
},
// 选择乡镇的操作
townSelect(item, idx) {
this.value.regionId = item.id;
this.value.townId = item.id;
this.queryParams.regionId = item.id;
this.value.townName = item.label;
this.value.newOrgId = null;
this.value.newOrgName = ""
this.value.areaDegree = item.degree;
if (item.degree == 0) {
return;
}
// 当前选中的样式
this.areaList.townList.map(a => (a.selected = false));
this.areaList.townList[idx].selected = true;
this.isDisabled = false;
if (this.rank > 4 && item.degree != 5) {
this.isShowTown = false;
this.isShowOrg = true;
this.isDisabled = true;
this.getOrgData(this.queryParams);
} else {
this.isShowProvince = false;
this.isShowCity = false;
this.isShowCounty = false;
this.isShowTown = true;
this.isDisabled = false;
this.areaList.newOrgList = [];
}
},
// 选择最后一级机构
orgSelect(item, idx) {
this.value.regionId = item.id;
this.value.newOrgId = item.id;
// this.queryParams.regionId = item.id;
this.value.newOrgName = item.label;
this.value.areaDegree = item.degree;
if (item.degree == 0) {
return;
}
// 当前选中的样式
this.areaList.newOrgList.map(a => (a.selected = false));
this.areaList.newOrgList[idx].selected = true;
this.isDisabled = false;
},
tabAddressClick(tab) {
if (tab === 1) {
this.isShowProvince = true;
this.isShowCity = false;
this.isShowCounty = false;
this.isShowTown = false;
this.isShowOrg = false;
} else if (tab === 2) {
this.isShowProvince = false;
this.isShowCity = true;
this.isShowCounty = false;
this.isShowTown = false;
this.isShowOrg = false;
} else if (tab === 3) {
this.isShowProvince = false;
this.isShowCity = false;
this.isShowCounty = true;
this.isShowTown = false;
this.isShowOrg = false;
} else if (tab === 4) {
this.isShowProvince = false;
this.isShowCity = false;
this.isShowCounty = false;
this.isShowTown = true;
this.isShowOrg = false;
} else if (tab === 5) {
this.isShowProvince = false;
this.isShowCity = false;
this.isShowCounty = false;
this.isShowTown = false;
this.isShowOrg = true;
}
},
confirm() {
this.$emit("confirm", this.value);
},
cancelSelect() {
this.$emit("cancel", false);
}
}
};
</script>
<style lang="less" scoped>
.select-wrapper {
font-family: PingFangSC-Regular;
.mask {
position: fixed;
z-index: 1000000015;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(55, 56, 57, 0.6);
}
.address-wrap {
position: absolute;
width: 100%;
// height: 353px;
// height: 293px;
background-color: #ffffff;
box-sizing: border-box;
bottom: 0;
left: 0;
right: 0;
z-index: 1000000016;
.tip-header {
position: relative;
height: 58px;
line-height: 58px;
width: 100%;
font-size: 17px;
display: flex;
justify-content: space-between;
padding: 0 15px;
box-sizing: border-box;
.cancel-btn {
color: #999;
}
h3 {
font-size: 18px;
color: #373839;
font-weight: 400;
}
.submit-btn {
font-size: 17px;
outline: none;
border: 1px solid transparent;
background-color: transparent;
color: #449284 !important;
&:disabled {
color: #c7c8c9;
}
}
}
.address-select {
width: 100%;
height: auto;
/*height: 196px;*/
box-sizing: border-box;
.show-address-header {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
position: relative;
padding-bottom: 4px;
margin: 0 7px;
&:after {
content: " ";
position: absolute;
left: 0;
bottom: 0;
right: 0;
height: 1px;
border-bottom: 1px solid #f0f1f2;
color: #f0f1f2;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.item {
display: inline-block;
font-size: 15px;
line-height: 35px;
height: 35px;
padding: 0 8px;
// padding-right: 15px;
box-sizing: border-box;
max-width: 23%;
min-width: 50px;
text-align: left;
color: #676869;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
// flex: 1 0 auto;
&:last-of-type {
padding-right: 15px;
}
&.active {
color: #373839;
font-family: PingFangSC-Medium;
/*font-weight:500;*/
}
&.active:after {
content: " ";
position: absolute;
left: 50%;
bottom: 0;
right: 0;
width: 10px;
height: 3px;
/*border-radius: 2px;*/
border-radius: 30%;
text-align: center;
background-color: #449284;
transform: translateX(-50%);
}
}
}
.address-content {
position: relative;
width: 100%;
// height: 100%;
height: 196px;
overflow: hidden;
box-sizing: border-box;
ul {
width: 100%;
height: 196px;
overflow-y: auto;
box-sizing: border-box;
padding: 10px 13px;
-webkit-overflow-scrolling: touch;
position: static;
-webkit-transform: translateZ(0px);
li {
height: 35px;
line-height: 35px;
font-size: 15px;
width: 100%;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #676869;
cursor: pointer;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: space-between;
-webkit-justify-content: space-between;
&.active {
color: #449284;
}
img {
width: 10px;
height: 10px;
}
}
}
}
}
}
.my-org {
margin: 0 15px 15px;
& > span {
font-size: 12px;
color: #979899;
}
.list {
display: flex;
flex-direction: row;
justify-content: space-between;
margin-top: 4px;
span {
font-size: 15px;
color: #676869;
}
img {
width: 10px;
}
}
}
}
</style>
\ No newline at end of file
let dpsConfig = require('@pica-core/dps-config');
const externalsDpsConfig = {};
dpsConfig = {
...dpsConfig,
...externalsDpsConfig
};
module.exports = dpsConfig;
module.exports = [
/* {
name: 'payOrder',
url: 'payOrder'
}*/
];
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Error</title>
</head>
<body>
An error occurred on the server when processing the URL. Please contact the system administrator!
</body>
</html>
{"eb52be7e66c51a0984c4071656521581":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/arr-down-gray.png","d6d3c14b51ff6236db89d1a63b99e097":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/arr-down-white.png","cf1d8782d409a91bd21c1ca3d1033df8":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/arr-down.png","26006d17c4f0a1f7175db864fb29a884":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/arr-selected.png","514fb2bb937b9bef5160c1ed8f485a6a":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/arr-up.png","b81fd33e3bbbea474755d4e4eaf86c37":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/kf.png","9cbb287ec70ff079eedaa81b9afa5df1":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/left-array-black.png","86384dec95e51dce91ee681d2560f37b":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/left-arrow-black.png","1cedfe0e695b56a714919102ca2407c2":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/map-icon.png","7f50214c6a8d4452cf0d6d852fe3330f":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/no-content.png","c7395bde31d5fa141771aab25dce2e2c":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/org.png","9cb816774aac05197cab83f037012ad4":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/pub-time.png","4e865f4817ba4a0454d81095e689f86f":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/rank-1.png","fb0762ecc1e19e3ceb111178279ec626":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/rank-2.png","ea862d99ba6b214b086466a7fb8c77db":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/rank-3.png","4a96286e5b4bcdd65f31d2b36dbe9567":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/right-arrow-grey.png","26607cd1e8dc09440c5b14b432641b34":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/sort-select-icon.png","79ce3fe37ce625360ee9a6079f7f209c":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/tips-1.png","d65cd3a583f87a4774fde8e7a79e166a":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/tips-2.png","992acc8f370f9c252116feb06391a198":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/tips-3.png","db55b2e8292837771d9fd85cb0a66c36":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/what-content-1.png","94e55f41716cb13bda15884125000f8f":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/what-content-2.png","49a6ab331d5c7e8288d54aed12ccb51e":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/what-icon-1.png","6f2938a39189562e337e1d8d4260382b":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/what-icon-2.png","313e7ec48a9413b3c9143c6b1b2d022f":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/what-icon-title.png","0f452ea29b01b0f3d758462882c9f298":"/Users/evan/Desktop/pica/pica-learning-report/src/assets/images/what.png"}
\ No newline at end of file
module.exports = {
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/$1',
'^~/(.*)$': '<rootDir>/$1',
'^vue$': 'vue/dist/vue.common.js'
},
moduleFileExtensions: ['js', 'vue', 'json'],
transform: {
'^.+\\.js$': 'babel-jest',
'.*\\.(vue)$': 'vue-jest'
},
'collectCoverage': true,
'collectCoverageFrom': [
'<rootDir>/components/**/*.vue',
'<rootDir>/pages/**/*.vue'
]
}
<template>
<div>
<nuxt />
</div>
</template>
<style>
</style>
worker_processes auto;
#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;
#pid logs/nginx.pid;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
#隐藏版本号
server_tokens off;
#log_format main '$remote_addr - $remote_user [$time_local] "$request" '
# '$status $body_bytes_sent "$http_referer" '
# '"$http_user_agent" "$http_x_forwarded_for"';
#access_log logs/access.log main;
sendfile on;
#tcp_nopush on;
#keepalive_timeout 0;
keepalive_timeout 65;
gzip on;
client_max_body_size 20m;
server {
listen 80;
server_name_in_redirect off;
server_name *.picahealth.com;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root /usr/vue/learning-report/dist/;
# if (-d $request_filename) {
# rewrite ^/(.*)([^/])$ https://$host/learning-report/$1$2/ permanent;
# }
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
#
error_page 404 405 500 502 503 504 /error.html;
location = /error.html {
root /usr/share/nginx/html;
}
# proxy the PHP scripts to Apache listening on 127.0.0.1:80
#
#location ~ \.php$ {
# proxy_pass http://127.0.0.1;
#}
# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
#
#location ~ \.php$ {
# root html;
# fastcgi_pass 127.0.0.1:9000;
# fastcgi_index index.php;
# fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;
# include fastcgi_params;
#}
# deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
#location ~ /\.ht {
# deny all;
#}
}
# another virtual host using mix of IP-, name-, and port-based configuration
#
#server {
# listen 8000;
# listen somename:8080;
# server_name somename alias another.alias;
# location / {
# root html;
# index index.html index.htm;
# }
#}
}
const path = require('path');
const axios = require('axios')
const axios = require('axios');
const fs = require('fs');
const projectName=require('./package.json').name
const projectName = require('./package.json').name;
const filePath = path.join(__dirname, 'src');
// 先删除文件
function deleOldJson(){
function deleOldJson() {
const json_path = path.join(__dirname, 'src/menu_code.json');
try{
fs.unlinkSync(json_path);
}catch(err){
console.log("没有json 文件")
}catch(err) {
console.log('没有json 文件');
}
};
deleOldJson()
}
deleOldJson();
// 文件夹是不是存在
function isFileExisted(filePath) {
return new Promise((resolve, reject) => {
......@@ -23,39 +22,40 @@ function isFileExisted(filePath) {
return reject(false);
} else {
return resolve(true);
}
}
});
});
}
// 请求接口获取menucode
function getMenuCode() {
let url="https://sc.yunqueyi.com/basic-data/menuCode/fetch";
//let url="https://dev-sc.yunqueyi.com/basic-data/menuCode/fetch";
axios.get(url, {params:{"projectName":projectName}})
const url = 'https://sc.yunqueyi.com/basic-data/menuCode/fetch';
// let url="https://dev-sc.yunqueyi.com/basic-data/menuCode/fetch";
console.log(projectName);
axios.get(url, {params:{'projectName':projectName}})
.then(res => {
let resData=res.data;
if(resData.code=="000000"){
if(!resData.data){
console.log("接口data 数据为空");
return
const resData = res.data;
if(resData.code == '000000') {
if(!resData.data) {
console.log('接口data 数据为空');
return;
}
console.log(resData.data.menuCodeDtoList);
return writerJsonFile(JSON.stringify(resData.data.menuCodeDtoList));
}else{
console.log("获取接口失败");
console.log('获取接口失败');
}
}).catch(error => {
console.error('请求menu接口失败error',error);
console.error('请求menu接口失败error', error);
});
}
// 写入json 文件
function writerJsonFile(data) {
const wpath = filePath + '/menu_code.json';
fs.writeFileSync(wpath, data);
console.log("写入文件成功");
console.log('写入文件成功');
}
// 创建目录
function createFiles(filePath) {
return new Promise((resolve, reject) => {
fs.mkdir(filePath, function(err) {
if(!err) {
getMenuCode();
......@@ -63,12 +63,10 @@ function createFiles(filePath) {
console.log('创建目录失败');
}
});
});
}
isFileExisted(filePath).then(res => {
isFileExisted(filePath).then(() => {
return getMenuCode();
}).catch(err => {
}).catch(() => {
// 没有文件创建文件
createFiles(filePath);
});
module.exports = {
mode: 'universal',
/*
** Headers of the page
*/
head: {
title: '云鹊医-学情报告',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui' },
{ name: 'screen-orientation', content: 'portrait' },
{ name: 'apple-mobile-web-app-capable', content: 'yes' },
{ name: 'format-detection', content: 'telephone=no' },
{ name: 'full-screen', content: 'yes' },
{ name: 'x5-fullscreen', content: 'true' },
{ name: 'x5-fullscreen', content: 'true' },
{ name: 'referrer', content: 'never' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
// { rel: 'stylesheet', href: '/css/common.css' }
],
style: [
{ cssText: `
@charset "utf-8";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:PingFangSC-Regular,-apple-system-font,Source Han Sans,Helvetica Neue,sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}
`, type: 'text/css' }
],
__dangerouslyDisableSanitizers: ['script'],
script: [
{ innerHTML: `
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
`, type: 'text/javascript', charset: 'utf-8'}
]
},
/*
** Customize the progress-bar color
*/
loading: { color: '#fff' },
/*
** Global CSS
*/
css: [
'vant/lib/index.css'
],
/*
** Plugins to load before mounting the App
*/
plugins: [
{
src: '~/plugins/vue-inject',
ssr: false
}
],
/*
** Nuxt.js modules
*/
modules: [],
/*
** Build configuration
*/
router: {
base: '/lreport_ssr/', // 上下文根据自己的需求自行打开修改
// base: '/detection/' 上下文根据自己的需求自行打开修改
extendRoutes(routes, resolve){
if(process.env.NUXT_ENV_APP=="uat"){
var handleAllRouter=require("./src/public_uat_ssr.js");
let base=this.base;
let ObjParms={
routes:routes,
baseUrl:base,
fullHost:"https://phome.yunqueyi.com"
}
handleAllRouter(ObjParms);
}
}
},
build: {
postcss: {
plugins: {
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*']
}
}
},
extractCSS: true,
filenames: {
app: ({ isDev }) => isDev ? '[name].js' : '[name].[chunkhash:7].js',
chunk: ({ isDev }) => isDev ? '[name].js' : '[name].[chunkhash:7].js',
css: ({ isDev }) => isDev ? '[name].css' : '[name].[contenthash:7].css',
img: ({ isDev }) => isDev ? '[path][name].[ext]' : 'img/[name].[hash:7].[ext]',
font: ({ isDev }) => isDev ? '[path][name].[ext]' : 'fonts/[name].[hash:7].[ext]',
video: ({ isDev }) => isDev ? '[path][name].[ext]' : 'videos/[name].[hash:7].[ext]'
},
/*
** You can extend webpack config here
*/
extend(config, ctx) {
config.devtool = ['dev', 'test'].indexOf(process.env.NUXT_ENV_APP) !== -1 ? 'source-map' : false;
}
}
}
\ No newline at end of file
/* eslint-disable */
const fs = require('fs');
const path = require('path');
const program = require('commander');
const pathError = path.resolve(process.cwd(), './.error-log')
const ResetPathFile = require('@pica-core/reset-pathfile-plugin');
program
.command('mode <mode>')
.description('备份log日志')
.action(function (mode) {
// 判断.error-log文件是否存在
fs.stat(pathError, (err, stats) => {
// 如果不存在,就正常执行
if (err) {
console.log('正常执行!');
} else {
new ResetPathFile(mode, 1);
}
});
});
program
.command('check <value>')
.description('检查.error-log是否已删除')
.action(function (mode) {
// 判断.error-log文件是否存在
fs.stat(pathError, (err, stats) => {
// 如果不存在,就正常执行
if (err) {
console.log('正常执行!');
} else {
// 如果存在,执行下面的脚本
fs.unlink(pathError, (err) => {
if (err) throw err;
console.log('.error-log文件已被删除');
throw new Error('请联系运维同学去oss服务器手动copy版本控制相关文件');
});
}
});
});
program.parse(process.argv);
因为 它太大了无法显示 源差异 。您可以改为 查看blob
{
"name": "learning-report",
"version": "1.0.0",
"description": "nuxt ssr layout",
"author": "souse",
"version": "0.1.0",
"private": true,
"scripts": {
"test": "jest",
"dev": "cross-env NODE_ENV=development NUXT_ENV_APP=dev HOST=0.0.0.0 PORT=4001 nodemon server/index.js --watch server",
"build": "NUXT_ENV_APP=${ENV} nuxt build",
"start": "cross-env NUXT_ENV_APP=${ENV} HOST=0.0.0.0 PORT=3100 NODE_ENV=production node server/index.js",
"generate": "nuxt generate"
"serve": "pica-cli-service serve",
"build": "pica-cli-service build",
"lint": "pica-cli-service lint",
"add-all": "pica-cli-service add-all",
"build-skeleton": "pica-cli-service build-skeleton",
"build:dev": "pica-cli-service build --mode dev",
"build:prod": "pica-cli-service build --mode production",
"build:report": "pica-cli-service build --report",
"build:test": "pica-cli-service build --mode testing",
"build:uat": "pica-cli-service build --mode uat",
"core": "pica-cli-service core",
"img-md5": "pica-cli-service img-md5",
"page": "vue-cli-service page",
"skeleton": "pica-cli-service skeleton",
"tinypng": "pica-cli-service tinypng"
},
"dependencies": {
"@pica-core/web-buried-point": "^1.0.19",
"@pica-kit/pica-topic-stencil": "^2.0.5",
"axios": "^0.19.2",
"clipboard": "^2.0.6",
"cookie-universal": "^2.0.16",
"core-js": "^3.19.3",
"cross-env": "^5.2.0",
"echarts": "^4.4.0",
"dayjs": "^1.8.30",
"dsbridge": "^3.1.4",
"js-base64": "^2.5.1",
"lodash": "^4.17.15",
"md5": "^2.3.0",
"pica-guide-app": "^1.0.5",
"pica-h5-agreement": "^1.0.13",
"pica-h5-login": "^2.0.1",
"pica-topic-stencil": "2.0.12",
"pre-commit": "^1.2.2",
"vant": "^2.8.4",
"vconsole": "^3.3.4",
"vue": "^2.6.11",
"vue-clipboard2": "^0.3.1",
"vue-fragment": "^1.5.1",
"vue-router": "^3.3.1",
"vuescroll": "^4.15.1",
"vuex": "^3.1.1",
"web-buried-point": "^2.1.0",
"weixin-js-sdk": "^1.6.0",
"koa": "^2.6.2",
"nuxt": "^2.0.0",
"v-charts": "^1.19.0",
"vant": "^2.2.13",
"web-buried-point": "^2.1.0"
"v-charts": "^1.19.0"
},
"devDependencies": {
"@nuxtjs/axios": "^5.5.4",
"@babel/plugin-proposal-object-rest-spread": "^7.11.0",
"@pica-cli/pica-cli-framework": "^1.0.11",
"@pica-cli/vue-cli-plugin-pica-cli-plugin": "~1.1.52",
"@pica-core/multiple-versions-plugin": "^1.0.4",
"@pica-core/reset-pathfile-plugin": "^1.0.4",
"@pica-core/web-buried-point": "^1.0.20",
"@pica-kit/page-model": "^1.0.5",
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"babel-eslint": "^10.1.0",
"babel-plugin-import": "^1.13.0",
"colors-console": "^1.0.3",
"css-loader": "^6.5.1",
"dotenv": "^8.2.0",
"draw-page-structure": "^1.0.8",
"eslint": "^6.7.2",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-vue": "^6.2.2",
"fast-install-puppeteer": "^1.0.5",
"husky": "^3.0.9",
"less-loader": "^10.2.0",
"lint-staged": "^9.4.2",
"node-sass": "^4.13.1",
"postcss-px-to-viewport": "^1.1.1",
"prettier": "^2.3.2",
"prettier-eslint-cli": "^5.0.1",
"puppeteer": "^10.1.0",
"sass": "^1.26.3",
"sass-loader": "^8.0.2",
"vue-skeleton-webpack-plugin": "^1.2.2",
"vue-template-compiler": "^2.6.11",
"webpack-bundle-analyzer": "^4.4.2",
"@vue/test-utils": "^1.0.0-beta.27",
"babel-core": "7.0.0-bridge.0",
"babel-jest": "^24.1.0",
"jest": "^24.1.0",
"less": "^3.9.0",
"less-loader": "^5.0.0",
"node-sass": "^4.13.0",
"nodemon": "^1.18.9",
"postcss-pxtorem": "^4.0.1",
"qs": "^6.7.0",
"sass-loader": "^8.0.0",
"scss-loader": "^0.0.1",
"vue-jest": "^3.0.3"
}
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
],
"husky": {
"hooks": {
"pre-commit": "pica-cli-service img-md5 && lint-staged"
}
},
"lint-staged": {
"src/**/*.{js,vue}": [
"eslint --fix",
"git add"
],
"src/**/*.{js,vue,html,css,scss,sass}": [
"prettier-eslint --write",
"git add"
]
},
"pica-cli-service": {}
}
import Vue from 'vue'
import rocNative from '@/utils/jsbridge'
import echarts from 'echarts'
import { Toast } from 'vant';
import { BASE_URL } from '@/utils/enumerate';
import WebBuriedPoint, { sendBuriedData } from 'web-buried-point';
const { NUXT_ENV_APP } = process.env;
// Vue.use(WebBuriedPoint, {
// // component_tag: `467`,
// class_name: `learning_report`,
// url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`
// });
Vue.prototype.$sendBuriedData = sendBuriedData;
Vue.use(Toast);
// // "vconsole": "^3.3.4"
// import VConsole from 'vconsole/dist/vconsole.min.js' //import vconsole
// new VConsole() // 初始化
Vue.prototype.$echarts = echarts
Vue.prototype.$rocNative = new rocNative();
\ No newline at end of file
module.exports = {
plugins: {
autoprefixer: {},
'postcss-px-to-viewport': {
viewportWidth: 375, // 视口的宽度,对应的时设计稿的宽度/2,一般为750
viewportHeight: 667, // 视口的高度,对应的是设计稿的高度(也可以不配置)
unitPrecision: 5, // 指定‘px’转换为视口单位值的小数位数(很多时候无法整除)
viewportUnit: 'vw', // 指定需要转换成的视口单位,建议使用vw
selectorBlankList: ['ignore', 'tab-bar'],
minPixelValue: 1,
mediaQuery: false,
exclude:[/Tabbar/]
}
}
};
## 增加骨架屏占位 Dom #skeleton
```html
<div id="skeleton"></div>
<div id="app"></div>
```
## 初始化时间记录
```js
(function (window) {
var dsBridge = window.dsBridge;
function logToLocaleString(method) {
var date = new Date();
console.log(date.toLocaleString() + ':' + date.getMilliseconds(), method);
}
window.onNativeLCEvent = logToLocaleString;
window.onload = function () {
dsBridge && dsBridge.call && dsBridge.call('onLCEvent', 'onload');
logToLocaleString('onload');
}
document.addEventListener('DOMContentLoaded', function () {
dsBridge && dsBridge.call && dsBridge.call('onLCEvent', 'DOMContentLoaded');
logToLocaleString('DOMContentLoaded');
});
document.addEventListener('readystatechange', function () {
if (document.readyState == 'interactive') {
dsBridge && dsBridge.call && dsBridge.call('onLCEvent', 'interactive');
logToLocaleString('interactive');
}
if (document.readyState == 'complete') {
dsBridge && dsBridge.call && dsBridge.call('onLCEvent', 'complete');
dsBridge && dsBridge.call && dsBridge.call('forceHideLoading');
logToLocaleString('complete');
}
})
}(window));
```
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<script src="<%= VUE_APP_OSS_URL %>static/js/vue-2.6.11.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/vuex-3.4.0.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/vue-router-3.3.2.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/vant.min-2.12.26.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/axios-0.19.0.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/jsencrypt.min-3.0.0.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/crypto.min-4.0.0.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/vconsole-3.3.4.js"></script>
<script src="<%= VUE_APP_OSS_URL %>static/js/lodash-4.17.15.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.9.0-rc.1/echarts.min.js"></script>
</body>
</html>
const Koa = require('koa')
const consola = require('consola')
const { Nuxt, Builder } = require('nuxt')
const app = new Koa()
// Import and Set Nuxt.js options
const config = require('../nuxt.config.js')
config.dev = !(app.env === 'production')
async function start() {
// Instantiate nuxt.js
const nuxt = new Nuxt(config)
const {
host = process.env.HOST || '10.177.11.247' || '127.0.0.1',
port = process.env.PORT || 3000
} = nuxt.options.server
// Build in development
if (config.dev) {
const builder = new Builder(nuxt)
await builder.build()
} else {
await nuxt.ready()
}
app.use((ctx) => {
ctx.status = 200
ctx.respond = false // Bypass Koa's built-in response handling
ctx.req.ctx = ctx // This might be useful later on, e.g. in nuxtServerInit or with nuxt-stash
nuxt.render(ctx.req, ctx.res)
})
app.listen(port, host)
consola.ready({
message: `Server listening on http://${host}:${port}`,
badge: true
})
}
start()
import Axios from 'axios';
import { Toast } from 'vant';
import { API_CONFIG, REPONSE_CODE } from '@/utils/enumerate';
const { VUE_ENV } = process.env; // server or client
const cookies = require('cookie-universal')();
// const baseUrl = localStorage.getItem('baseUrl');
// const instance = axios.create({
// baseURL: baseUrl,
// timeout: 30000,
// });
Axios.interceptors.request.use(
config => {
// 0. Do something before request is sent
// 1. can be add loading
// 2. make sure if need token
const method = config.method.toLocaleLowerCase();
if (method === 'post' || method === 'put' || method === 'delete') {}
if (config.withCredentials) {
// config.headers.token = '3EB9111164E84A45B5B00428D52BC966';
config.headers.token = cookies.get('lreporttoken') || '568E9A4C115F47649BDA1B0B70D4B4F9';
}
// config.timeout = 30000;
return config;
},
error => {
// when set loading close it
if (
error.code === 'ECONNABORTED' &&
error.message.indexOf('timeout') !== -1
) {
VUE_ENV === 'client' && Toast({ message: '系统繁忙,请稍后重新进入页面查询', duration: 1000 });
// VUE_ENV === 'client' && Toast({ message: '请求超时', duration: 1000 });
}
return Promise.reject(error);
}
)
export default function(options) {
if (typeof options !== 'object') {
throw new Error('make sure the params options is an Object...');
}
const cf = JSON.parse(JSON.stringify(API_CONFIG));
options = Object.assign(cf, options); // 合并 config
return new Promise((resolve, reject) => {
Axios(options)
.then(res => {
const { status, data } = res;
if (status !== 200) {
let cmsg = REPONSE_CODE[status];
let message = cmsg !== undefined ? cmsg : '系统异常。';
throw Error(message);
}
if (!data) throw Error('axios reponse data in not defined.');
if (data.code != '000000') {
// 如果要是有其他特殊需求在此处添加
console.log(`调用后台接口报错,CODE: ${data.code},MESSAGE: ${data.message}。`);
// console.log(`调用后台接口报错,CODE: ${data.code},MESSAGE: ${data.message}。`);
}
resolve(res.data);
})
.catch(error => {
VUE_ENV === 'client' && Toast({ message: '系统繁忙,请稍后重新进入页面查询', duration: 1000 });
// VUE_ENV === 'client' && Toast({ message: error.message, duration: 1000 });
// reject(error);
})
})
}
\ No newline at end of file
该目录建议放置所有请求资源代码,可根据业务划分与不同子目录。
import $http from 'mn-template/plugins/http';
// 获取亲友列表
export const listRelatives = () =>
$http({
method: 'get',
url: '/splitter/live/v2/list',
params: {
version: '3.2.1',
},
});
export const getWidgetList = async ({ id, token }) =>
$http({
method: 'get',
url: `/contents/template/${id}/widgetList?token=${token}&setEntry=true`,
});
export const getWidgetListTab = async ({ id }) =>
$http({
method: 'get',
url: `/contents/template/element/${id}/widgetList`,
});
export const selectAppModuleParam = async ({ id, token }) =>
$http({
method: 'get',
url: `/contents/contentAppModule/selectAppModuleParam?id=${id}&token=${token}&setEntry=true`,
withCredentials: true,
});
// 任务列表查询
export const getActivityDesc = async (data) =>
$http({
method: 'get',
url: `/campaign/admin/task/h5/activityInfo?id=${data.id}&token=${data.token}&setEntry=true`,
headers: {
token: data.token,
},
// withCredentials: true
});
// 新的任务列表查询
export const getNewActivityDesc = async (data) =>
$http({
method: 'get',
url: `/campaign/tims/timsActivityInfo?activityId=${data.id}&token=${
data.token
}&setEntry=true&random=${Math.random()}`,
headers: {
token: data.token,
},
});
export const checkQualification = async ({ token, role, rosterId }) =>
$http({
method: 'get',
url: `contents/template/checkQualification?token=${token}&setEntry=true&role=${role}&rosterId=${rosterId}`,
withCredentials: true,
});
export const checkToken = async (token) =>
$http({
method: 'get',
url: `campaign/admin/task/checkToken?token=${token}`,
withCredentials: true,
});
export const logPut = async (data) =>
$http({
method: 'PUT',
data: data,
url: 'log/',
});
export const getRole = async ({ token }) =>
$http({
method: 'get',
url: `/contents/template/getRole?token=${token}`,
headers: {
token,
},
// withCredentials: true
});
export const sayHello = async ({ token }) =>
$http({
method: 'POST',
// withCredentials: true,
headers: {
token,
},
data: {
token,
},
url: '/diplomat/oauth/sayhello?app_id=pica-crrs',
});
export const getAmountApi = async ({ a, b, c, d }) => {
// a:url b:get or post c:params
if (b == 'get') {
const param = JSON.parse(c);
let str, key;
for (key in param) {
str = str + key + '=' + param[key] + '&';
}
str = str.slice(0, str.length - 1);
return $http({
url: a + '?' + str,
});
} else if (b == 'post') {
return $http({
method: 'POST',
headers: {
token: d,
},
data: JSON.parse(c),
url: a,
});
}
};
export const checkHasAgreementApi = async ({ token }) =>
$http({
url: 'smartcontract/protocol/sign/check?type=3', // 3为云鹊医隐私协议
headers: {
token,
},
});
// 查看直播状态
export const checkLiveStatus = async (resourceId) =>
$http({
url: `campaign/subscribe/liveStatus?liveId=${resourceId}`,
});
// 查看doctorId
export const getDoctorId = async (token) =>
$http({
url: 'campaign/subscribe/getId',
headers: {
token,
},
});
// 校验预约和分享完成状态以及直播状态
export const checkFinishStatus = async (data) =>
$http({
// alert('token'+data.token)
// url: `/campaign/admin/tims/checkFinishStatus?type=${type}&resourcesId=${resourcesId}&doctorId=${doctorId}&setEntry=true`,
url: '/campaign/subscribe/checkFinishStatus',
method: 'POST',
headers: {
token: data.token,
},
data: {
type: data.type,
resourcesId: data.resourcesId,
doctorId: data.doctorId,
},
});
// 预约
export const getSubscribe = async (data) =>
$http({
// url: `/campaign/admin/tims/checkFinishStatus?type=${type}&resourcesId=${resourcesId}&doctorId=${doctorId}&setEntry=true`,
url: '/campaign/subscribe/',
method: 'POST',
headers: {
token: data.token,
},
data: {
type: data.type,
resourcesId: data.resourcesId,
doctorId: data.doctorId,
shareDoctorId: data.shareDoctorId,
subscribeUrl: data.subscribeUrl,
},
});
// 分享
export const getSubscribeShare = async (data) =>
$http({
url: '/campaign/subscribe/share',
method: 'POST',
headers: {
token: data.token,
},
data: {
type: data.type,
resourcesId: data.resourcesId,
doctorId: data.doctorId,
},
});
// 获取打卡状态 参数 activityId 活动id ,id 任务id
export const getClockStatus = (params) =>
$http({
url: `/campaign/clock/v1/${params.activityId}/status/${params.id}`,
method: 'get',
withCredentials: true,
});
// 去打卡 参数 activityId 活动id ,id 任务id
export const goToUpdateClock = (params) =>
$http({
url: 'campaign/clock/clock',
method: 'post',
data: params,
withCredentials: true,
});
// 获取doctorId
export const getDoctorIdObtain = async () =>
$http({
url: '/campaign/second-award/doctorId',
method: 'get',
withCredentials: true,
});
// 记录分享行为
export const recordShareAction = (params) =>
$http({
url: '/contents/template/share-log',
method: 'post',
data: params,
withCredentials: true,
});
// 根据邀请组件id返回口令
export const getCommand = async (params) =>
$http({
url: '/contents/template/invite-token',
method: 'get',
params: params,
withCredentials: false,
});
// 根据商品id批量查询商品信息
export const getGoodsDetailListByIds = async (ids) =>
$http({
url: 'store/medications/queryGoodsDetailListByIds',
method: 'post',
data: ids,
withCredentials: true,
});
// 获取和药代相关的积木id列表
export const getTemplateList = async (params) =>
$http({
url: '/broker/templateList',
method: 'get',
params: params,
withCredentials: false,
});
// 校验是否为药代身份并返回加密医生id
export const checkBroker = async (templateId) =>
$http({
url: `/broker/checkBroker?templateId=${templateId}`,
method: 'get',
withCredentials: true,
});
......@@ -2,225 +2,233 @@
<template>
<div>
<div class="chart-column-vtc">
<div v-show="isShow" :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
<NoContent v-show="!isShow" :id="id" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="id"
:style="{ width: chartWidth, height: chartHeight }"
/>
<NoContent
v-show="!isShow"
:id="id"
:style="{ width: '100%', height: '220px' }"
/>
</div>
<CommonNoMore v-show="isShow && dataList.length >= 10"></CommonNoMore>
<CommonNoMore v-show="isShow && dataList.length >= 10" />
</div>
</template>
<script>
let vm = null;
import CommonNoMore from "@/components/common/common-no-more";
import NoContent from "@/components/bussiness/no-content";
import CommonNoMore from '@/components/common/common-no-more';
import NoContent from '@/components/bussiness/no-content';
export default {
components: {
CommonNoMore,
NoContent
NoContent,
},
props: {
id: {
type: String,
default: "chartColumnTCId"
default: 'chartColumnTCId',
},
colors: {
type: Array,
default: () => [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
"#abb7bb",
"#76d2d2"
]
'#FFB01B',
'#39AF9A',
'#5D7092',
'#FF9A4B',
'#abb7bb',
'#76d2d2',
],
},
dataList: {
type: Array,
default: () => []
}
default: () => [],
},
},
data() {
return {
chartWidth: "100%",
chartHeight: "200px",
isShow: true
chartWidth: '100%',
chartHeight: '200px',
isShow: true,
};
},
watch: {
dataList: {
handler(newVal) {
if(newVal.length) {
if (newVal.length) {
this.isShow = true;
let yAxisData = [],
series0Data = [],
series1Data = [];
yAxisData = newVal.map(item => {
return this.shortName(item.classifyName)
yAxisData = newVal.map((item) => {
return this.shortName(item.classifyName);
});
series0Data = this.dataList.map(item => {
series0Data = this.dataList.map((item) => {
return ((item.beforeRate || 0) * 100).toFixed(1);
});
series1Data = this.dataList.map(item => {
series1Data = this.dataList.map((item) => {
return ((item.afterRate || 0) * 100).toFixed(1);
});
if (process.client) {
let clientWidth =
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = clientWidth + "px";
this.chartHeight = 53 * this.dataList.length + "px";
this.chartWidth = clientWidth + 'px';
this.chartHeight = 53 * this.dataList.length + 'px';
this.drawColumn(yAxisData, series0Data, series1Data);
}
} else {
this.isShow = false;
}
},
deep: true
}
deep: true,
},
},
created() {
},
created() {},
mounted() {
vm = this;
},
methods: {
// 绘制图表
drawColumn(yAxisData, series0Data, series1Data) {
let chartColumn = this.$echarts.init(document.getElementById(this.id));
let options = {
const chartColumn = this.$echarts.init(document.getElementById(this.id));
const options = {
color: vm.colors || [],
tooltip: {
trigger: "axis",
trigger: 'axis',
axisPointer: {
type: "shadow"
type: 'shadow',
},
formatter: "{b}<br/>{a0}{c0}%<br/>{a1}{c1}%"
formatter: '{b}<br/>{a0}{c0}%<br/>{a1}{c1}%',
},
legend: {
show: false,
top: 20,
data: ["培训前正确率", "培训后正确率"],
data: ['培训前正确率', '培训后正确率'],
textStyle: {
fontSize: 12,
// fontWeight: "bolder",
color: "#676869"
}
color: '#676869',
},
},
grid: {
top: "3%",
left: "5%",
right: "5%",
bottom: "3%",
top: '3%',
left: '5%',
right: '5%',
bottom: '3%',
containLabel: true,
borderWidth: 0
borderWidth: 0,
},
lineStyle: {
color: "#fff"
color: '#fff',
},
xAxis: {
axisTick: false,
type: "value",
type: 'value',
minInterval: 1,
axisLabel: {
show: false,
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#676869",
width: 0
}
color: '#676869',
width: 0,
},
},
splitLine: {
show: false
}
show: false,
},
},
yAxis: {
axisTick: false,
type: "category",
type: 'category',
data: yAxisData,
textStyle: {
fontSize: 12,
color: "#676869"
color: '#676869',
},
splitLine: {
show: false
show: false,
},
axisLabel: {
formatter: "{value}",
textAlign: "left",
formatter: '{value}',
textAlign: 'left',
textStyle: {
textAlign: "left",
color: "#676869"
}
textAlign: 'left',
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#676869",
width: 0
}
color: '#676869',
width: 0,
},
},
},
series: [
{
name: "培训前正确率",
name: '培训前正确率',
data: series0Data,
// data: [12, 200, 150, 80, 70, 110, 130, 130],
type: "bar",
barWidth: 15, //柱图宽度
type: 'bar',
barWidth: 15, // 柱图宽度
label: {
normal: {
align: 'left',
formatter: "{c}%",
formatter: '{c}%',
show: true,
position: "inside"
}
}
position: 'inside',
},
},
},
{
name: "培训后正确率",
name: '培训后正确率',
data: series1Data,
// data: [120, 20, 160, 80, 70, 110, 130, 130],
type: "bar",
barWidth: 15, //柱图宽度
type: 'bar',
barWidth: 15, // 柱图宽度
label: {
normal: {
align: 'left',
formatter: "{c}%",
formatter: '{c}%',
show: true,
position: "inside"
}
}
}
]
position: 'inside',
},
},
},
],
};
chartColumn.setOption(options);
let autoHeight = this.dataList.length * 53; // counst.length为柱状图的条数,即数据长度。35为我给每个柱状图的高度,50为柱状图x轴内容的高度(大概的)。
chartColumn.getDom().style.height = autoHeight + "px";
chartColumn.getDom().childNodes[0].style.height = autoHeight + "px";
chartColumn.getDom().childNodes[0].childNodes[0].setAttribute("height",autoHeight);
chartColumn.getDom().childNodes[0].childNodes[0].style.height = autoHeight + "px";
chartColumn.resize();
const autoHeight = this.dataList.length * 53; // counst.length为柱状图的条数,即数据长度。35为我给每个柱状图的高度,50为柱状图x轴内容的高度(大概的)。
chartColumn.getDom().style.height = autoHeight + 'px';
chartColumn.getDom().childNodes[0].style.height = autoHeight + 'px';
chartColumn
.getDom()
.childNodes[0].childNodes[0].setAttribute('height', autoHeight);
chartColumn.getDom().childNodes[0].childNodes[0].style.height =
autoHeight + 'px';
chartColumn.resize();
},
shortName: function (value, length = 5, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
return value.substring(0, length) + append;
} else {
return value
return value;
}
},
}
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-column-vtc {
font-size: 14px;
}
......
......@@ -2,38 +2,45 @@
<template>
<div>
<div class="chart-column-htc">
<div v-show="isShow" :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
<NoContent v-show="!isShow" :id="id" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="id"
:style="{ width: chartWidth, height: chartHeight }"
/>
<NoContent
v-show="!isShow"
:id="id"
:style="{ width: '100%', height: '220px' }"
/>
</div>
</div>
</template>
<script>
import { format } from "path";
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
let vm = null,
chartColumn = null;
export default {
components: {
NoContent
NoContent,
},
props: {
dataList: {
type: Array,
default: () => []
default: () => [],
},
id: {
type: String,
default: "chartColumnTCId"
default: 'chartColumnTCId',
},
colors: {
type: Array,
default: () => ["#FFB01B", "#39AF9A", "#5D7092", "#FF9A4B"]
}
default: () => ['#FFB01B', '#39AF9A', '#5D7092', '#FF9A4B'],
},
},
data() {
return {
chartWidth: "300px",
chartHeight: "350px",
chartWidth: '300px',
chartHeight: '350px',
isShow: true,
};
},
......@@ -41,18 +48,18 @@ export default {
watch: {
dataList: {
handler(newVal) {
if(newVal.length) {
if (newVal.length) {
this.isShow = true;
let yAxisData = [],
series0Data = [],
series1Data = [];
yAxisData = newVal.map(item => {
yAxisData = newVal.map((item) => {
return this.shortName(item.classifyName);
});
series0Data = this.dataList.map(item => {
series0Data = this.dataList.map((item) => {
return ((item.beforeRate || 0) * 100).toFixed(1);
});
series1Data = this.dataList.map(item => {
series1Data = this.dataList.map((item) => {
return ((item.afterRate || 0) * 100).toFixed(1);
});
this.drawColumn(
......@@ -64,17 +71,17 @@ export default {
this.isShow = false;
}
},
deep: false
}
deep: false,
},
},
created() {
if (process.client) {
let clientWidth =
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(1) + "px";
this.chartWidth = (clientWidth * 0.9).toFixed(1) + 'px';
}
},
......@@ -86,128 +93,128 @@ export default {
// 绘制图表
drawColumn(yAxisData, series0Data, series1Data) {
chartColumn = this.$echarts.init(document.getElementById(this.id));
let options = {
const options = {
color: vm.colors,
tooltip: {
trigger: "axis",
trigger: 'axis',
axisPointer: {
type: "shadow"
type: 'shadow',
},
formatter: "{b}<br/>{a0}{c0}%<br/>{a1}{c1}%"
formatter: '{b}<br/>{a0}{c0}%<br/>{a1}{c1}%',
},
legend: {
top: 20,
data: ["培训前正确率", "培训后正确率"],
data: ['培训前正确率', '培训后正确率'],
textStyle: {
fontSize: 12,
color: "#676869"
}
color: '#676869',
},
},
grid: {
left: "3%",
right: "6%",
bottom: "6%",
containLabel: true
left: '3%',
right: '6%',
bottom: '6%',
containLabel: true,
},
lineStyle: {
color: "#676869"
color: '#676869',
},
xAxis: {
max: 100,
axisTick: false,
type: "value",
type: 'value',
minInterval: 1,
axisLabel: {
formatter: "{value}%",
formatter: '{value}%',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
color: '#efefef',
width: 1,
},
},
//设置网格线颜色
// 设置网格线颜色
splitLine: {
show: true,
lineStyle: {
color: ["#efefef"],
color: ['#efefef'],
width: 1,
type: "solid"
}
}
type: 'solid',
},
},
},
yAxis: {
axisTick: false,
type: "category",
type: 'category',
data: yAxisData,
// data: ["生活方\n式干预", "生活方\n式", "本科", "大专", "中专以下"],
textStyle: {
fontSize: 12,
color: "#676869"
color: '#676869',
},
axisLabel: {
formatter: "{value}",
textAlign: "left",
formatter: '{value}',
textAlign: 'left',
textStyle: {
textAlign: "left",
color: "#676869"
}
textAlign: 'left',
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
color: '#efefef',
width: 1,
},
},
},
series: [
{
name: "培训前正确率",
name: '培训前正确率',
data: series0Data,
// data: [12, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 15, //柱图宽度
type: 'bar',
barWidth: 15, // 柱图宽度
label: {
normal: {
formatter: "{c}%",
formatter: '{c}%',
show: false,
position: "inside"
}
}
position: 'inside',
},
},
},
{
name: "培训后正确率",
name: '培训后正确率',
data: series1Data,
// data: [120, 20, 160, 80, 70, 110, 130],
type: "bar",
barWidth: 15, //柱图宽度
type: 'bar',
barWidth: 15, // 柱图宽度
label: {
normal: {
formatter: "{c}%",
formatter: '{c}%',
show: false,
position: "inside"
}
}
}
]
position: 'inside',
},
},
},
],
};
chartColumn.setOption(options);
},
shortName: function(value, length = 5, append = "...") {
shortName: function (value, length = 5, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append;
} else {
return value;
}
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-column-htc {
position: relative;
top: -6px;
......
<!-- 柱状图-横向 -->
<template>
<div class="chart-pie">
<div v-show="isShow" :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
<NoContent v-show="!isShow" :id="id" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="id"
:style="{ width: chartWidth, height: chartHeight }"
/>
<NoContent
v-show="!isShow"
:id="id"
:style="{ width: '100%', height: '220px' }"
/>
</div>
</template>
<script>
import { format } from "path";
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
let vm = null;
let certNameConfig = {
const certNameConfig = {
'-1': '未获证人数',
'1': '获优秀人数',
'2': '获良好人数',
'3': '获及格人数',
'4': '获不及格人数',
}
1: '获优秀人数',
2: '获良好人数',
3: '获及格人数',
4: '获不及格人数',
};
export default {
components: {
NoContent
NoContent,
},
props: {
id: {
type: String,
default: "chartColumnId"
default: 'chartColumnId',
},
chartWidth: {
type: String,
default: "100%"
default: '100%',
},
chartHeight: {
type: String,
default: "320px"
default: '320px',
},
echartsData: {
type: Array,
default: () => []
default: () => [],
},
certFlag: {
type: String | Number,
default: 1
}
type: Number,
default: 1,
},
},
data() {
return {
legendData: [],
yAxisData: [],
seriesData: [],
isShow: true
isShow: true,
};
},
mounted() {
vm = this;
},
watch: {
echartsData: {
handler(newVal, oldValue) {
if(newVal.length) {
handler(newVal) {
if (newVal.length) {
this.isShow = true;
vm.legendData = [];
vm.yAxisData = [];
vm.seriesData = [];
let cData, certList, certLength = 0, certData = [], certId = 0, certName = '其它';
let cData,
certList,
certLength = 0,
certData = [];
// 将所有证书名称进行修改
for(let i = 0; i < newVal.length; i ++) {
for(let j = 0; j < newVal[i].certList.length; j ++) {
if(vm.certFlag == 1 && newVal[i].certList[j].id != -1) { // 如果是单证书
newVal[i].certList[j].name = '已获证人数'
for (let i = 0; i < newVal.length; i++) {
for (let j = 0; j < newVal[i].certList.length; j++) {
if (vm.certFlag == 1 && newVal[i].certList[j].id != -1) {
// 如果是单证书
newVal[i].certList[j].name = '已获证人数';
} else {
newVal[i].certList[j].name = certNameConfig[newVal[i].certList[j].id];
newVal[i].certList[j].name =
certNameConfig[newVal[i].certList[j].id];
}
}
}
for(let i = newVal.length - 1; i >= 0; i --){
for (let i = newVal.length - 1; i >= 0; i--) {
certData = [];
cData = newVal[i];
vm.yAxisData.push(cData.eduName);
// vm.legendData.push(cData.eduName);
certLength = cData.certList.length;
for(let j = certLength - 1; j >= 0; j --) {
for (let j = certLength - 1; j >= 0; j--) {
certList = cData.certList;
certData.push(certList[j].value);
if(i == 0) {
if (i == 0) {
vm.legendData.push(certList[j].name);
}
}
......@@ -94,95 +103,103 @@ export default {
this.isShow = false;
}
},
deep: true
}
deep: true,
},
},
mounted() {
vm = this;
},
methods: {
// 处理SeriesData
handlerSeriesData(chartData) {
if(chartData.length === 0) {
if (chartData.length === 0) {
vm.legendData = [];
vm.yAxisData = [];
vm.seriesData = [];
return
return;
}
let certLength = chartData[0].certList.length;
let sData = []
for(let i = 0; i < certLength; i ++){
sData = []
for(let j = 0; j < chartData.length; j ++){
sData.push(chartData[j].certList[i].value)
const certLength = chartData[0].certList.length;
let sData = [];
for (let i = 0; i < certLength; i++) {
sData = [];
for (let j = 0; j < chartData.length; j++) {
sData.push(chartData[j].certList[i].value);
}
vm.seriesData.push({
name: chartData[0].certList[i].name,
type: "bar",
stack: "总量",
barWidth: 16, //柱图宽度
data: sData.reverse()
type: 'bar',
stack: '总量',
barWidth: 16, // 柱图宽度
data: sData.reverse(),
});
}
},
// 绘制图表
drawColumn() {
let chartColumn = this.$echarts.init(document.getElementById(this.id));
let options = {
const chartColumn = this.$echarts.init(document.getElementById(this.id));
const options = {
color: [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
"#abb7bb",
"#76d2d2"
'#FFB01B',
'#39AF9A',
'#5D7092',
'#FF9A4B',
'#abb7bb',
'#76d2d2',
],
tooltip: {
trigger: "axis",
trigger: 'axis',
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow" // 默认为直线,可选为:'line' | 'shadow'
type: 'shadow', // 默认为直线,可选为:'line' | 'shadow'
},
formatter: function (params) {
// let relVal = params[0].name + "人数:";
let relVal = params[0].name + "人数";
let relVal = params[0].name + '人数';
let value = 0;
// for (let i = 0, l = params.length; i < l; i++) {
// value += params[i].value;
// }
for (let i = params.length -1; i >= 0; i --) {
for (let i = params.length - 1; i >= 0; i--) {
value += params[i].value;
}
relVal += value + "人";
let divList = [];
divList[0] = "<div style='background: #3BA0FF;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[1] = "<div style='background: #FF9A4B;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[2] = "<div style='background: #FFB01B;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[3] = "<div style='background: #39AF9A;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[4] = "<div style='background: #5D7092;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
for (let j = 0; j < params.length; j ++) {
// for (let j = params.length - 1; j >= 0; j--) {
if(value != 0) {
relVal += value + '人';
const divList = [];
divList[0] =
'<div style=\'background: #3BA0FF;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;\'></div>';
divList[1] =
'<div style=\'background: #FF9A4B;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;\'></div>';
divList[2] =
'<div style=\'background: #FFB01B;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;\'></div>';
divList[3] =
'<div style=\'background: #39AF9A;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;\'></div>';
divList[4] =
'<div style=\'background: #5D7092;height: 12px;width: 0px;margin: 5px 5px 0 2px;float: left;border-radius:2px;\'></div>';
for (let j = 0; j < params.length; j++) {
// for (let j = params.length - 1; j >= 0; j--) {
if (value != 0) {
relVal +=
// "<br/>" + divList[j] +
"<br/>" +
'<br/>' +
params[j].seriesName +
"占比" +
'占比' +
// "占比: " +
(
(100 * parseFloat(params[j].value)) /
parseFloat(value)
).toFixed(1) +
"%";
'%';
} else {
relVal +=
"<br/>" +
'<br/>' +
// "<br/>" + divList[j] +
params[j].seriesName +
"占比"+ "0%";
// "占比: "+ "0%";
'占比' +
'0%';
// "占比: "+ "0%";
}
}
return relVal;
}
},
},
legend: {
top: 20,
......@@ -191,78 +208,78 @@ export default {
textStyle: {
fontSize: 12,
// fontWeight: "bolder",
color: "#676869"
}
color: '#676869',
},
},
grid: {
left: "3%",
right: "6%",
bottom: "3%",
containLabel: true
left: '3%',
right: '6%',
bottom: '3%',
containLabel: true,
},
lineStyle: {
color: "#676869"
color: '#676869',
},
xAxis: {
// min: 0,
// max: 'dataMax',
minInterval: 1,
axisTick: false,
type: "value",
type: 'value',
axisLabel: {
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
color: '#676869',
},
rotate: 45
rotate: 45,
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
color: '#efefef',
width: 1,
},
},
//设置网格线颜色
// 设置网格线颜色
splitLine: {
show: true,
lineStyle: {
color: ["#efefef"],
color: ['#efefef'],
width: 1,
type: "solid"
}
}
type: 'solid',
},
},
},
yAxis: {
axisTick: false,
type: "category",
type: 'category',
data: vm.yAxisData,
// data: ["其他", "中专以下", "大专", "本科", "硕士", "博士"],
textStyle: {
fontSize: 12,
color: "#676869"
color: '#676869',
},
axisLabel: {
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
color: '#efefef',
width: 1,
},
},
},
series: vm.seriesData
series: vm.seriesData,
};
chartColumn.setOption(options, true);
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
......
<!-- 柱状图-竖向 -->
<template>
<section class="chart-pie">
<div v-show="isShow" :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
<NoContent v-show="!isShow" :id="id" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="id"
:style="{ width: chartWidth, height: chartHeight }"
/>
<NoContent
v-show="!isShow"
:id="id"
:style="{ width: '100%', height: '220px' }"
/>
</section>
</template>
<script>
import { format } from "path";
import NoContent from "@/components/bussiness/no-content";
let vm = null, chartColumn = null;
import NoContent from '@/components/bussiness/no-content';
let chartColumn = null;
export default {
components: {
NoContent
NoContent,
},
props: {
id: {
type: String,
default: "chartColumnId"
default: 'chartColumnId',
},
colors: {
type: Array,
default: () => [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
]
default: () => ['#FFB01B', '#39AF9A', '#5D7092', '#FF9A4B'],
},
dataList: {
tpye: Array,
default: () => []
}
type: Array,
default: () => [],
},
},
data() {
return {
chartWidth: "300px",
chartHeight: "235px",
chartWidth: '300px',
chartHeight: '235px',
xAxisData: [],
seriesData: [],
options: {
color: ['#FFB01B'],
tooltip: {
trigger: "axis",
trigger: 'axis',
axisPointer: {
type: "shadow"
type: 'shadow',
},
formatter: '{b}分获得人数{c0}人'
formatter: '{b}分获得人数{c0}人',
},
grid: {
top: "10%",
left: "3%",
right: "6%",
bottom: "6%",
containLabel: true
top: '10%',
left: '3%',
right: '6%',
bottom: '6%',
containLabel: true,
},
lineStyle: {
color: "#676869"
color: '#676869',
},
yAxis: {
axisTick: false,
type: "value",
type: 'value',
minInterval: 1,
axisLabel: {
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
color: '#efefef',
width: 1,
},
},
//设置网格线颜色
// 设置网格线颜色
splitLine: {
show: true,
lineStyle:{
lineStyle: {
color: ['#efefef'],
width: 1,
type: 'solid'
}
   },
type: 'solid',
},
},
},
xAxis: {
axisTick: false,
type: "category",
type: 'category',
data: [],
// data: ["其他", "中专以下", "大专", "本科", "硕士"],
textStyle: {
fontSize: 12,
color: "#676869"
color: '#676869',
},
axisLabel: {
formatter: "{value}分",
formatter: '{value}分',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
color: '#efefef',
width: 1,
},
},
label: {
formatter: "{c}%",
formatter: '{c}%',
// normal: {
// formatter: "{c}%",
// show: true,
// position: "inside"
// }
}
},
},
series: [
{
name: "考试人数",
name: '考试人数',
data: [],
// data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 20 //柱图宽度
}
]
type: 'bar',
barWidth: 20, // 柱图宽度
},
],
},
isShow: true
isShow: true,
};
},
watch: {
dataList: {
handler(newVal) {
if(newVal.length) {
if (newVal.length) {
this.isShow = true;
this.xAxisData = newVal.map( item => {
return item.times
})
this.seriesData = newVal.map( item => {
return item.count
})
this.xAxisData = newVal.map((item) => {
return item.times;
});
this.seriesData = newVal.map((item) => {
return item.count;
});
this.options.xAxis.data = this.xAxisData;
this.options.series[0].data = this.seriesData;
chartColumn.setOption(this.options, true);
......@@ -144,20 +145,19 @@ export default {
this.isShow = false;
}
},
deep: true
}
deep: true,
},
},
created() {
if (process.client) {
let clientWidth =
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(1) + 'px';
this.chartWidth = (clientWidth * 0.9).toFixed(1) + 'px';
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
......@@ -165,12 +165,12 @@ export default {
drawColumn() {
chartColumn = this.$echarts.init(document.getElementById(this.id));
chartColumn.setOption(this.options, true);
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
......
......@@ -2,79 +2,84 @@
<template>
<div>
<div class="chart-column-vtc">
<div v-show="isShow" :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
<NoContent v-show="!isShow" :id="id" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="id"
:style="{ width: chartWidth, height: chartHeight }"
/>
<NoContent
v-show="!isShow"
:id="id"
:style="{ width: '100%', height: '220px' }"
/>
</div>
<TipsInfoChart content="报告数据来源仅包含摸底考和正式考的课程培训"></TipsInfoChart>
<TipsInfoChart content="报告数据来源仅包含摸底考和正式考的课程培训" />
</div>
</template>
<script>
import { format } from "path";
import NoContent from "@/components/bussiness/no-content";
import TipsInfoChart from "@/components/bussiness/tips-info-chart";
let vm = null, chartColumn = null;
import NoContent from '@/components/bussiness/no-content';
import TipsInfoChart from '@/components/bussiness/tips-info-chart';
let vm = null,
chartColumn = null;
export default {
components: {
TipsInfoChart,
NoContent
NoContent,
},
props: {
dataList: {
type: Array,
default: () => []
default: () => [],
},
id: {
type: String,
default: "chartColumnTCId"
default: 'chartColumnTCId',
},
colors: {
type: Array,
default: () => [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
]
}
default: () => ['#FFB01B', '#39AF9A', '#5D7092', '#FF9A4B'],
},
},
data() {
return {
chartWidth: "300px",
chartHeight: "320px",
chartWidth: '300px',
chartHeight: '320px',
isShow: true,
};
},
created() {
if (process.client) {
let clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(1) + 'px';
}
},
watch: {
dataList: {
handler(newVal) {
if(newVal.length) {
if (newVal.length) {
this.isShow = true;
let yAxisData = [], series0Data = [], series1Data = []
yAxisData = newVal.map( item => {
return this.shortName(item.classifyName)
})
series0Data = this.dataList.map( item => {
return ((item.beforeRate|| 0) * 100).toFixed(1);
})
series1Data = this.dataList.map( item => {
return ((item.afterRate|| 0) * 100).toFixed(1);
})
let yAxisData = [],
series0Data = [],
series1Data = [];
yAxisData = newVal.map((item) => {
return this.shortName(item.classifyName);
});
series0Data = this.dataList.map((item) => {
return ((item.beforeRate || 0) * 100).toFixed(1);
});
series1Data = this.dataList.map((item) => {
return ((item.afterRate || 0) * 100).toFixed(1);
});
this.drawColumn(yAxisData, series0Data, series1Data);
// this.drawColumn(yAxisData.splice(0, 5), series0Data.splice(0, 5), series1Data.splice(0, 5));
} else {
this.isShow = false;
}
},
deep: false
deep: false,
},
},
created() {
if (process.client) {
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(1) + 'px';
}
},
mounted() {
......@@ -85,113 +90,113 @@ export default {
// 绘制图表
drawColumn(yAxisData, series0Data, series1Data) {
chartColumn = this.$echarts.init(document.getElementById(this.id));
let options = {
const options = {
color: vm.colors,
tooltip: {
trigger: "axis",
trigger: 'axis',
axisPointer: {
type: "shadow"
type: 'shadow',
},
// formatter: '{a}<br/>{b}<br/>{c}<br/>{a0}<br/>{a1}<br/>{b0}<br/>{b1}',
formatter: '{b}<br/>{a0}{c0}%<br/> {a1}{c1}%'
formatter: '{b}<br/>{a0}{c0}%<br/> {a1}{c1}%',
},
legend: {
top: 20,
data: ["培训前正确率", "培训后正确率"],
data: ['培训前正确率', '培训后正确率'],
textStyle: {
fontSize: 12,
// fontWeight: "bolder",
color: "#676869"
}
color: '#676869',
},
},
grid: {
left: "3%",
right: "6%",
bottom: "6%",
containLabel: true
left: '3%',
right: '6%',
bottom: '6%',
containLabel: true,
},
lineStyle: {
color: "#676869"
color: '#676869',
},
yAxis: {
axisTick: false,
type: "value",
type: 'value',
minInterval: 1,
axisLabel: {
formatter: "{value}%",
formatter: '{value}%',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
color: '#efefef',
width: 1,
},
},
//设置网格线颜色
// 设置网格线颜色
splitLine: {
show: true,
lineStyle:{
lineStyle: {
color: ['#efefef'],
width: 1,
type: 'solid'
}
   }
type: 'solid',
},
},
},
xAxis: {
axisTick: false,
type: "category",
type: 'category',
// data: ["博士", "硕士", "本科", "大专", "中专以下", "其他"],
data: yAxisData,
textStyle: {
fontSize: 12,
color: "#676869"
color: '#676869',
},
axisLabel: {
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
color: '#efefef',
width: 1,
},
},
},
series: [
{
name: "培训前正确率",
name: '培训前正确率',
data: series0Data,
// data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 15 //柱图宽度
type: 'bar',
barWidth: 15, // 柱图宽度
},
{
name: "培训后正确率",
name: '培训后正确率',
data: series1Data,
// data: [120, 20, 160, 80, 70, 110, 130],
type: "bar",
barWidth: 15 //柱图宽度
}
]
type: 'bar',
barWidth: 15, // 柱图宽度
},
],
};
chartColumn.setOption(options);
},
shortName: function (value, length = 5, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
return value.substring(0, length) + append;
} else {
return value
return value;
}
},
}
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-column-vtc {
position: relative;
top: -6px;
......
<!-- 柱状图-竖向 -->
<template>
<section class="chart-pie">
<div v-show="isShow" :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
<NoContent v-show="!isShow" :id="id" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="id"
:style="{ width: chartWidth, height: chartHeight }"
/>
<NoContent
v-show="!isShow"
:id="id"
:style="{ width: '100%', height: '220px' }"
/>
</section>
</template>
<script>
import { format } from "path";
import NoContent from "@/components/bussiness/no-content";
let vm = null, chartColumn = null;
import NoContent from '@/components/bussiness/no-content';
let chartColumn = null;
export default {
components: {
NoContent
NoContent,
},
props: {
id: {
type: String,
default: "chartColumnId"
default: 'chartColumnId',
},
colors: {
type: Array,
default: () => [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
"#abb7bb",
"#76d2d2"
]
'#FFB01B',
'#39AF9A',
'#5D7092',
'#FF9A4B',
'#abb7bb',
'#76d2d2',
],
},
dataList: {
tpye: Array,
default: () => []
}
type: Array,
default: () => [],
},
},
data() {
return {
chartWidth: "300px",
chartHeight: "235px",
chartWidth: '300px',
chartHeight: '235px',
xAxisData: [],
seriesData: [],
options: {
color: ['#39AF9A'],
tooltip: {
trigger: "axis",
trigger: 'axis',
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow" // 默认为直线,可选为:'line' | 'shadow'
type: 'shadow', // 默认为直线,可选为:'line' | 'shadow'
},
formatter: '{b}完成人数{c0}人'
formatter: '{b}完成人数{c0}人',
},
// legend: {
// top: 20,
......@@ -60,123 +67,121 @@ export default {
// }
// },
grid: {
top: "10%",
left: "3%",
right: "6%",
bottom: "6%",
containLabel: true
top: '10%',
left: '3%',
right: '6%',
bottom: '6%',
containLabel: true,
},
lineStyle: {
color: "#676869"
color: '#676869',
},
yAxis: {
axisTick: false,
type: "value",
type: 'value',
minInterval: 1,
axisLabel: {
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
color: '#efefef',
width: 1,
},
},
//设置网格线颜色
// 设置网格线颜色
splitLine: {
show: true,
lineStyle:{
lineStyle: {
color: ['#efefef'],
width: 1,
type: 'solid'
}
   }
type: 'solid',
},
},
},
xAxis: {
axisTick: false,
type: "category",
type: 'category',
data: [],
// data: ["其他", "中专以下", "大专", "本科", "硕士"],
textStyle: {
fontSize: 12,
color: "#676869"
color: '#676869',
},
axisLabel: {
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
color: '#efefef',
width: 1,
},
},
},
series: [
{
name: "考试人数",
name: '考试人数',
data: [],
// data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 20 //柱图宽度
}
]
type: 'bar',
barWidth: 20, // 柱图宽度
},
],
},
isShow: true
isShow: true,
};
},
watch: {
dataList: {
handler(newVal) {
if(newVal.length) {
if (newVal.length) {
this.isShow = true;
let cList = newVal.slice(0, 5);
this.xAxisData = cList.map( item => {
return item.timesStr
})
this.seriesData = cList.map( item => {
return item.count
})
const cList = newVal.slice(0, 5);
this.xAxisData = cList.map((item) => {
return item.timesStr;
});
this.seriesData = cList.map((item) => {
return item.count;
});
this.options.xAxis.data = this.xAxisData;
this.options.series[0].data = this.seriesData;
chartColumn.setOption(this.options, true);
} else {
this.isShow = false;
}
},
deep: true
}
deep: true,
},
},
created() {
if (process.client) {
let clientWidth =
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
// 绘制图表
// 绘制图表
drawColumn() {
chartColumn = this.$echarts.init(document.getElementById(this.id));
chartColumn.setOption(this.options, true);
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
......
<!-- 柱状图-竖向 -->
<template>
<section class="chart-pie">
<div :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
<div
:id="id"
:style="{ width: chartWidth, height: chartHeight }"
/>
</section>
</template>
<script>
import { format } from "path";
let vm = null, chartColumn = null;
let chartColumn = null;
export default {
props: {
id: {
type: String,
default: "chartColumnId"
default: 'chartColumnId',
},
colors: {
type: Array,
default: () => [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
"#abb7bb",
"#76d2d2"
]
'#FFB01B',
'#39AF9A',
'#5D7092',
'#FF9A4B',
'#abb7bb',
'#76d2d2',
],
},
dataList: {
tpye: Array,
default: () => []
}
type: Array,
default: () => [],
},
},
data() {
return {
chartWidth: "300px",
chartHeight: "235px",
chartWidth: '300px',
chartHeight: '235px',
xAxisData: [],
seriesData: [],
options: {
// color: this.colors,
tooltip: {
trigger: "axis",
trigger: 'axis',
axisPointer: {
type: "shadow"
}
type: 'shadow',
},
},
grid: {
top: "10%",
left: "3%",
right: "6%",
bottom: "6%",
containLabel: true
top: '10%',
left: '3%',
right: '6%',
bottom: '6%',
containLabel: true,
},
lineStyle: {
color: "#676869"
color: '#676869',
},
yAxis: {
axisTick: false,
type: "value",
type: 'value',
minInterval: 1,
axisLabel: {
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
color: '#efefef',
width: 1,
},
},
},
xAxis: {
axisTick: false,
type: "category",
type: 'category',
data: [],
// data: ["其他", "中专以下", "大专", "本科", "硕士"],
textStyle: {
fontSize: 12,
color: "#676869"
color: '#676869',
},
axisLabel: {
formatter: "{value}",
formatter: '{value}',
textStyle: {
color: "#676869"
}
color: '#676869',
},
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
color: '#efefef',
width: 1,
},
},
},
series: [
{
name: "获优秀人数",
name: '获优秀人数',
data: [],
// data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 20 //柱图宽度
}
]
}
type: 'bar',
barWidth: 20, // 柱图宽度
},
],
},
};
},
watch: {
dataList: {
handler(newVal) {
this.xAxisData = newVal.map( item => {
return item.timesStr
})
this.seriesData = newVal.map( item => {
return item.count
})
this.xAxisData = newVal.map((item) => {
return item.timesStr;
});
this.seriesData = newVal.map((item) => {
return item.count;
});
this.options.xAxis.data = this.xAxisData;
this.options.series[0].data = this.seriesData;
chartColumn.setOption(this.options, true);
},
deep: true
}
deep: true,
},
},
created() {
if (process.client) {
let clientWidth =
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
......@@ -138,12 +139,12 @@ export default {
drawColumn() {
chartColumn = this.$echarts.init(document.getElementById(this.id));
chartColumn.setOption(this.options, true);
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
......
<!-- 证书分布情况饼图 -->
<template>
<section class="chart-pie">
<div :id="pieId" :style="{width: '360px', height: '220px'}"></div>
<div
:id="pieId"
:style="{ width: '360px', height: '220px' }"
/>
</section>
</template>
<script>
import { format } from "path";
import { echartColors } from '@/utils/index'
let vm = null;
export default {
name: "certPie",
name: 'CertPie',
props: {
id: {
type: String,
default: 'chartPieId'
default: 'chartPieId',
},
pieData: {
type: Array,
default: () => [
{ value: 0, name: "优秀证书" },
{ value: 0, name: "及格证书" },
{ value: 0, name: "未获证" }
]
}
{ value: 0, name: '优秀证书' },
{ value: 0, name: '及格证书' },
{ value: 0, name: '未获证' },
],
},
},
data() {
return {
pieId: 'certPieId',
chartHeight: "1000px",
chartHeight: '1000px',
legendDataNotSelected: {},
handledData: {},
legendData: [],
seriesData: {}
seriesData: {},
// 重置颜色,图标如果需要颜色,优先从用户提供的colors中依次提取,用户不提供,则根据默认的颜色进行选取
};
},
watch: {
pieData: {
handler(newValue, oldValue) {
handler(newValue) {
this.handlePieData(newValue);
this.drawPie();
this.drawPie();
},
deep: true
}
deep: true,
},
},
mounted() {
vm = this;
},
methods: {
handlePieData(pieData) {
let legendDataNotSelected = {}, legendData = [], seriesData = [];
pieData.forEach( (item, i) => {
if(!pieData[i].doneCount) {
legendDataNotSelected[pieData[i].certName] = false
const legendDataNotSelected = {},
legendData = [],
seriesData = [];
pieData.forEach((item, i) => {
if (!pieData[i].doneCount) {
legendDataNotSelected[pieData[i].certName] = false;
}
legendData.push(item.certName);
seriesData.push({ name: item.certName, value: item.doneCount});
})
seriesData.push({ name: item.certName, value: item.doneCount });
});
this.legendDataNotSelected = legendDataNotSelected;
this.legendData = legendData;
this.seriesData = seriesData;
......@@ -70,16 +73,16 @@ export default {
},
// 绘制图表
drawPie() {
let chartPie = vm.$echarts.init(document.getElementById(vm.pieId));
let options = {
const chartPie = vm.$echarts.init(document.getElementById(vm.pieId));
const options = {
// color: echartColors,
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b} : {c} ({d}%)"
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)',
},
legend: {
type: "scroll",
orient: "vertical",
type: 'scroll',
orient: 'vertical',
// orient:'horizontal',
top: '30%',
left: '60%',
......@@ -89,49 +92,49 @@ export default {
textStyle: {
fontSize: 12,
// fontWeight: "bolder",
color: "#8C8C8C"
color: '#8C8C8C',
},
formatter: function (name) {
return name + ' ' + vm.fmtLengend(name);
},
formatter: function(name) {
return name + " " + vm.fmtLengend(name);
}
},
series: [
{
name: "证书分布情况1",
type: "pie",
name: '证书分布情况1',
type: 'pie',
label: {
position: "inner",
formatter: function(config) {
position: 'inner',
formatter: function (config) {
// alert(JSON.stringify(config))
return `${config}%`;
}
},
},
radius: "65%",
center: ["30%", "50%"],
radius: '65%',
center: ['30%', '50%'],
data: vm.seriesData, // vm.pieData,
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)"
}
}
}
]
shadowColor: 'rgba(0, 0, 0, 0.5)',
},
},
},
],
};
chartPie.setOption(options, true);
},
fmtLengend(name) {
let item = this.pieData.find(item => {
const item = this.pieData.find((item) => {
return item.certName === name;
});
return (item && item.doneCount) || 0;
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
......
<!-- 人员学历情况饼图 -->
<template>
<section class="chart-pie-edu">
<div v-show="isShow" :id="pieId" :style="{width: chartWidth, height: '220px'}"></div>
<NoContent v-show="!isShow" :id="pieId" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="pieId"
:style="{ width: chartWidth, height: '220px' }"
/>
<NoContent
v-show="!isShow"
:id="pieId"
:style="{ width: '100%', height: '220px' }"
/>
</section>
</template>
<script>
import { format } from "path";
import { echartColors } from '@/utils/index'
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
let vm = null;
export default {
name: "eduPie",
name: 'EduPie',
components: {
NoContent
NoContent,
},
props: {
dataList: {
type: Array,
default: () => [
{ value: 0, name: "优秀证书" },
{ value: 0, name: "及格证书" },
{ value: 0, name: "未获证" }
]
{ value: 0, name: '优秀证书' },
{ value: 0, name: '及格证书' },
{ value: 0, name: '未获证' },
],
},
},
data() {
return {
chartWidth: '320px',
pieId: 'eduPieId',
chartHeight: "1000px",
chartHeight: '1000px',
legendDataNotSelected: {},
handledData: {},
legendData: [],
seriesData: {},
count: 0,
isShow: true
isShow: true,
// 重置颜色,图标如果需要颜色,优先从用户提供的colors中依次提取,用户不提供,则根据默认的颜色进行选取
};
},
watch: {
watch: {
dataList: {
handler(newValue, oldValue) {
handler(newValue) {
if (newValue.length) {
this.isShow = true;
let clientWidth =
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = Math.ceil(clientWidth * 0.90) + 'px';
this.chartWidth = Math.ceil(clientWidth * 0.9) + 'px';
this.handlePieData(newValue);
this.drawPie();
} else {
this.isShow = false;
}
},
deep: true
}
deep: true,
},
},
created() {
if (process.client) {
......@@ -68,15 +72,18 @@ export default {
mounted() {},
methods: {
handlePieData(pieData) {
let count = 0, legendDataNotSelected = {}, legendData = [], seriesData = [];
pieData.forEach( (item, i) => {
if(!pieData[i].value) {
legendDataNotSelected[pieData[i].name] = false
let count = 0;
const legendDataNotSelected = {},
seriesData = [],
legendData = [];
pieData.forEach((item, i) => {
if (!pieData[i].value) {
legendDataNotSelected[pieData[i].name] = false;
}
legendData.push(item.name);
seriesData.push({ name: item.name, value: item.value});
seriesData.push({ name: item.name, value: item.value });
count += item.value;
})
});
this.legendDataNotSelected = legendDataNotSelected;
this.legendData = legendData;
this.seriesData = seriesData;
......@@ -96,28 +103,28 @@ export default {
},
// 绘制图表
drawPie() {
let chartPie = vm.$echarts.init(document.getElementById(vm.pieId));
let options = {
const chartPie = vm.$echarts.init(document.getElementById(vm.pieId));
const options = {
// color: echartColors,
title: {
text: "总人数: " + vm.count,
text: '总人数: ' + vm.count,
top: '10%',
left: '60%',
textStyle: {
fontSize: 12,
fontWeight: "bolder",
color: "#000000"
}
fontWeight: 'bolder',
color: '#000000',
},
},
tooltip: {
trigger: "item",
trigger: 'item',
// formatter: "{a} <br/>{b} : {c} ({d}%)"
formatter: "{b}{c}"
formatter: '{b}{c}人',
},
legend: {
type: "scroll",
orient: "vertical",
type: 'scroll',
orient: 'vertical',
// orient:'horizontal',
itemWidth: 9,
itemHeight: 9,
......@@ -130,50 +137,50 @@ export default {
textStyle: {
fontSize: 12,
// fontWeight: "bolder",
color: "#8C8C8C"
color: '#8C8C8C',
},
// icon: "image://./assets/images/left-array-black.png", //格式为'image://+icon文件地址',其中image::后的//不能省略 position: "inner",
formatter: function(name) {
return name + " " + vm.fmtLengend(name);
}
formatter: function (name) {
return name + ' ' + vm.fmtLengend(name);
},
},
series: [
{
name: "证书分布情况",
type: "pie",
name: '证书分布情况',
type: 'pie',
label: {
position: "inner",
formatter: function(config) {
position: 'inner',
formatter: function (config) {
// return `${config.percent}%`;
return `${config.percent.toFixed(1)}%`;
}
},
},
radius: "65%",
center: ["30%", "50%"],
radius: '65%',
center: ['30%', '50%'],
data: vm.seriesData, // vm.pieData,
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)"
}
}
}
]
shadowColor: 'rgba(0, 0, 0, 0.5)',
},
},
},
],
};
chartPie.setOption(options, true);
},
fmtLengend(name) {
let item = this.dataList.find(item => {
const item = this.dataList.find((item) => {
return item.name === name;
});
return (item && item.value) || 0;
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-pie-edu {
position: relative;
top: -12px;
......
<!-- 人员职称情况饼图 -->
<template>
<section class="chart-pie">
<div v-show="isShow" :id="pieId" :style="{width: chartWidth, height: '220px'}"></div>
<NoContent v-show="!isShow" :id="pieId" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="pieId"
:style="{ width: chartWidth, height: '220px' }"
/>
<NoContent
v-show="!isShow"
:id="pieId"
:style="{ width: '100%', height: '220px' }"
/>
</section>
</template>
<script>
import { format } from "path";
import { echartColors } from "@/utils/index";
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
let vm = null;
export default {
name: "titlePie",
name: 'TitlePie',
components: {
NoContent
NoContent,
},
props: {
pieData: {
type: Array,
default: () => [
{ value: 0, name: "优秀证书" },
{ value: 0, name: "及格证书" },
{ value: 0, name: "未获证" }
]
{ value: 0, name: '优秀证书' },
{ value: 0, name: '及格证书' },
{ value: 0, name: '未获证' },
],
},
dataList: {
type: Array,
default: () => [
{ value: 0, name: "优秀证书" },
{ value: 0, name: "及格证书" },
{ value: 0, name: "未获证" }
]
{ value: 0, name: '优秀证书' },
{ value: 0, name: '及格证书' },
{ value: 0, name: '未获证' },
],
},
},
data() {
return {
chartWidth: '320px',
pieId: "titlePieId",
chartHeight: "1000px",
pieId: 'titlePieId',
chartHeight: '1000px',
legendDataNotSelected: {},
handledData: {},
legendData: [],
......@@ -49,22 +55,22 @@ export default {
},
watch: {
dataList: {
handler(newValue, oldValue) {
handler(newValue) {
if (newValue.length) {
this.isShow = true;
let clientWidth =
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = Math.ceil(clientWidth * 0.90) + 'px';
this.chartWidth = Math.ceil(clientWidth * 0.9) + 'px';
this.handlePieData(newValue);
this.drawPie();
} else {
this.isShow = false;
}
},
deep: true
}
},
deep: true,
},
},
created() {
if (process.client) {
......@@ -74,15 +80,18 @@ export default {
mounted() {},
methods: {
handlePieData(pieData) {
let count = 0, legendDataNotSelected = {}, legendData = [], seriesData = [];
pieData.forEach( (item, i) => {
if(!pieData[i].value) {
legendDataNotSelected[pieData[i].name] = false
let count = 0;
const legendDataNotSelected = {},
legendData = [],
seriesData = [];
pieData.forEach((item, i) => {
if (!pieData[i].value) {
legendDataNotSelected[pieData[i].name] = false;
}
legendData.push(item.name);
seriesData.push({ name: item.name, value: item.value});
seriesData.push({ name: item.name, value: item.value });
count += item.value;
})
});
this.legendDataNotSelected = legendDataNotSelected;
this.legendData = legendData;
this.seriesData = seriesData;
......@@ -102,84 +111,84 @@ export default {
},
// 绘制图表
drawPie() {
let chartPie = vm.$echarts.init(document.getElementById(vm.pieId));
let options = {
const chartPie = vm.$echarts.init(document.getElementById(vm.pieId));
const options = {
// color: echartColors,
title: {
text: "总人数: " + vm.count,
text: '总人数: ' + vm.count,
top: '10%',
left: '60%',
textStyle: {
fontSize: 12,
fontWeight: "bolder",
color: "#000000"
}
fontWeight: 'bolder',
color: '#000000',
},
},
tooltip: {
trigger: "item",
trigger: 'item',
// formatter: "{a} <br/>{b} : {c} ({d}%)"
formatter: "{b}{c}"
formatter: '{b}{c}人',
},
legend: {
type: "scroll",
type: 'scroll',
// type: "plain", // 普通图例
orient: "vertical",
orient: 'vertical',
itemWidth: 9,
itemHeight: 9,
borderRadius: 20,
// orient:'horizontal',
top: '20%',
left: "60%",
left: '60%',
bottom: 20,
selected: this.legendDataNotSelected,
data: vm.legendData, // ["优秀证书", "及格证书", "未获证"],
textStyle: {
fontSize: 12,
color: "#8C8C8C",
color: '#8C8C8C',
},
formatter: function (name) {
return name + ' ' + vm.fmtLengend(name);
},
formatter: function(name) {
return name + " " + vm.fmtLengend(name);
},
},
series: [
{
name: "证书分布情况",
type: "pie",
name: '证书分布情况',
type: 'pie',
label: {
position: "inner",
formatter: function(config) {
position: 'inner',
formatter: function (config) {
// return `${config.percent}%`;
return `${config.percent.toFixed(1)}%`;
}
},
},
radius: "65%",
center: ["30%", "50%"],
radius: '65%',
center: ['30%', '50%'],
data: vm.seriesData, // vm.pieData,
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)"
}
}
}
]
shadowColor: 'rgba(0, 0, 0, 0.5)',
},
},
},
],
};
chartPie.setOption(options, true);
},
fmtLengend(name) {
let item = this.dataList.find(item => {
const item = this.dataList.find((item) => {
return item.name === name;
});
return (item && item.value) || 0;
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
......
<!-- 饼图 -->
<template>
<section class="chart-pie">
<div v-show="isShow" :id="id" :style="{width: '100%', height: '220px'}"></div>
<NoContent v-show="!isShow" :id="id" :style="{width: '100%', height: '220px'}"></NoContent>
<div
v-show="isShow"
:id="id"
:style="{ width: '100%', height: '220px' }"
/>
<NoContent
v-show="!isShow"
:id="id"
:style="{ width: '100%', height: '220px' }"
/>
</section>
</template>
<script>
import { echartColors } from '@/utils/index'
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
let vm = null;
let chartPie = null;
let options = null;
let certNameConfig = {
const certNameConfig = {
'-1': '未获证人数',
'1': '获优秀人数',
'2': '获良好人数',
'3': '获及格人数',
'4': '获不及格人数',
}
1: '获优秀人数',
2: '获良好人数',
3: '获及格人数',
4: '获不及格人数',
};
export default {
components: {
NoContent
NoContent,
},
props: {
id: {
type: String,
default: 'chartPieId'
default: 'chartPieId',
},
pieData: {
type: Array,
default: () => [
{ value: 10, name: "优秀证书" },
{ value: 10, name: "及格证书" },
{ value: 10, name: "未获证" }
]
{ value: 10, name: '优秀证书' },
{ value: 10, name: '及格证书' },
{ value: 10, name: '未获证' },
],
},
certFlag: {
type: String | Number,
default: 1
}
type: Number,
default: 1,
},
},
data() {
return {
chartHeight: "1000px",
chartHeight: '1000px',
handledData: {},
legendDataNotSelected: {},
legendData: [],
seriesData: {},
isShow: true
isShow: true,
};
},
watch: {
pieData: {
handler(newValue, oldValue) {
handler(newValue) {
// 如果有数据,则处理数据并显示图表
if(newValue.length) {
if (newValue.length) {
this.isShow = true;
for(let i = 0; i < newValue.length; i ++) {
if(this.certFlag == 1 && newValue[i].certId != -1) {
newValue[i].certName = '已获证人数'
for (let i = 0; i < newValue.length; i++) {
if (this.certFlag == 1 && newValue[i].certId != -1) {
newValue[i].certName = '已获证人数';
} else {
newValue[i].certName = certNameConfig[newValue[i].certId];
newValue[i].certName = certNameConfig[newValue[i].certId];
}
}
this.handlePieData(newValue);
......@@ -69,24 +76,25 @@ export default {
} else {
this.isShow = false;
}
},
deep: true
}
deep: true,
},
},
mounted() {
vm = this;
},
methods: {
handlePieData(pieData) {
let legendDataNotSelected = {}, legendData = [], seriesData = [];
pieData.forEach( (item, i) => {
if(!pieData[i].doneCount) {
legendDataNotSelected[pieData[i].certName] = false
const legendDataNotSelected = {},
legendData = [],
seriesData = [];
pieData.forEach((item, i) => {
if (!pieData[i].doneCount) {
legendDataNotSelected[pieData[i].certName] = false;
}
legendData.push(item.certName);
seriesData.push({ name: item.certName, value: item.doneCount});
})
seriesData.push({ name: item.certName, value: item.doneCount });
});
this.legendDataNotSelected = legendDataNotSelected;
this.legendData = legendData;
this.seriesData = seriesData;
......@@ -99,20 +107,20 @@ export default {
},
// 绘制图表
drawPie() {
if(!chartPie) {
if (!chartPie) {
chartPie = vm.$echarts.init(document.getElementById(vm.id));
}
options = {
// color: echartColors,
tooltip: {
trigger: "item",
trigger: 'item',
// formatter: "{a} <br/>{b} : {c} ({d}%)"
formatter: "{b}{c}"
formatter: '{b}{c}人',
},
legend: {
type: "scroll",
orient: "vertical",
type: 'scroll',
orient: 'vertical',
// orient:'horizontal',
top: '25%',
left: '60%',
......@@ -122,48 +130,48 @@ export default {
textStyle: {
fontSize: 12,
// fontWeight: "bolder",
color: "#8C8C8C"
color: '#8C8C8C',
},
formatter: function(name) {
formatter: function (name) {
return name;
}
},
},
series: [
{
name: "证书分布情况",
type: "pie",
name: '证书分布情况',
type: 'pie',
label: {
position: "inner",
formatter: function(config) {
position: 'inner',
formatter: function (config) {
return `${config.percent.toFixed(1)}%`;
}
},
},
radius: "65%",
center: ["30%", "50%"],
radius: '65%',
center: ['30%', '50%'],
data: vm.seriesData,
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)"
}
}
}
]
shadowColor: 'rgba(0, 0, 0, 0.5)',
},
},
},
],
};
chartPie.setOption(options, true);
},
fmtLengend(name) {
let item = this.pieData.find(item => {
const item = this.pieData.find((item) => {
return item.certName === name;
});
return (item && item.doneCount) || 0;
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
......
<!-- Tabs组件 -->
<template>
<div class="common-process">
<span class="bar" :style="{'width': width, 'background': barColor}"></span>
<span class="desc">{{value}}{{unitName}}</span>
<span
class="bar"
:style="{ width: width, background: barColor }"
/>
<span class="desc">{{ value }}{{ unitName }}</span>
</div>
</template>
<script>
......@@ -10,31 +13,31 @@ export default {
props: {
max: {
type: Number,
default: 100
default: 100,
},
value: {
type: Number,
default: 100
default: 100,
},
barColor: {
type: String,
default: '#adadad'
default: '#adadad',
},
unitName: {
type: String,
default: '分钟'
}
default: '分钟',
},
},
computed: {
width() {
return Math.round((this.value / this.max) * 300) + 'px'
}
return Math.round((this.value / this.max) * 300) + 'px';
},
},
methods: {}
methods: {},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-process {
width: 100%;
height: 20px;
......
<template>
<template>
<!-- 专项合作列表 -->
<section class="coop-container">
<div
v-for="(item , index) in dataList"
v-for="(item, index) in dataList"
:key="index"
class="coop-item"
@click="jumpByPType(item)"
......@@ -11,89 +11,94 @@
<img :src="item.attachmentUrl">
</div>
<div class="coop-item-right">
<span class="coop-item-right-title">{{item.projectName}}</span>
<span class="coop-item-right-title">{{ item.projectName }}</span>
<span class="coop-item-right-other">
<img src="../../assets/images/org.png" >
{{item.organizationNameList | subOrgNames}}
<img src="../../assets/images/org.png">
{{ item.organizationNameList | subOrgNames }}
</span>
<span v-if="item.pType == 1"
class="coop-item-right-other">
<img src="../../assets/images/pub-time.png" >
{{item.oldTime}}
<span
v-if="item.pType == 1"
class="coop-item-right-other"
>
<img src="../../assets/images/pub-time.png">
{{ item.oldTime }}
</span>
<span v-else
<span
v-else
class="coop-item-right-other"
><img src="../../assets/images/pub-time.png" >
{{item.projectBegintimeLong | formatTime}}-{{item.projectEndtimeLong | formatTime}}
><img src="../../assets/images/pub-time.png">
{{ item.projectBegintimeLong | formatTime }}-{{
item.projectEndtimeLong | formatTime
}}
</span>
</div>
</div>
</section>
</template>
<script>
import { goNativePage, goPageByNative, parseTime } from "@/utils/index";
import { goNativePage, goPageByNative, parseTime } from '@/utils/index';
import { BASE_URL } from '@/utils/enumerate';
const { NUXT_ENV_APP } = process.env;
export default {
name: "coop-list-item",
data() {
return {
bgColor: "green"
};
},
props: {
dataList: {
type: Array,
default: () => []
},
},
mounted() {},
name: 'CoopListItem',
filters: {
subOrgNames(orgNameList) {
let allName = orgNameList[0];
for(let i = 1; i < orgNameList.length; i ++) {
allName += `/${orgNameList[i]}`
for (let i = 1; i < orgNameList.length; i++) {
allName += `/${orgNameList[i]}`;
}
if (allName && allName.length > 13) {
return allName.substring(0, 13) + '...'
return allName.substring(0, 13) + '...';
} else {
return allName
return allName;
}
},
// 将字符串截短至指定长度,并用在最后追加特定字符串(例如:...)
shortNameL(value, length = 15, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
return value.substring(0, length) + append;
} else {
return value
return value;
}
},
// 格式化日期
formatTime: function (timeStamp, format = '{yyyy}.{mm}.{dd}') {
return parseTime(timeStamp, format)
},
return parseTime(timeStamp, format);
},
},
props: {
dataList: {
type: Array,
default: () => [],
},
},
data() {
return {
bgColor: 'green',
};
},
mounted() {},
methods: {
jumpByPType(pInfo) {
this.$sendBuriedData && this.$sendBuriedData({
component_tag: `467#400141#${pInfo.id}#${pInfo.projectName}`,
class_name: `learning_report`,
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`
});
if(pInfo.pType == 1) {
this.$sendBuriedData &&
this.$sendBuriedData({
component_tag: `467#400141#${pInfo.id}#${pInfo.projectName}`,
class_name: 'learning_report',
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`,
});
if (pInfo.pType == 1) {
goNativePage(this, pInfo);
} else {
goPageByNative(this, `/lreport_ssr/?projectId=${pInfo.id}`);
}
}
}
},
},
};
</script>
<style scoped lang="less">
<style scoped lang="scss">
.coop-container {
position: relative;
margin: 0px 15px;
......@@ -175,26 +180,26 @@ export default {
}
}
}
.update-dialog-content{
.update-dialog-content {
padding: 0 15px;
box-sizing: border-box;
.title{
.title {
text-align: center;
color: #373839;
font-size: 18px;
padding: 15px 0;
line-height: 25px;
}
.update-btn{
.update-btn {
text-align: center;
height: 55px;
line-height: 55px;
font-size: 16px;
color: #979899;
&.confirm-btn{
&.confirm-btn {
color: #449284;
}
&.v-hairline-top::after{
&.v-hairline-top::after {
border-top-width: 1px;
}
}
......@@ -203,4 +208,3 @@ export default {
// background-color: rgba(0,0,0,0.5);
// }
</style>
......@@ -6,48 +6,51 @@
<li>课程时长</li>
<li>人均学习时长</li>
</ul>
<ul v-if="dataList.length" class="list">
<li v-for="(item, index) in dataList" :key="index">
<span>{{item.courseName | shortName}}</span>
<span>{{item.courseTime | convert}}</span>
<span>{{item.averageTime | convert}}</span>
<ul
v-if="dataList.length"
class="list"
>
<li
v-for="(item, index) in dataList"
:key="index"
>
<span>{{ item.courseName | shortName }}</span>
<span>{{ item.courseTime | convert }}</span>
<span>{{ item.averageTime | convert }}</span>
</li>
</ul>
<NoContent v-show="!dataList.length"></NoContent>
<NoContent v-show="!dataList.length" />
</div>
</template>
<script>
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
export default {
components: {
NoContent
},
props: {
dataList: {
type: Array,
default: () => []
}
NoContent,
},
filters: {
shortName: function (value, length = 8, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
return value.substring(0, length) + append;
} else {
return value
return value;
}
},
convert: function (value, unitName = '分钟') {
if(!value) return 0 + unitName;
return Math.ceil(value / 60) + unitName
if (!value) return 0 + unitName;
return Math.ceil(value / 60) + unitName;
},
},
methods: {
props: {
dataList: {
type: Array,
default: () => [],
},
},
methods: {},
};
</script>
<style scoped lang="less">
<style scoped lang="scss">
.corse-times-list {
font-size: 14px;
.title {
......@@ -101,4 +104,4 @@ export default {
}
}
}
</style>
\ No newline at end of file
</style>
<!-- 课程时长统计 -->
<template>
<div>
<ul class="lr-course-times" v-show="maxDuration > avgDuration">
<ul
v-show="maxDuration > avgDuration"
class="lr-course-times"
>
<li>
<p>
课程总时长
<span>(所有课程数 {{totalSize}}门)</span>
<span>(所有课程数 {{ totalSize }}门)</span>
</p>
<ProcessBar :processDataObj="processDataObj" :maxValue="maxDuration | convert" :value="maxDuration | convert"></ProcessBar>
<ProcessBar
:process-data-obj="processDataObj"
:max-value="maxDuration | convert"
:value="maxDuration | convert"
/>
</li>
<li>
<p>平均学习时长</p>
<ProcessBar barColor="#FFB01A" :processDataObj="processDataObj" :maxValue="maxDuration | convert" :value="avgDuration | convert"></ProcessBar>
<ProcessBar
bar-color="#FFB01A"
:process-data-obj="processDataObj"
:max-value="maxDuration | convert"
:value="avgDuration | convert"
/>
</li>
</ul>
<ul class="lr-course-times" v-show="avgDuration > maxDuration">
<ul
v-show="avgDuration > maxDuration"
class="lr-course-times"
>
<li>
<p>
课程总时长
<span>(所有课程数 {{totalSize}}门)</span>
<span>(所有课程数 {{ totalSize }}门)</span>
</p>
<ProcessBar :processDataObj="processDataObj" :maxValue="avgDuration | convert" :value="maxDuration | convert"></ProcessBar>
<ProcessBar
:process-data-obj="processDataObj"
:max-value="avgDuration | convert"
:value="maxDuration | convert"
/>
</li>
<li>
<p>平均学习时长</p>
<ProcessBar barColor="#FFB01A" :processDataObj="processDataObj" :maxValue="avgDuration | convert" :value="avgDuration | convert"></ProcessBar>
<ProcessBar
bar-color="#FFB01A"
:process-data-obj="processDataObj"
:max-value="avgDuration | convert"
:value="avgDuration | convert"
/>
</li>
</ul>
</div>
</template>
<script>
import ProcessBar from "@/components/common/pica-process";
import ProcessBar from '@/components/common/pica-process';
export default {
filters: {
// 将秒转换成分钟
convert: function (value) {
if (!value) return 0;
return Math.ceil(value / 60);
},
},
components: {
ProcessBar,
},
props: {
totalSize: {
type: Number | String,
default: 0
type: Number,
default: 0,
},
maxDuration: {
type: Number | String,
default: 100
type: Number,
default: 100,
},
avgDuration: {
type: Number | String,
default: 100
type: Number,
default: 100,
},
processDataObj: {
type: Object,
default: () => {
return {
maxValue: 100,
value: 0
}
}
value: 0,
};
},
},
},
filters: {
// 将秒转换成分钟
convert: function (value, unitName = '分钟') {
if(!value) return 0;
return Math.ceil(value / 60);
},
},
components: {
ProcessBar,
},
methods: {}
methods: {},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.lr-course-times {
margin: 20px 15px;
li {
......
......@@ -5,42 +5,46 @@
<li>考试名</li>
<li>参与通过率</li>
</ul>
<ul v-if="dataList.length" class="list">
<li v-for="(item, index) in dataList" :key="index">
<span>{{item.examName | shortName}}</span>
<span>{{(item.joinRate * 100).toFixed(1)}}%</span>
<ul
v-if="dataList.length"
class="list"
>
<li
v-for="(item, index) in dataList"
:key="index"
>
<span>{{ item.examName | shortName }}</span>
<span>{{ (item.joinRate * 100).toFixed(1) }}%</span>
</li>
</ul>
<NoContent v-show="!dataList.length"></NoContent>
<NoContent v-show="!dataList.length" />
</div>
</template>
<script>
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
export default {
components: {
NoContent
},
props: {
dataList: {
type: Array,
default: () => []
}
NoContent,
},
filters: {
shortName: function (value, length = 12, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
return value.substring(0, length) + append;
} else {
return value
return value;
}
},
},
methods: {
}
props: {
dataList: {
type: Array,
default: () => [],
},
},
methods: {},
};
</script>
<style scoped lang="less">
<style scoped lang="scss">
.exam-list-wrapper {
font-size: 14px;
.title {
......@@ -89,4 +93,4 @@ export default {
}
}
}
</style>
\ No newline at end of file
</style>
<!-- 完成项目考试分数情况 -->
<template>
<div class="exam-score-wrapper">
<TipsInfo></TipsInfo>
<TipsInfo />
<ul class="title">
<li>考试分数(分)</li>
<li>考试人数(个)</li>
</ul>
<ul v-if="dataList.length" class="list">
<li v-for="(item, index) in dataList" :key="index">
<span>{{item.timesStr}}</span>
<span>{{item.count}}</span>
<ul
v-if="dataList.length"
class="list"
>
<li
v-for="(item, index) in dataList"
:key="index"
>
<span>{{ item.timesStr }}</span>
<span>{{ item.count }}</span>
</li>
</ul>
<NoContent v-show="!dataList.length"></NoContent>
<NoContent v-show="!dataList.length" />
</div>
</template>
<script>
import TipsInfo from '@/components/bussiness/tips-info'
import NoContent from "@/components/bussiness/no-content";
import TipsInfo from '@/components/bussiness/tips-info';
import NoContent from '@/components/bussiness/no-content';
export default {
components: {
TipsInfo,
NoContent
NoContent,
},
props: {
dataList: {
type: Array,
default: () => []
}
default: () => [],
},
},
};
</script>
<style scoped lang="less">
<style scoped lang="scss">
.exam-score-wrapper {
font-size: 14px;
.title {
......@@ -42,7 +47,7 @@ export default {
justify-content: center;
height: 60px;
line-height: 60px;
border-bottom: 1px solid #f0f1f2;
border-bottom: 1px solid #f0f1f2;
// background: #e3efed;
// border-radius: 6px 6px 0px 0px;
li {
......@@ -84,4 +89,4 @@ export default {
}
}
}
</style>
\ No newline at end of file
</style>
<!-- 完成项目考试次数情况 -->
<template>
<div class="exam-times-wrapper">
<TipsInfo></TipsInfo>
<TipsInfo />
<ul class="title">
<li>考试次数(次)</li>
<li>考试人数(个)</li>
</ul>
<ul v-if="dataList.length" class="list">
<li v-for="(item, index) in dataList" :key="index">
<span>{{item.times}}</span>
<span>{{item.count}}</span>
<ul
v-if="dataList.length"
class="list"
>
<li
v-for="(item, index) in dataList"
:key="index"
>
<span>{{ item.times }}</span>
<span>{{ item.count }}</span>
</li>
</ul>
<NoContent v-show="!dataList.length"></NoContent>
<NoContent v-show="!dataList.length" />
</div>
</template>
<script>
import TipsInfo from '@/components/bussiness/tips-info'
import NoContent from "@/components/bussiness/no-content";
import TipsInfo from '@/components/bussiness/tips-info';
import NoContent from '@/components/bussiness/no-content';
export default {
components: {
TipsInfo,
NoContent
NoContent,
},
props: {
dataList: {
type: Array,
default: () => []
}
default: () => [],
},
},
};
</script>
<style scoped lang="less">
<style scoped lang="scss">
.exam-times-wrapper {
font-size: 14px;
.title {
......@@ -41,7 +47,7 @@ export default {
justify-content: center;
height: 60px;
line-height: 60px;
border-bottom: 1px solid #f0f1f2;
border-bottom: 1px solid #f0f1f2;
// background: #e3efed;
// border-radius: 6px 6px 0px 0px;
li {
......@@ -83,4 +89,4 @@ export default {
}
}
}
</style>
\ No newline at end of file
</style>
......@@ -11,14 +11,14 @@
<script>
export default {
name: "no-content",
name: 'NoContent',
data() {
return {};
}
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.nc-container {
display: flex;
width: 100%;
......@@ -43,4 +43,3 @@ export default {
}
}
</style>
......@@ -2,85 +2,126 @@
<template>
<div class="corse-times-list">
<ul class="title">
<li :class="{'active': cIndex === 0}" @click="tabClick(0)">{{ certFlag ? '已获证' : '已完成'}}</li>
<li :class="{'active': cIndex === 1}" @click="tabClick(1)">{{ certFlag ? '未获证' : '未完成'}}</li>
<li :class="{'active': cIndex === 2}" @click="tabClick(2)">未参与</li>
<li
:class="{ active: cIndex === 0 }"
@click="tabClick(0)"
>
{{ certFlag ? '已获证' : '已完成' }}
</li>
<li
:class="{ active: cIndex === 1 }"
@click="tabClick(1)"
>
{{ certFlag ? '未获证' : '未完成' }}
</li>
<li
:class="{ active: cIndex === 2 }"
@click="tabClick(2)"
>
未参与
</li>
</ul>
<ul v-show="cIndex === 0" class="list">
<li v-for="(item, index) in certUserList" :key="index">
<span>{{(item.doctorName || '- ' ) | shortName}}</span>
<span>{{(item.departmentName || '- ') | shortName}}</span>
<span v-show="containOfficialFlag">成绩 {{item.score || '- '}}</span>
<ul
v-show="cIndex === 0"
class="list"
>
<li
v-for="(item, index) in certUserList"
:key="index"
>
<span>{{ (item.doctorName || '- ') | shortName }}</span>
<span>{{ (item.departmentName || '- ') | shortName }}</span>
<span
v-show="containOfficialFlag"
>成绩 {{ item.score || '- ' }}</span>
</li>
</ul>
<ul v-show="cIndex === 1" class="list">
<li v-for="(item, index) in noCertUserList" :key="index">
<span>{{(item.doctorName || '- ') | shortName}}</span>
<span>{{(item.departmentName || '- ') | shortName}}</span>
<ul
v-show="cIndex === 1"
class="list"
>
<li
v-for="(item, index) in noCertUserList"
:key="index"
>
<span>{{ (item.doctorName || '- ') | shortName }}</span>
<span>{{ (item.departmentName || '- ') | shortName }}</span>
<span v-show="containOfficialFlag">- </span>
</li>
</ul>
<ul v-show="cIndex === 2" class="list">
<li v-for="(item, index) in noJoinList" :key="index">
<span>{{(item.doctorName || '- ') | shortName}}</span>
<span>{{(item.departmentName || '- ') | shortName}}</span>
<ul
v-show="cIndex === 2"
class="list"
>
<li
v-for="(item, index) in noJoinList"
:key="index"
>
<span>{{ (item.doctorName || '- ') | shortName }}</span>
<span>{{ (item.departmentName || '- ') | shortName }}</span>
<span v-show="containOfficialFlag">- </span>
</li>
</ul>
<NoContent v-show="((cIndex === 0 && !certUserList.length) || (cIndex === 1 && !noCertUserList.length) || (cIndex === 2 && !noJoinList.length))"></NoContent>
<NoContent
v-show="
(cIndex === 0 && !certUserList.length) ||
(cIndex === 1 && !noCertUserList.length) ||
(cIndex === 2 && !noJoinList.length)
"
/>
</div>
</template>
<script>
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
export default {
components: {
NoContent
NoContent,
},
data() {
return {
cIndex: 0,
hasClicked: [true, false, false]
}
filters: {
shortName: function (value, length = 5, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append;
} else {
return value;
}
},
},
props: {
certUserList: {
type: Array,
default: () => []
default: () => [],
},
noCertUserList: {
type: Array,
default: () => []
default: () => [],
},
noJoinList: {
type: Array,
default: () => []
default: () => [],
},
tabIndex: {
type: String | Number,
default: 0
type: Number,
default: 0,
},
certFlag: {
type: String | Number,
default: 0
type: Number,
default: 0,
},
containOfficialFlag: {
type: String | Number,
default: 0
}
type: Number,
default: 0,
},
},
data() {
return {
cIndex: 0,
hasClicked: [true, false, false],
};
},
watch: {
tabIndex(newVal) {
this.cIndex = newVal;
}
},
filters: {
shortName: function (value, length = 5, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
} else {
return value
}
},
},
methods: {
......@@ -91,11 +132,11 @@ export default {
// this.$emit('orgDoctorTabChange', index);
// }
this.$emit('orgDoctorTabChange', index);
}
}
},
},
};
</script>
<style scoped lang="less">
<style scoped lang="scss">
.corse-times-list {
font-size: 14px;
.title {
......@@ -105,7 +146,7 @@ export default {
justify-content: space-between;
height: 50px;
line-height: 50px;
background: #F8F9FA;
background: #f8f9fa;
li {
position: relative;
top: 0;
......@@ -131,7 +172,6 @@ export default {
}
}
}
}
.list {
font-size: 16px;
......@@ -156,4 +196,4 @@ export default {
}
}
}
</style>
\ No newline at end of file
</style>
<template>
<template>
<div class="pop-notice-wrapper">
<div class="mask"></div>
<div class="mask" />
<div class="content">
<div class="top">
<!-- <span class="title">{{noticeData.noticeTitle | shortName(20)}}</span> -->
......@@ -10,8 +10,11 @@
{{ tipsContent }}
</span>
</div>
<div class="line"></div>
<div class="bottom" @click="clickTips">
<div class="line" />
<div
class="bottom"
@click="clickTips"
>
<span>我知道了</span>
</div>
</div>
......@@ -20,39 +23,39 @@
<script>
export default {
data() {
return {};
filters: {
shortContent(value, maxLength = 18) {
if (value && value.length > maxLength) {
return value.substr(0, maxLength) + '...';
}
},
},
props: {
popText: {
type: String,
default: ""
default: '',
},
btnText: {
type: String,
default: ""
default: '',
},
tipsContent: {
type: String,
default: "是已获证人数/应参与人数*100%"
}
default: '是已获证人数/应参与人数*100%',
},
},
filters: {
shortContent(value, maxLength = 18) {
if(value && value.length > maxLength) {
return value.substr(0, maxLength) + '...'
}
}
data() {
return {};
},
methods: {
clickTips() {
this.$emit("clickTips");
}
}
this.$emit('clickTips');
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.pop-notice-wrapper {
position: fixed;
width: 100%;
......@@ -121,4 +124,3 @@ export default {
}
}
</style>
<!-- 完成天数排名组件 -->
<template>
<div>
<ul v-if="rankList.length" class="rank-item-days">
<li v-for="(item, index) in rankList" :key="index">
<ul
v-if="rankList.length"
class="rank-item-days"
>
<li
v-for="(item, index) in rankList"
:key="index"
>
<div class="order">
<img v-if="index === 0 || index === 1 || index === 2" :src="getRankImgUrl(index)" alt="">
<span v-else>{{index + 1}}</span>
<img
v-if="index === 0 || index === 1 || index === 2"
:src="getRankImgUrl(index)"
alt=""
>
<span v-else>{{ index + 1 }}</span>
</div>
<div class="content">
<p class="desc-3">{{item.subName | shortName}}</p>
<p class="desc-3">
{{ item.subName | shortName }}
</p>
<!-- <p class="desc-2">完成人数 8860 | 参与人数 101</p> -->
</div>
<div class="ratio">
<p class="desc-1">{{(item.costTime || 0).toFixed(1) }}</p>
<p class="desc-2">完成天数</p>
<p class="desc-1">
{{ (item.costTime || 0).toFixed(1) }}
</p>
<p class="desc-2">
完成天数
</p>
</div>
</li>
</ul>
<NoContent v-show="!rankList.length"></NoContent>
<NoContent v-show="!rankList.length" />
</div>
</template>
<script>
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
export default {
components: {
NoContent
},
props: {
rankList: {
type: Array,
default: () => []
}
NoContent,
},
filters: {
shortName: function (value, length = 12, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
return value.substring(0, length) + append;
} else {
return value
return value;
}
},
},
props: {
rankList: {
type: Array,
default: () => [],
},
},
methods: {
getRankImgUrl(index) {
return require(`../../assets/images/rank-${index + 1}.png`);
}
},
},
}
};
</script>
<style scoped lang="less">
<style scoped lang="scss">
.rank-item-days {
margin: 0 15px;
li {
......@@ -106,4 +121,4 @@ export default {
color: #373839;
}
}
</style>
\ No newline at end of file
</style>
<!-- 培训情况排名组件 -->
<template>
<div>
<ul v-if="rankList.length" class="rank-item">
<li v-for="(item, index) in rankList" :key="index">
<ul
v-if="rankList.length"
class="rank-item"
>
<li
v-for="(item, index) in rankList"
:key="index"
>
<div class="order">
<img v-if="index === 0 || index === 1 || index === 2" :src="getRankImgUrl(index)" alt />
<span v-else>{{index + 1}}</span>
<img
v-if="index === 0 || index === 1 || index === 2"
:src="getRankImgUrl(index)"
alt
>
<span v-else>{{ index + 1 }}</span>
</div>
<div class="content">
<span class="desc-1">{{item.subName | shortName}}</span>
<span class="desc-2">{{certFlag ? '获证人数' : '完成人数'}} {{item.certCount}} | 参与人数 {{item.joinCount}}</span>
<span class="desc-1">{{ item.subName | shortName }}</span>
<span
class="desc-2"
>{{ certFlag ? '获证人数' : '完成人数' }} {{ item.certCount }} |
参与人数 {{ item.joinCount }}</span>
</div>
<div class="ratio">
<span class="desc-1">{{(item.certRate * 100).toFixed(1)}}%</span>
<span class="desc-2">{{certFlag ? '获证比例' : '完成比例'}}</span>
<span class="desc-1">{{ (item.certRate * 100).toFixed(1) }}%</span>
<span class="desc-2">{{ certFlag ? '获证比例' : '完成比例' }}</span>
</div>
</li>
</ul>
<NoContent v-if="!rankList.length"></NoContent>
<NoContent v-if="!rankList.length" />
</div>
</template>
<script>
import NoContent from "@/components/bussiness/no-content";
import NoContent from '@/components/bussiness/no-content';
export default {
components: {
NoContent
},
props: {
rankList: {
type: Array,
default: () => []
},
certFlag: {
type: String | Number,
default: 0
}
NoContent,
},
filters: {
shortName: function (value, length = 12, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
return value.substring(0, length) + append;
} else {
return value
return value;
}
},
},
props: {
rankList: {
type: Array,
default: () => [],
},
certFlag: {
type: Number,
default: 0,
},
},
methods: {
getRankImgUrl(index) {
return require(`../../assets/images/rank-${index + 1}.png`);
}
}
},
},
};
</script>
<style scoped lang="less">
<style scoped lang="scss">
.rank-item {
margin: 0 15px;
li {
......@@ -106,4 +119,4 @@ export default {
color: #979899;
}
}
</style>
\ No newline at end of file
</style>
<!-- 提示信息:报表专用 -->
<template>
<div class="tips-info-wrapper">
<span>{{ content }}</span>
</div>
</template>
<script>
export default {
props: {
content: {
type: String,
default: '报表数据来源包括用户参加正式考试,不包含摸底考试',
},
},
};
</script>
<style lang="scss" scoped>
.tips-info-wrapper {
height: 44px;
line-height: 44px;
font-size: 20px;
padding: 0 15px;
text-align: center;
span {
display: inline-block;
width: 100%;
font-size: 13px;
font-weight: 400;
color: #676869;
}
}
</style>
<!-- 提示信息 -->
<template>
<div class="tips-info-wrapper">
<span>{{ content }}</span>
</div>
</template>
<script>
export default {
props: {
content: {
type: String,
default: '报表数据来源包括用户参加正式考试,不包含摸底考试',
},
},
};
</script>
<style lang="scss" scoped>
.tips-info-wrapper {
height: 44px;
line-height: 44px;
font-size: 20px;
padding: 0 15px;
span {
display: inline-block;
width: 100%;
font-size: 13px;
font-weight: 400;
color: #676869;
border-bottom: 1px solid #f0f1f2;
}
}
</style>
......@@ -2,7 +2,9 @@
<template>
<div class="common-title-wrapper-point">
<ul class="mini">
<li class="left">{{title}}</li>
<li class="left">
{{ title }}
</li>
<li class="right">
<span>培训前正确率</span>
<span>培训后正确率</span>
......@@ -15,13 +17,13 @@ export default {
props: {
title: {
type: String,
default: "证书分布情况"
}
}
default: '证书分布情况',
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-title-wrapper-point {
position: fixed;
width: 100%;
......@@ -60,21 +62,21 @@ export default {
margin-left: 10px;
&:nth-child(1)::before {
display: inline-block;
content: "";
content: '';
width: 9px;
height: 9px;
margin-right: 3px;
border-radius: 5px;
background: #FFB01B;
background: #ffb01b;
}
&:nth-child(2)::before {
display: inline-block;
content: "";
content: '';
width: 9px;
height: 9px;
margin-right: 3px;
border-radius: 5px;
background: #39AF9A;
background: #39af9a;
}
}
}
......
<!-- 区域与机构选择(表头)组件 -->
<template>
<ul class="common-area-select">
<li class="center" @click="areaClick">
<span><img class="map" src="../../assets/images/map-icon.png"/>{{areaName}}</span><img v-show="!showArea" src="../../assets/images/arr-down.png"/><img v-show="showArea" src="../../assets/images/arr-up.png"/>
<li
class="center"
@click="areaClick"
>
<span><img
class="map"
src="../../assets/images/map-icon.png"
>{{
areaName
}}</span><img
v-show="!showArea"
src="../../assets/images/arr-down.png"
><img
v-show="showArea"
src="../../assets/images/arr-up.png"
>
</li>
</ul>
</template>
<script>
import { mapGetters } from "vuex";
import { mapGetters } from 'vuex';
export default {
props: {
areaName: {
type: String,
default: "全部"
default: '全部',
},
showArea: {
type: Boolean,
......@@ -21,19 +34,19 @@ export default {
},
computed: {
...mapGetters({
areaDegree: 'areaDegree'
areaDegree: 'areaDegree',
}),
},
methods: {
areaClick() {
this.$emit("areaClick");
this.$emit('areaClick');
},
}
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-area-select {
&.fixed {
position: fixed;
......@@ -63,9 +76,9 @@ export default {
font-size: 15px;
font-weight: 400;
color: #676869;
background: #F8F9FA;
background: #f8f9fa;
&.gray {
color: #C7C8C9;
color: #c7c8c9;
}
.map {
position: relative;
......
<!-- (最下面)更多信息组件 -->
<template>
<div class="common-bottom-info">
<span>{{infoMsg1}}</span>
<span>{{infoMsg2}}</span>
<span>{{ infoMsg1 }}</span>
<span>{{ infoMsg2 }}</span>
</div>
</template>
<script>
......@@ -10,16 +10,16 @@ export default {
props: {
infoMsg1: {
type: String,
default: "更多报告信息请前往"
default: '更多报告信息请前往',
},
infoMsg2: {
type: String,
default: "【云鹊医官网电脑端-工作站-学情报告】查看"
}
}
default: '【云鹊医官网电脑端-工作站-学情报告】查看',
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-bottom-info {
display: flex;
width: 100%;
......@@ -40,4 +40,4 @@ export default {
padding-top: 10px;
}
}
</style>
\ No newline at end of file
</style>
<!-- Card组件(支持两列、三列甚至四列) -->
<template>
<div class="common-card" :class="{'bg': needBG}">
<ul v-for="(item, index) in cardList" :key="index">
<li :class="{'bgf': needBG}">{{item.count}}{{item.unitName}}</li>
<li :class="{'bgf': needBG}">{{item.description}}</li>
<div
class="common-card"
:class="{ bg: needBG }"
>
<ul
v-for="(item, index) in cardList"
:key="index"
>
<li :class="{ bgf: needBG }">
{{ item.count }}{{ item.unitName }}
</li>
<li :class="{ bgf: needBG }">
{{ item.description }}
</li>
</ul>
</div>
</template>
......@@ -12,18 +22,18 @@ export default {
props: {
cardList: {
type: Array,
default: () => []
default: () => [],
},
needBG: {
type: Boolean,
default: false
}
default: false,
},
},
methods: {}
methods: {},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-card {
display: flex;
margin: 30px 15px;
......
<!-- 通用Navbar -->
<template>
<section :class="isFixNavbar ? 'nav-top-new fixed' : 'nav-top-new'" :style="'height:' + navHeight">
<section
:class="isFixNavbar ? 'nav-top-new fixed' : 'nav-top-new'"
:style="'height:' + navHeight"
>
<div
class="nav-part-new"
:style="'background:' + bgColor + ';'
+ 'padding-top:' + paddingTop + ';border-bottom:' + borderStyle"
:style="
'background:' +
bgColor +
';' +
'padding-top:' +
paddingTop +
';border-bottom:' +
borderStyle
"
>
<div class="nav-title-new">
<span class="nav-back" @click="goBack">
<img v-show="isBlack" src="../../assets/images/left-arrow-black.png" alt="">
<img v-show="!isBlack" src="../../assets/images/left-arrow-black.png" alt="">
<span
class="nav-back"
@click="goBack"
>
<img
v-show="isBlack"
src="../../assets/images/left-arrow-black.png"
alt=""
>
<img
v-show="!isBlack"
src="../../assets/images/left-arrow-black.png"
alt=""
>
</span>
<span class="nav-title-new-title" v-show="bgColor!=='none'">{{title}}</span>
<span v-show="isShowShare" class="nav-share" @click="goShare">
<span
v-show="bgColor !== 'none'"
class="nav-title-new-title"
>{{
title
}}</span>
<span
v-show="isShowShare"
class="nav-share"
@click="goShare"
>
<img
src="https://pica-pro.oss-cn-shanghai.aliyuncs.com/eagle_plan/courses/Group17_hover%403x.png"
>
</span>
<span v-show="isShowKf && !isWeb" class="nav-share" @click="goKf">
<img src="../../assets/images/kf.png" alt="">
<span
v-show="isShowKf && !isWeb"
class="nav-share"
@click="goKf"
>
<img
src="../../assets/images/kf.png"
alt=""
>
</span>
</div>
</div>
......@@ -27,68 +64,68 @@
<script>
import { goKfFn } from '@/utils/kf';
export default {
name: "common-navbar-new",
data() {
return {
navbarHeight: 28,
contentHeight: 35,
fontSize: 37.5,
content: "",
shareImageUrl:
"https://file.yunqueyi.com/logo.png?version=" + new Date().getTime(),
isWeb: false
};
},
name: 'CommonNavbarNew',
props: {
bgColor: {
type: String,
default: ""
default: '',
},
title: {
type: String,
default: "暂无数据"
default: '暂无数据',
},
// 是否fix定位
isFixNavbar: {
type: Boolean,
default: true
default: true,
},
burialPoint: {
default: "",
type: String
default: '',
type: String,
},
backMethod: {
type: String,
default: "native" // inner native
default: 'native', // inner native
},
isShowShare: {
type: Boolean,
default: false
default: false,
},
isShowKf: {
type: Boolean,
default: false
default: false,
},
borderStyle: {
type: String,
default: "0px solid #e7e7e7"
default: '0px solid #e7e7e7',
},
isBlack: {
type: Boolean,
default: true
}
default: true,
},
},
data() {
return {
navbarHeight: 28,
contentHeight: 35,
fontSize: 37.5,
content: '',
shareImageUrl:
'https://file.yunqueyi.com/logo.png?version=' + new Date().getTime(),
isWeb: false,
};
},
computed: {
navHeight() {
if (this.isFixNavbar) {
return '54px';
} else {
return (this.navbarHeight + this.contentHeight) / this.fontSize + "rem";
return (this.navbarHeight + this.contentHeight) / this.fontSize + 'rem';
}
},
paddingTop() {
return this.navbarHeight / this.fontSize + "rem";
}
return this.navbarHeight / this.fontSize + 'rem';
},
},
created() {
if (process.client) {
......@@ -96,40 +133,39 @@ export default {
}
},
mounted() {
let htmlDom = document.getElementsByTagName("html")[0].style.fontSize;
const htmlDom = document.getElementsByTagName('html')[0].style.fontSize;
this.fontSize = htmlDom;
},
methods: {
//返回
// 返回
goBack() {
if(this.$rocNative.isWeb) {
if (this.$rocNative.isWeb) {
this.$router.back(-1);
} else {
this.$rocNative.goBack();
}
},
//分享
// 分享
goShare() {
let url = location.href,
_this = this;
rocNative.shareWechat({
this.$rocNative.shareWechat({
type: 6,
shareId: 0,
shareUrl: 'shareUrl',
title1: "this.shareTitle1",
title2: "this.shareTitle2",
shareImageUrl: "https://file.yunqueyi.com/logo.png?version=" + new Date().getTime()
title1: 'this.shareTitle1',
title2: 'this.shareTitle2',
shareImageUrl:
'https://file.yunqueyi.com/logo.png?version=' + new Date().getTime(),
});
},
goKf() {
goKfFn({
code: '0002'
})
}
}
code: '0002',
});
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.back {
position: absolute;
left: 0px;
......@@ -228,4 +264,4 @@ export default {
width: 20px;
}
}
</style>
\ No newline at end of file
</style>
<!-- 通用Navbar -->
<template>
<section :class="isFixNavbar ? 'nav-top fixed' : 'nav-top'" :style="'height:' + navHeight">
<section
:class="isFixNavbar ? 'nav-top fixed' : 'nav-top'"
:style="'height:' + navHeight"
>
<div
class="nav-part"
:style="'background:' + bgColor + ';'
+ 'padding-top:' + paddingTop + ';border-bottom:' + borderStyle"
:style="
'background:' +
bgColor +
';' +
'padding-top:' +
paddingTop +
';border-bottom:' +
borderStyle
"
>
<div class="nav-title">
<span class="nav-back" @click="goBack">
<img v-show="isBlack" src="../../assets/images/left-arrow-black.png" alt="">
<img v-show="!isBlack" src="../../assets/images/left-arrow-black.png" alt="">
<span
class="nav-back"
@click="goBack"
>
<img
v-show="isBlack"
src="../../assets/images/left-arrow-black.png"
alt=""
>
<img
v-show="!isBlack"
src="../../assets/images/left-arrow-black.png"
alt=""
>
</span>
<span class="nav-title-title" v-show="bgColor!=='none'">{{title}}</span>
<span v-show="isShowShare" class="nav-share" @click="goShare">
<span
v-show="bgColor !== 'none'"
class="nav-title-title"
>{{
title
}}</span>
<span
v-show="isShowShare"
class="nav-share"
@click="goShare"
>
<img
src="https://pica-pro.oss-cn-shanghai.aliyuncs.com/eagle_plan/courses/Group17_hover%403x.png"
>
</span>
<span v-show="isShowKf && !isWeb" class="nav-share" @click="goKf">
<img src="../../assets/images/kf.png" alt="">
<span
v-show="isShowKf && !isWeb"
class="nav-share"
@click="goKf"
>
<img
src="../../assets/images/kf.png"
alt=""
>
</span>
</div>
</div>
......@@ -27,68 +64,68 @@
<script>
import { goKfFn } from '@/utils/kf';
export default {
name: "common-navbar",
data() {
return {
navbarHeight: 28,
contentHeight: 35,
fontSize: 37.5,
content: "",
shareImageUrl:
"https://file.yunqueyi.com/logo.png?version=" + new Date().getTime(),
isWeb: false
};
},
name: 'CommonNavbar',
props: {
bgColor: {
type: String,
default: ""
default: '',
},
title: {
type: String,
default: "暂无数据"
default: '暂无数据',
},
// 是否fix定位
isFixNavbar: {
type: Boolean,
default: true
default: true,
},
burialPoint: {
default: "",
type: String
default: '',
type: String,
},
backMethod: {
type: String,
default: "native" // inner native
default: 'native', // inner native
},
isShowShare: {
type: Boolean,
default: false
default: false,
},
isShowKf: {
type: Boolean,
default: false
default: false,
},
borderStyle: {
type: String,
default: "0px solid #e7e7e7"
default: '0px solid #e7e7e7',
},
isBlack: {
type: Boolean,
default: true
}
default: true,
},
},
data() {
return {
navbarHeight: 28,
contentHeight: 35,
fontSize: 37.5,
content: '',
shareImageUrl:
'https://file.yunqueyi.com/logo.png?version=' + new Date().getTime(),
isWeb: false,
};
},
computed: {
navHeight() {
if (this.isFixNavbar) {
return '54px';
} else {
return (this.navbarHeight + this.contentHeight) / this.fontSize + "rem";
return (this.navbarHeight + this.contentHeight) / this.fontSize + 'rem';
}
},
paddingTop() {
return this.navbarHeight / this.fontSize + "rem";
}
return this.navbarHeight / this.fontSize + 'rem';
},
},
created() {
if (process.client) {
......@@ -96,29 +133,28 @@ export default {
}
},
mounted() {
let htmlDom = document.getElementsByTagName("html")[0].style.fontSize;
const htmlDom = document.getElementsByTagName('html')[0].style.fontSize;
this.fontSize = htmlDom;
},
methods: {
//返回
// 返回
goBack() {
if(this.$rocNative.isWeb) {
if (this.$rocNative.isWeb) {
this.$router.back(-1);
} else {
this.$rocNative.goBack();
}
},
//分享
// 分享
goShare() {
let url = location.href,
_this = this;
rocNative.shareWechat({
this.rocNative.shareWechat({
type: 6,
shareId: 0,
shareUrl: 'shareUrl',
title1: "this.shareTitle1",
title2: "this.shareTitle2",
shareImageUrl: "https://file.yunqueyi.com/logo.png?version=" + new Date().getTime()
title1: 'this.shareTitle1',
title2: 'this.shareTitle2',
shareImageUrl:
'https://file.yunqueyi.com/logo.png?version=' + new Date().getTime(),
});
},
goKf() {
......@@ -126,13 +162,13 @@ export default {
code: '0002',
type: 1,
contentType: 1,
contentName:this.title
})
}
}
}
contentName: this.title,
});
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.back {
position: absolute;
left: 0px;
......@@ -238,4 +274,4 @@ export default {
width: 20px;
}
}
</style>
\ No newline at end of file
</style>
<template>
<div class="common-loader loader--style3" title="2">
<div class="loader-mask"></div>
<template>
<div
class="common-loader loader--style3"
title="2"
>
<div class="loader-mask" />
<svg
version="1.1"
id="loader-1"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
x="0px"
......@@ -11,7 +14,7 @@
width="40"
height="40"
viewBox="0 0 60 60"
style="enable-background:new 0 0 80 80;"
style="enable-background: new 0 0 80 80"
xml:space="preserve"
>
<path
......@@ -32,7 +35,7 @@
</div>
</template>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-loader {
.loader-mask {
position: fixed;
......
<template>
<section class="no-more">
<span class="no-more-sub"></span>
<span class="no-more-text">{{noMoreText}}</span>
<span class="no-more-sub"></span>
<span class="no-more-sub" />
<span class="no-more-text">{{ noMoreText }}</span>
<span class="no-more-sub" />
</section>
</template>
<script>
export default {
data() {
return {
noMoreText: '到底啦'
}
}
}
return {
noMoreText: '到底啦',
};
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.no-more {
display: flex;
height: 62px;
......@@ -24,13 +24,13 @@ export default {
align-items: center;
&-sub {
width: 84px;
border: 1px solid #F7F7F7;
border: 1px solid #f7f7f7;
border-bottom: 0;
}
&-text {
padding: 0 8px;
font-size: 14px;
color: #BEC2CC;
color: #bec2cc;
}
}
</style>
<!-- Tabs组件 -->
<template>
<div class="common-show-all" @click.prevent="action">
<div
class="common-show-all"
@click.prevent="action"
>
<span>
查看全部
<img src="../../assets/images/right-arrow-grey.png"/>
<img src="../../assets/images/right-arrow-grey.png">
</span>
</div>
</template>
......@@ -12,22 +15,22 @@ export default {
props: {
title: {
type: String,
default: "2019基础高血压管理"
default: '2019基础高血压管理',
},
needRightBtn: {
type: Boolean,
default: true
}
default: true,
},
},
methods: {
action() {
this.$emit('action')
}
}
this.$emit('action');
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-show-all {
display: flex;
width: 100%;
......@@ -35,7 +38,6 @@ export default {
line-height: 14px;
margin: 20px 0;
text-align: center;
font-weight: 17px;
span {
flex: 1;
display: inline-block;
......
......@@ -2,25 +2,25 @@
<template>
<div
class="common-split-line"
:style="{'height': height, 'background-color': bgColor}"
></div>
:style="{ height: height, 'background-color': bgColor }"
/>
</template>
<script>
export default {
props: {
height: {
type: String,
default: '6px'
},
default: '6px',
},
bgColor: {
type: String,
default: '#F8F9FA'
}
}
}
default: '#F8F9FA',
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-split-line {
margin: 20px 0;
}
......
......@@ -4,125 +4,142 @@
<article class="middle-warp">
<div class="middle-item">
<div class="title">
<img src="../../assets/images/what-icon-title.png" />
<img src="../../assets/images/what-icon-title.png">
<span>完成率</span>
</div>
<div class="content">
<div class="box">
<div class="top">
<div >
<div>
<div class="text">
<span>{{certFlag ? '获证率' : '项目完成率'}}</span>
<img class="what" @click="tipsClick" src="../../assets/images/what.png" alt="">
<span>{{ certFlag ? '获证率' : '项目完成率' }}</span>
<img
class="what"
src="../../assets/images/what.png"
alt=""
@click="tipsClick"
>
</div>
<div class="proportion">
{{ percentData.certificateRate | fixedNum }}%
</div>
<div class="proportion">{{percentData.certificateRate | fixedNum}}%</div>
</div>
<img src="../../assets/images/what-content-2.png" alt="">
<img
src="../../assets/images/what-content-2.png"
alt=""
>
</div>
<div class="bottom">
应参与人数 {{percentData.doctorCount | formatNum}}
应参与人数 {{ percentData.doctorCount | formatNum }}
</div>
</div>
<div class="box">
<div class="top">
<div>
<div class="text">
<span>参与完成率</span>
<img class="what" @click="tipsClick2" src="../../assets/images/what.png" alt="">
<span>参与完成率</span>
<img
class="what"
src="../../assets/images/what.png"
alt=""
@click="tipsClick2"
>
</div>
<div class="proportion">
{{ shouldDate | fixedNum }}%
</div>
<div class="proportion">{{ shouldDate | fixedNum}}%</div>
</div>
<img src="../../assets/images/what-content-1.png" alt="">
<img
src="../../assets/images/what-content-1.png"
alt=""
>
</div>
<div class="bottom">
已参与人数 {{percentData.joinCount | formatNum}}
已参与人数 {{ percentData.joinCount | formatNum }}
</div>
</div>
</div>
</div>
<div class="footer">
已完成人数 {{percentData.finishCount | formatNum}}
已完成人数 {{ percentData.finishCount | formatNum }}
</div>
</article>
<!-- <article class="middle-warp">
<div class="middle">
<div class="title">
<span class="ratio">{{certFlag ? '获证率' : '项目完成率'}}
<img @click="tipsClick" :class="{'top-10': isAndroid}" src="../../assets/images/what-icon-2.png" />
</span>
<span>
<img src="../../assets/images/tips-1.png" />
</span>
</div>
<div class="ratio">
<span>{{percentData.certificateRate | fixedNum}}%</span>
</div>
<div class="statics">
<span>{{certFlag ? '已获证人数' : '已完成人数'}} {{percentData.finishCount | formatNum}}</span>
<span>应参与人数 {{percentData.doctorCount | formatNum}}</span>
</div>
</div>
<div class="middle">
<div class="title">
<span class="ratio">{{ '参与完成率'}}
<img @click="tipsClick2" :class="{'top-10': isAndroid}" src="../../assets/images/what-icon-2.png" />
</span>
<span>
<img src="../../assets/images/tips-1.png" />
</span>
</div>
<div class="ratio">
<span>{{ shouldDate | fixedNum}}%</span>
</div>
<div class="statics">
<span>已完成人数 {{percentData.finishCount | formatNum}}</span>
<span>已参与人数 {{percentData.joinCount | formatNum}}</span>
</div>
</div>
</article> -->
<article v-show="isSingleOrg" class="middle-org">
<article
v-show="isSingleOrg"
class="middle-org"
>
<div class="title">
<span>人员参与率</span>
<span>
<img src="../../assets/images/tips-2.png" />
<img src="../../assets/images/tips-2.png">
</span>
</div>
<div class="ratio">
<span>{{percentData.doctorRate | fixedNum}}%</span>
<span>{{ percentData.doctorRate | fixedNum }}%</span>
</div>
<div class="statics">
<span class="grey">已参与人数 {{percentData.joinCount | formatNum}}</span>
<span class="grey">应参与人数 {{percentData.doctorCount | formatNum}}</span>
<span
class="grey"
>已参与人数 {{ percentData.joinCount | formatNum }}</span>
<span
class="grey"
>应参与人数 {{ percentData.doctorCount | formatNum }}</span>
</div>
</article>
<article v-show="!isSingleOrg" class="mini">
<article
v-show="!isSingleOrg"
class="mini"
>
<div class="item">
<div class="wrapper">
<span>
<div class="desc">人员参与率</div>
<div class="ratio">{{percentData.doctorRate | fixedNum}}%</div>
<div class="ratio">{{ percentData.doctorRate | fixedNum }}%</div>
</span>
<img src="../../assets/images/tips-2.png" />
<img src="../../assets/images/tips-2.png">
</div>
<span class="desc-num">已参与人数 {{percentData.joinCount | formatNum}}</span>
<span class="desc-num">应参与人数 {{percentData.doctorCount | formatNum}}</span>
<span
class="desc-num"
>已参与人数 {{ percentData.joinCount | formatNum }}</span>
<span
class="desc-num"
>应参与人数 {{ percentData.doctorCount | formatNum }}</span>
</div>
<div class="item">
<div class="wrapper">
<span>
<div class="desc">机构参与率</div>
<div class="ratio">{{percentData.hospitalRate | fixedNum}}%</div>
<div class="ratio">{{ percentData.hospitalRate | fixedNum }}%</div>
</span>
<img src="../../assets/images/tips-3.png" />
<img src="../../assets/images/tips-3.png">
</div>
<span class="desc-num">已参与机构数 {{percentData.hospitalJoinCount | formatNum}}</span>
<span class="desc-num">应参与机构数 {{percentData.hospitalCount | formatNum}}</span>
<span
class="desc-num"
>已参与机构数 {{ percentData.hospitalJoinCount | formatNum }}</span>
<span
class="desc-num"
>应参与机构数 {{ percentData.hospitalCount | formatNum }}</span>
</div>
</article>
</section>
</template>
<script>
export default {
filters: {
formatNum(num) {
var str = (num || 0) + '';
return str
.split('')
.reverse()
.reduce((prev, next, index) => {
return (index % 3 ? next : next + ',') + prev;
});
},
fixedNum(num, fixed = 1) {
if (!num) return 0;
return (num * 100).toFixed(fixed);
},
},
props: {
percentData: {
type: Object,
......@@ -135,71 +152,61 @@ export default {
hospitalJoinCount: 0,
certificateRate: 0,
doctorRate: 0,
hospitalRate: 0
hospitalRate: 0,
};
}
},
},
isSingleOrg: {
type: Boolean,
default: false
default: false,
},
certFlag: {
type: Number | String,
default: 0
}
type: Number,
default: 0,
},
},
data() {
return {
isAndroid: false
}
isAndroid: false,
};
},
computed:{
shouldDate(){
return this.percentData.joinCount ? this.percentData.finishCount/this.percentData.joinCount : 0;
}
computed: {
shouldDate() {
return this.percentData.joinCount
? this.percentData.finishCount / this.percentData.joinCount
: 0;
},
},
watch: {
percentData: {
handler(newValue, oldValue) {
handler(newValue) {
return newValue;
},
deep: true
}
},
filters: {
formatNum(num) {
var str = (num || 0) + '' ;
return str.split("").reverse().reduce((prev, next, index) => {
return ((index % 3) ? next : (next + ',')) + prev;
})
deep: true,
},
fixedNum(num, fixed = 1) {
if(!num) return 0;
return (num * 100).toFixed(fixed)
}
},
created() {
if(process.client) {
if (process.client) {
this.isAndroid = this.$rocNative.isAndroid;
}
},
methods: {
tipsClick() {
let tipsContent = '是已完成人数/应参与人数*100%';
if(this.certFlag) {
tipsContent = '是已获证人数/应参与人数*100%'
if (this.certFlag) {
tipsContent = '是已获证人数/应参与人数*100%';
}
this.$emit('tipsClick', tipsContent)
this.$emit('tipsClick', tipsContent);
},
tipsClick2() {
const tipsContent = '是已完成人数/已参与人数*100%';
this.$emit('tipsClick', tipsContent)
}
}
this.$emit('tipsClick', tipsContent);
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-swiper-item {
font-size: 20px;
margin-top: 20px;
......@@ -262,62 +269,62 @@ export default {
}
}
}
.middle-warp{
.middle-warp {
font-size: 14px;
color: #fff;
background: linear-gradient(136deg, #2FC6BA 0%, #36B6BF 100%);
background: linear-gradient(136deg, #2fc6ba 0%, #36b6bf 100%);
box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.08);
border-radius: 8px;
margin: 0 15px;
padding: 16px 12px;
.middle-item{
.middle-item {
margin-bottom: 12px;
.title{
.title {
display: flex;
justify-content: normal;
align-items: center;
margin-bottom: 9px;
img{
img {
width: 19px;
height: 19px;
margin-right: 4px;
}
}
.content{
.content {
display: flex;
color: #626262;
.box{
.box {
font-size: 12px;
background: #FEFFFE;
background: #fefffe;
border-radius: 8px;
padding: 16px 14px;
width: 50%;
&:first-child{
margin-right: 11px;
&:first-child {
margin-right: 11px;
}
.proportion{
.proportion {
font-size: 20px;
font-weight: 600;
color: #439284;
margin-bottom: 18px;
margin-top: 10px;
}
.top{
.top {
display: flex;
justify-content: space-between;
.text{
.text {
display: flex;
align-items: center;
}
}
.bottom{
color: #9A9A9C;
.bottom {
color: #9a9a9c;
}
img{
img {
width: 30px;
height: 30px;
}
.what{
.what {
width: 12px;
height: 12px;
margin-left: 4px;
......@@ -325,13 +332,13 @@ export default {
}
}
}
.footer{
background: #FEFFFE;
border-radius: 8px;
padding: 11px 13px;
color: #9A9A9C;
font-size: 12px;
}
.footer {
background: #fefffe;
border-radius: 8px;
padding: 11px 13px;
color: #9a9a9c;
font-size: 12px;
}
}
.middle-org {
display: block;
......@@ -341,9 +348,9 @@ export default {
height: 98px;
margin-top: 10px;
padding: 15px;
box-shadow:0px 5px 15px 0px rgba(0,0,0,0.04);
box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.04);
border-radius: 6px;
border: 1px solid rgba(231,232,233,1);
border: 1px solid rgba(231, 232, 233, 1);
.ratio {
height: 21px;
line-height: 21px;
......
<!-- Tabs组件 -->
<template>
<div class="common-tabs-wrapper" :class="{'fixed': needFixed}">
<div class="sub-wrapper" :class="{'fixed': needFixed}">
<ul class="common-tabs" id="tabsWrapperId">
<li :id="'tabsItem' + index"
v-show="(item === '总体概况'
|| item === '人群分析'
|| item === '课程分析' && projectInfo.existCourse === 1)
|| (item === '考试分析' && projectInfo.existExam === 1)
|| (item === '学习效果分析' && projectInfo.existEffect === 1)"
<div
class="common-tabs-wrapper"
:class="{ fixed: needFixed }"
>
<div
class="sub-wrapper"
:class="{ fixed: needFixed }"
>
<ul
id="tabsWrapperId"
class="common-tabs"
>
<li
v-for="(item, index) in tapList"
:class="{'active': index === cIndex}"
v-show="
item === '总体概况' ||
item === '人群分析' ||
(item === '课程分析' && projectInfo.existCourse === 1) ||
(item === '考试分析' && projectInfo.existExam === 1) ||
(item === '学习效果分析' && projectInfo.existEffect === 1)
"
:id="'tabsItem' + index"
:key="index"
:class="{ active: index === cIndex }"
@click="clickTab(index)"
>{{item}}</li>
>
{{ item }}
</li>
</ul>
<!-- <span class="over"></span> -->
<span class="border"></span>
</div>
<span class="border" />
</div>
</div>
</template>
<script>
let scrollDom = [], maxScrollWidth = 375;
export default {
data() {
return {
cIndex: 0,
tapList: [
"总体概况",
"人群分析",
"课程分析",
"考试分析",
"学习效果分析"
]
};
},
props: {
projectInfo: {
type: Object
type: Object,
default: () => {},
},
needFixed: {
type: Boolean,
default: false
}
default: false,
},
},
mounted() {
data() {
return {
cIndex: 0,
tapList: ['总体概况', '人群分析', '课程分析', '考试分析', '学习效果分析'],
};
},
mounted() {},
methods: {
clickTab(index) {
this.cIndex = index;
this.$emit("tabClicked", index);
this.$emit('tabClicked', index);
// this.scrollTabs(index);
},
}
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-tabs-wrapper {
.sub-wrapper {
display: flex;
......@@ -66,7 +73,7 @@ export default {
top: 0;
left: 0;
z-index: 1;
font-size: 13px;
font-size: 13px;
width: 100%;
white-space: nowrap;
&.fixed {
......@@ -109,7 +116,7 @@ export default {
border-radius: 30px;
&:first-child {
margin-left: 15px;
}
}
&:last-child {
margin-right: 15px;
}
......
......@@ -2,7 +2,9 @@
<template>
<div class="common-title-wrapper">
<ul class="mini">
<li class="left">{{title}}</li>
<li class="left">
{{ title }}
</li>
</ul>
</div>
</template>
......@@ -11,13 +13,13 @@ export default {
props: {
title: {
type: String,
default: "证书分布情况"
}
}
default: '证书分布情况',
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-title-wrapper {
position: fixed;
width: 100%;
......
......@@ -2,9 +2,17 @@
<template>
<div class="common-title-wb-wrapper">
<ul class="mini">
<li class="left">{{title}}</li>
<li class="left">
{{ title }}
</li>
<li class="right">
<span @click="btnClick(0)" :class="{'active': cIndex === 0}">参与</span><span @click="btnClick(1)" :class="{'active': cIndex === 1}">完成</span>
<span
:class="{ active: cIndex === 0 }"
@click="btnClick(0)"
>参与</span><span
:class="{ active: cIndex === 1 }"
@click="btnClick(1)"
>完成</span>
</li>
</ul>
</div>
......@@ -14,28 +22,28 @@ export default {
props: {
title: {
type: String,
default: "证书分布情况"
default: '证书分布情况',
},
needRightBtn: {
type: Boolean,
default: false
}
default: false,
},
},
data() {
return {
cIndex: 0
cIndex: 0,
};
},
methods: {
btnClick(index) {
this.cIndex = index;
this.$emit('btnClick', index);
}
}
},
},
};
</script>
<style lang="less">
<style lang="scss">
.common-title-wb-wrapper {
height: 44px;
line-height: 44px;
......@@ -70,10 +78,10 @@ export default {
font-weight: 700;
color: #979899;
padding: 8px 15px;
background: #F8F9FA;
background: #f8f9fa;
&.active {
color: #449284;
background: #E3EFED;
background: #e3efed;
}
&:nth-child(1) {
border-radius: 5px 0 0 5px;
......
<!-- 标题组件 - 带下拉选择 -->
<template>
<div class="common-title-wd-wrapper">
<div v-show="isShowDropdown" class="mask" @click="isShowDropdown = !isShowDropdown"></div>
<div
v-show="isShowDropdown"
class="mask"
@click="isShowDropdown = !isShowDropdown"
/>
<ul class="mini">
<li class="left">{{title}}</li>
<li class="right" v-if="needRightBtn" @click="isShowDropdown = !isShowDropdown">
<span>{{cDesc || (dataList[0] && dataList[0].desc)}}</span>
<img src="../../assets/images/arr-down.png" alt />
<li class="left">
{{ title }}
</li>
<li
v-if="needRightBtn"
class="right"
@click="isShowDropdown = !isShowDropdown"
>
<span>{{ cDesc || (dataList[0] && dataList[0].desc) }}</span>
<img
src="../../assets/images/arr-down.png"
alt
>
</li>
</ul>
<ul v-show="isShowDropdown" class="dropdown-menu">
<li v-for="(item, index) in dataList" :key="index" @click="selectSortItem(index)">
<span :class="{'active': cIndex === index }">{{item.desc}}</span>
<img v-show="cIndex === index" src="../../assets/images/sort-select-icon.png" alt="">
<ul
v-show="isShowDropdown"
class="dropdown-menu"
>
<li
v-for="(item, index) in dataList"
:key="index"
@click="selectSortItem(index)"
>
<span :class="{ active: cIndex === index }">{{ item.desc }}</span>
<img
v-show="cIndex === index"
src="../../assets/images/sort-select-icon.png"
alt=""
>
</li>
</ul>
</div>
......@@ -22,23 +46,23 @@ export default {
props: {
title: {
type: String,
default: "共0条数据"
default: '共0条数据',
},
needRightBtn: {
type: Boolean,
default: false
default: false,
},
dataList: {
type: Array,
default: () => []
}
default: () => [],
},
},
data() {
return {
isShowDropdown: false,
cIndex: 0,
cDesc: '',
cType: 1
cType: 1,
};
},
......@@ -49,12 +73,12 @@ export default {
this.cDesc = this.dataList[index].desc;
this.cType = this.dataList[index].type;
this.$emit('selectSortItem', this.cType);
}
}
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-title-wd-wrapper {
position: fixed;
width: 100%;
......@@ -124,7 +148,7 @@ export default {
line-height: 56px;
font-size: 14px;
color: #676869;
border-bottom: 1px solid #F0F1F2;
border-bottom: 1px solid #f0f1f2;
img {
line-height: 56px;
width: 12px;
......
<!-- 标题组件 -->
<template>
<ul class="common-title-with-what">
<li class="left">{{title}}<img @click="tipsClick" src="../../assets/images/what-icon-1.png" /></li>
<li class="left">
{{ title
}}<img
src="../../assets/images/what-icon-1.png"
@click="tipsClick"
>
</li>
</ul>
</template>
<script>
......@@ -9,22 +15,22 @@ export default {
props: {
title: {
type: String,
default: "证书分布情况"
default: '证书分布情况',
},
needRightBtn: {
type: Boolean,
default: false
}
default: false,
},
},
methods: {
tipsClick() {
this.$emit('tipsClick')
}
}
this.$emit('tipsClick');
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-title-with-what {
font-size: 18px;
margin: 30px 15px 20px;
......
<!-- 标题组件 -->
<template>
<ul class="common-title">
<li class="left">{{title}}</li>
<li v-if="needRightBtn"></li>
<li class="left">
{{ title }}
</li>
<li v-if="needRightBtn" />
</ul>
</template>
<script>
......@@ -10,18 +12,18 @@ export default {
props: {
title: {
type: String,
default: "证书分布情况"
default: '证书分布情况',
},
needRightBtn: {
type: Boolean,
default: false
}
default: false,
},
},
methods: {}
methods: {},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-title {
margin: 30px 15px 20px;
li {
......
<!-- 选择地区组件 -->
<template>
<div class="select-wrapper" @touchmove.prevent.stop>
<div class="mask" @click="cancelSelect" @touchmove.prevent.stop>
<div class="address-wrap" @click.stop @touchmove.prevent.stop>
<div
class="select-wrapper"
@touchmove.prevent.stop
>
<div
class="mask"
@click="cancelSelect"
@touchmove.prevent.stop
>
<div
class="address-wrap"
@click.stop
@touchmove.prevent.stop
>
<div class="tip-header">
<span class="cancel-btn" @click="cancelSelect">取消</span>
<span
class="cancel-btn"
@click="cancelSelect"
>取消</span>
<h3>选择地区</h3>
<button class="submit-btn" @click="confirm">确定</button>
<button
class="submit-btn"
@click="confirm"
>
确定
</button>
<!-- <button :disabled="isDisabled" class="submit-btn" @click="confirm">确定</button> -->
</div>
<div class="my-org" v-show="areaList.currentOrgList.length">
<div
v-show="areaList.currentOrgList.length"
class="my-org"
>
<span>我所在机构</span>
<ul>
<li
class="list"
v-for="(provinceItem, index) in areaList.currentOrgList"
:key="index"
:class="{ active: provinceItem.selected }"
@click="provinceSelect(provinceItem, index, true)"
>
<span>{{ provinceItem.label }}</span>
<span v-show="provinceItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
<li
v-for="(provinceItem, index) in areaList.currentOrgList"
:key="index"
class="list"
:class="{ active: provinceItem.selected }"
@click="provinceSelect(provinceItem, index, true)"
>
<span>{{ provinceItem.label }}</span>
<span v-show="provinceItem.selected">
<img src="../../assets/images/sort-select-icon.png">
</span>
</li>
</ul>
</div>
<div class="address-select">
<ul class="show-address-header">
<li :class="{ active: isShowProvince }" class="item" @click="tabAddressClick(1)">
{{
value.provinceName
? value.provinceName
: '请选择'
}}
<li
:class="{ active: isShowProvince }"
class="item"
@click="tabAddressClick(1)"
>
{{ value.provinceName ? value.provinceName : '请选择' }}
</li>
<li
v-show="value.provinceName && value.provinceName != '全部' && rank > 1 && areaList.cityList.length"
v-show="
value.provinceName &&
value.provinceName != '全部' &&
rank > 1 &&
areaList.cityList.length
"
:class="{ active: isShowCity }"
class="item"
@click="tabAddressClick(2)"
>{{ value.cityName ? value.cityName : '请选择' }}</li>
>
{{ value.cityName ? value.cityName : '请选择' }}
</li>
<li
v-show="value.cityName && rank > 2 && areaList.countyList.length"
:class="{ active: isShowCounty }"
class="item"
@click="tabAddressClick(3)"
>
{{
value.countyName ? value.countyName : '请选择'
}}
{{ value.countyName ? value.countyName : '请选择' }}
</li>
<li
v-show="value.countyName && rank > 3 && areaList.townList.length"
:class="{ active: isShowTown }"
class="item"
@click="tabAddressClick(4)"
>{{ value.townName ? value.townName : '请选择' }}</li>
>
{{ value.townName ? value.townName : '请选择' }}
</li>
<li
v-show="value.townName && rank > 4 && areaList.newOrgList.length"
:class="{ active: isShowOrg }"
class="item"
@click="tabAddressClick(5)"
>{{ value.newOrgName ? value.newOrgName : '请选择' }}</li>
>
{{ value.newOrgName ? value.newOrgName : '请选择' }}
</li>
</ul>
<div class="address-content" @touchmove.stop>
<ul v-show="isShowProvince" id="province">
<div
class="address-content"
@touchmove.stop
>
<ul
v-show="isShowProvince"
id="province"
>
<li
v-for="(provinceItem, index) in areaList.provinceList"
:key="index"
......@@ -74,11 +111,14 @@
>
<span>{{ provinceItem.label }}</span>
<span v-show="provinceItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
<img src="../../assets/images/sort-select-icon.png">
</span>
</li>
</ul>
<ul v-show="isShowCity" id="city">
<ul
v-show="isShowCity"
id="city"
>
<li
v-for="(cityItem, index) in areaList.cityList"
:key="index"
......@@ -87,11 +127,14 @@
>
<span>{{ cityItem.label }}</span>
<span v-show="cityItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
<img src="../../assets/images/sort-select-icon.png">
</span>
</li>
</ul>
<ul v-show="isShowCounty" id="county">
<ul
v-show="isShowCounty"
id="county"
>
<li
v-for="(countyItem, index) in areaList.countyList"
:key="index"
......@@ -100,11 +143,14 @@
>
<span>{{ countyItem.label }}</span>
<span v-show="countyItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
<img src="../../assets/images/sort-select-icon.png">
</span>
</li>
</ul>
<ul v-show="isShowTown" id="town">
<ul
v-show="isShowTown"
id="town"
>
<li
v-for="(townItem, index) in areaList.townList"
:key="index"
......@@ -113,11 +159,14 @@
>
<span>{{ townItem.label }}</span>
<span v-show="townItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
<img src="../../assets/images/sort-select-icon.png">
</span>
</li>
</ul>
<ul v-show="isShowOrg" id="org">
<ul
v-show="isShowOrg"
id="org"
>
<li
v-for="(orgItem, index) in areaList.newOrgList"
:key="index"
......@@ -126,7 +175,7 @@
>
<span>{{ orgItem.label }}</span>
<span v-show="orgItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
<img src="../../assets/images/sort-select-icon.png">
</span>
</li>
</ul>
......@@ -137,11 +186,21 @@
</div>
</template>
<script>
import { mapGetters, mapActions } from "vuex";
import { getAreaOrOrgList } from "../../service";
import { mapGetters, mapActions } from 'vuex';
import { getAreaOrOrgList } from '../../service';
export default {
name: "PicaArea",
name: 'PicaArea',
props: {
baseUrl: {
type: String,
default: '',
},
rank: {
type: Number,
default: 5,
},
},
data() {
return {
areaList: {
......@@ -150,20 +209,20 @@ export default {
cityList: [],
countyList: [],
townList: [],
newOrgList: []
newOrgList: [],
},
value: {
cityId: "",
cityName: "",
countyId: "",
countyName: "",
provinceId: "",
provinceName: "",
townId: "",
townName: "",
newOrgId: "",
newOrgName: "",
regionId: "",
cityId: '',
cityName: '',
countyId: '',
countyName: '',
provinceId: '',
provinceName: '',
townId: '',
townName: '',
newOrgId: '',
newOrgName: '',
regionId: '',
areaDegree: 0,
},
isDisabled: true,
......@@ -175,42 +234,22 @@ export default {
// 区域选择通用接口参数
queryParams: {
projectId: 374,
regionId: ""
regionId: '',
},
currentOrgList: []
currentOrgList: [],
};
},
props: {
baseUrl: {
type: String,
default: ""
},
rank: {
type: Number | String,
default: 5
}
},
created() {
if (process.client) {
if (this.$route && this.$route.query) {
let cQuery = this.$route.query;
let hospitalIdList = cQuery.hospitalIdList || "";
this.queryParams.projectId = cQuery.projectId || "";
}
}
},
computed: {
...mapGetters({
projectId: "projectId",
provinceList: "provinceList"
})
projectId: 'projectId',
provinceList: 'provinceList',
}),
},
watch: {
projectId(newVal) {
this.queryParams.projectId = newVal;
},
provinceList(newVal) {
newVal[0].selected = true;
this.value.provinceName = newVal[0].label;
this.value.areaDegree = newVal[0].degree;
......@@ -226,7 +265,7 @@ export default {
// this.value.areaDegree = this.areaList.provinceList[0].degree;
// 包含所在机构
if(newVal[0].containHospitalFlag == 1) {
if (newVal[0].containHospitalFlag == 1) {
// this.value.provinceName = newVal[1].label;
// this.value.provinceName = '请选择';
this.areaList.currentOrgList = newVal.slice(0, 1);
......@@ -236,21 +275,29 @@ export default {
this.areaList.provinceList = newVal;
}
// this.value.provinceName = "全部";
},
},
created() {
if (process.client) {
if (this.$route && this.$route.query) {
const cQuery = this.$route.query;
this.queryParams.projectId = cQuery.projectId || '';
}
}
},
mounted() {},
methods: {
// 映射Store中的Actions
...mapActions({
setOrgList: "setOrgList",
setOrgList: 'setOrgList',
}),
// 获取省列表
async getProvinceData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
await getAreaOrOrgList(params).then((res) => {
if (res.code === '000000') {
this.areaList.provinceList = (res.data && res.data.list) || [];
this.areaList.provinceList.map(a => {
this.areaList.provinceList.map((a) => {
if (a.id == this.value.provinceId) {
a.selected = true;
}
......@@ -261,15 +308,15 @@ export default {
// 获取城市列表
async getCityData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
await getAreaOrOrgList(params).then((res) => {
if (res.code === '000000') {
this.areaList.cityList = (res.data && res.data.list) || [];
if (this.areaList.cityList.length === 0) {
this.isShowProvince = true;
this.isShowCity = false;
this.isDisabled = false;
}
this.areaList.cityList.map(a => {
this.areaList.cityList.map((a) => {
if (a.id == this.value.cityId) {
a.selected = true;
}
......@@ -280,8 +327,8 @@ export default {
// 获取区/县列表
async getCountyData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
await getAreaOrOrgList(params).then((res) => {
if (res.code === '000000') {
this.areaList.countyList = (res.data && res.data.list) || [];
if (this.areaList.countyList.length === 0) {
this.isShowProvince = false;
......@@ -289,7 +336,7 @@ export default {
this.isShowCounty = false;
this.isDisabled = false;
}
this.areaList.countyList.map(a => {
this.areaList.countyList.map((a) => {
if (a.id == this.value.countyId) {
a.selected = true;
}
......@@ -300,8 +347,8 @@ export default {
// 获取乡/镇列表
async getTownData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
await getAreaOrOrgList(params).then((res) => {
if (res.code === '000000') {
this.areaList.townList = (res.data && res.data.list) || [];
if (this.areaList.townList.length === 0) {
this.isShowProvince = false;
......@@ -310,7 +357,7 @@ export default {
this.isShowTown = false;
this.isDisabled = false;
}
this.areaList.townList.map(a => {
this.areaList.townList.map((a) => {
if (a.id == this.value.townId) {
a.selected = true;
}
......@@ -321,8 +368,8 @@ export default {
// 获取最后一级的机构列表
async getOrgData(params) {
await getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
await getAreaOrOrgList(params).then((res) => {
if (res.code === '000000') {
this.areaList.newOrgList = (res.data && res.data.list) || [];
if (this.areaList.newOrgList.length === 0) {
this.isShowProvince = false;
......@@ -332,7 +379,7 @@ export default {
this.isShowOrg = false;
this.isDisabled = false;
}
this.areaList.newOrgList.map(a => {
this.areaList.newOrgList.map((a) => {
if (a.id == this.value.townId) {
a.selected = true;
}
......@@ -348,20 +395,20 @@ export default {
this.queryParams.regionId = item.id;
this.value.provinceName = item.label;
this.value.cityId = null;
this.value.cityName = "";
this.value.cityName = '';
this.value.countyId = null;
this.value.countyName = "";
this.value.countyName = '';
this.value.townId = null;
this.value.townName = "";
this.value.townName = '';
this.value.newOrgId = null;
this.value.newOrgName = ""
this.value.newOrgName = '';
// 当前选中的样式
this.areaList.provinceList.map(a => (a.selected = false));
if(isCurrent) {
this.areaList.currentOrgList.map(a => (a.selected = true));
this.areaList.provinceList.map((a) => (a.selected = false));
if (isCurrent) {
this.areaList.currentOrgList.map((a) => (a.selected = true));
} else {
this.areaList.currentOrgList.map(a => (a.selected = false));
this.areaList.currentOrgList.map((a) => (a.selected = false));
this.areaList.provinceList[idx].selected = true;
}
// this.areaList.provinceList.map(a => (a.selected = false));
......@@ -370,8 +417,8 @@ export default {
if (item.degree == 0) {
return;
}
//控制省市县乡数据展示与隐藏
// 控制省市县乡数据展示与隐藏
this.isShowProvince = false;
this.isShowCounty = false;
this.isShowTown = false;
......@@ -397,13 +444,13 @@ export default {
this.queryParams.regionId = item.id;
this.value.cityName = item.label;
this.value.countyId = null;
this.value.countyName = "";
this.value.countyName = '';
this.value.townId = null;
this.value.townName = "";
this.value.townName = '';
this.value.newOrgId = null;
this.value.newOrgName = ""
this.value.newOrgName = '';
// 当前选中的样式
this.areaList.cityList.map(a => (a.selected = false));
this.areaList.cityList.map((a) => (a.selected = false));
this.areaList.cityList[idx].selected = true;
this.value.areaDegree = item.degree;
if (item.degree == 0) {
......@@ -436,11 +483,11 @@ export default {
this.queryParams.regionId = item.id;
this.value.countyName = item.label;
this.value.townId = null;
this.value.townName = "";
this.value.townName = '';
this.value.newOrgId = null;
this.value.newOrgName = ""
this.value.newOrgName = '';
// 当前选中的样式
this.areaList.countyList.map(a => (a.selected = false));
this.areaList.countyList.map((a) => (a.selected = false));
this.areaList.countyList[idx].selected = true;
this.value.areaDegree = item.degree;
if (item.degree == 0) {
......@@ -473,14 +520,14 @@ export default {
this.queryParams.regionId = item.id;
this.value.townName = item.label;
this.value.newOrgId = null;
this.value.newOrgName = ""
this.value.newOrgName = '';
this.value.areaDegree = item.degree;
if (item.degree == 0) {
return;
}
// 当前选中的样式
this.areaList.townList.map(a => (a.selected = false));
this.areaList.townList.map((a) => (a.selected = false));
this.areaList.townList[idx].selected = true;
this.isDisabled = false;
if (this.rank > 4 && item.degree != 5) {
......@@ -495,7 +542,7 @@ export default {
this.isShowTown = true;
this.isDisabled = false;
this.areaList.newOrgList = [];
}
}
},
// 选择最后一级机构
......@@ -510,10 +557,9 @@ export default {
}
// 当前选中的样式
this.areaList.newOrgList.map(a => (a.selected = false));
this.areaList.newOrgList.map((a) => (a.selected = false));
this.areaList.newOrgList[idx].selected = true;
this.isDisabled = false;
},
tabAddressClick(tab) {
......@@ -550,214 +596,215 @@ export default {
}
},
confirm() {
this.$emit("confirm", this.value);
this.$emit('confirm', this.value);
},
cancelSelect() {
this.$emit("cancel", false);
}
}
this.$emit('cancel', false);
},
},
};
</script>
<style lang="less" scoped>
.select-wrapper {
font-family: PingFangSC-Regular;
.mask {
position: fixed;
z-index: 1000000015;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(55, 56, 57, 0.6);
}
<style lang="scss" scoped>
.select-wrapper {
font-family: PingFangSC-Regular;
.mask {
position: fixed;
z-index: 1000000015;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(55, 56, 57, 0.6);
}
.address-wrap {
position: absolute;
.address-wrap {
position: absolute;
width: 100%;
// height: 353px;
// height: 293px;
background-color: #ffffff;
box-sizing: border-box;
bottom: 0;
left: 0;
right: 0;
z-index: 1000000016;
.tip-header {
position: relative;
height: 58px;
line-height: 58px;
width: 100%;
// height: 353px;
// height: 293px;
background-color: #ffffff;
font-size: 17px;
display: flex;
justify-content: space-between;
padding: 0 15px;
box-sizing: border-box;
bottom: 0;
left: 0;
right: 0;
z-index: 1000000016;
.tip-header {
position: relative;
height: 58px;
line-height: 58px;
width: 100%;
.cancel-btn {
color: #999;
}
h3 {
font-size: 18px;
color: #373839;
font-weight: 400;
}
.submit-btn {
font-size: 17px;
display: flex;
justify-content: space-between;
padding: 0 15px;
box-sizing: border-box;
outline: none;
border: 1px solid transparent;
background-color: transparent;
color: #449284 !important;
.cancel-btn {
color: #999;
&:disabled {
color: #c7c8c9;
}
}
}
.address-select {
width: 100%;
height: auto;
/*height: 196px;*/
box-sizing: border-box;
h3 {
font-size: 18px;
color: #373839;
font-weight: 400;
.show-address-header {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
position: relative;
padding-bottom: 4px;
margin: 0 7px;
&:after {
content: ' ';
position: absolute;
left: 0;
bottom: 0;
right: 0;
height: 1px;
border-bottom: 1px solid #f0f1f2;
color: #f0f1f2;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.submit-btn {
font-size: 17px;
outline: none;
border: 1px solid transparent;
background-color: transparent;
color: #449284 !important;
.item {
display: inline-block;
font-size: 15px;
line-height: 35px;
height: 35px;
padding: 0 8px;
// padding-right: 15px;
box-sizing: border-box;
max-width: 23%;
min-width: 50px;
text-align: left;
color: #676869;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
// flex: 1 0 auto;
&:last-of-type {
padding-right: 15px;
}
&.active {
color: #373839;
font-family: PingFangSC-Medium;
/*font-weight:500;*/
}
&:disabled {
color: #c7c8c9;
&.active:after {
content: ' ';
position: absolute;
left: 50%;
bottom: 0;
right: 0;
width: 10px;
height: 3px;
/*border-radius: 2px;*/
border-radius: 30%;
text-align: center;
background-color: #449284;
transform: translateX(-50%);
}
}
}
.address-select {
.address-content {
position: relative;
width: 100%;
height: auto;
/*height: 196px;*/
// height: 100%;
height: 196px;
overflow: hidden;
box-sizing: border-box;
.show-address-header {
ul {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
position: relative;
padding-bottom: 4px;
margin: 0 7px;
&:after {
content: " ";
position: absolute;
left: 0;
bottom: 0;
right: 0;
height: 1px;
border-bottom: 1px solid #f0f1f2;
color: #f0f1f2;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
height: 196px;
overflow-y: auto;
box-sizing: border-box;
padding: 10px 13px;
-webkit-overflow-scrolling: touch;
position: static;
-webkit-transform: translateZ(0px);
.item {
display: inline-block;
font-size: 15px;
line-height: 35px;
li {
height: 35px;
padding: 0 8px;
// padding-right: 15px;
box-sizing: border-box;
max-width: 25%;
text-align: left;
color: #676869;
overflow: hidden;
line-height: 35px;
font-size: 15px;
width: 100%;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
// flex: 1 0 auto;
&:last-of-type {
padding-right: 15px;
}
color: #676869;
cursor: pointer;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: space-between;
-webkit-justify-content: space-between;
&.active {
color: #373839;
font-family: PingFangSC-Medium;
/*font-weight:500;*/
color: #449284;
}
&.active:after {
content: " ";
position: absolute;
left: 50%;
bottom: 0;
right: 0;
img {
width: 10px;
height: 3px;
/*border-radius: 2px;*/
border-radius: 30%;
text-align: center;
background-color: #449284;
transform: translateX(-50%);
}
}
}
.address-content {
position: relative;
width: 100%;
// height: 100%;
height: 196px;
overflow: hidden;
box-sizing: border-box;
ul {
width: 100%;
height: 196px;
overflow-y: auto;
box-sizing: border-box;
padding: 10px 13px;
-webkit-overflow-scrolling: touch;
position: static;
-webkit-transform: translateZ(0px);
li {
height: 35px;
line-height: 35px;
font-size: 15px;
width: 100%;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #676869;
cursor: pointer;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: space-between;
-webkit-justify-content: space-between;
&.active {
color: #449284;
}
img {
width: 10px;
height: 10px;
}
height: 10px;
}
}
}
}
}
.my-org {
margin: 0 15px 15px;
& > span {
font-size: 12px;
color: #979899;
}
.my-org {
margin: 0 15px 15px;
& > span {
font-size: 12px;
color: #979899;
}
.list {
display: flex;
flex-direction: row;
justify-content: space-between;
margin-top: 4px;
span {
font-size: 15px;
color: #676869;
}
.list {
display: flex;
flex-direction: row;
justify-content: space-between;
margin-top: 4px;
span {
font-size: 15px;
color: #676869;
}
img {
width: 10px;
}
img {
width: 10px;
}
}
}
</style>
\ No newline at end of file
}
</style>
<!-- 选择机构组件 -->
<template>
<div class="select-wrapper" @touchmove.prevent.stop>
<div class="mask" @click="cancel" @touchmove.prevent.stop>
<div class="address-wrap" @click.stop @touchmove.prevent.stop>
<div
class="select-wrapper"
@touchmove.prevent.stop
>
<div
class="mask"
@click="cancel"
@touchmove.prevent.stop
>
<div
class="address-wrap"
@click.stop
@touchmove.prevent.stop
>
<div class="tip-header">
<span class="cancel-btn" @click="cancel">取消</span>
<span
class="cancel-btn"
@click="cancel"
>取消</span>
<h3>选择机构</h3>
<span class="submit-btn" @click="confirm">确定</span>
<span
class="submit-btn"
@click="confirm"
>确定</span>
</div>
<div class="address-select">
<ul class="show-address-header">
......@@ -14,7 +31,10 @@
请选择
</li>
</ul>
<div class="address-content" @touchmove.stop>
<div
class="address-content"
@touchmove.stop
>
<ul id="province">
<li
v-for="(orgItem, index) in dataList"
......@@ -24,7 +44,7 @@
>
<span>{{ orgItem.hospitalName }}</span>
<span v-show="orgItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
<img src="../../assets/images/sort-select-icon.png">
</span>
</li>
</ul>
......@@ -35,62 +55,59 @@
</div>
</template>
<script>
import { mapGetters } from "vuex";
import { mapGetters } from 'vuex';
export default {
name: "PicaOrg",
data() {
return {
dataList: [],
};
},
name: 'PicaOrg',
props: {
baseUrl: {
type: String,
default: ""
default: '',
},
rank: {
type: Number | String,
default: 4
}
type: Number,
default: 4,
},
},
data() {
return {
dataList: [],
};
},
computed: {
...mapGetters({
orgList: "orgList"
})
orgList: 'orgList',
}),
},
watch: {
orgList: {
handler(newList) {
this.dataList = newList || [];
this.dataList.map(a => {
this.dataList.map((a) => {
a.selected = false;
});
},
deep: true
}
},
created() {
deep: true,
},
},
created() {},
methods: {
orgSelect(item, idx) {
this.dataList[idx].selected = !this.dataList[idx].selected;
this.$forceUpdate()
this.$forceUpdate();
},
confirm() {
this.$emit("confirm", this.dataList);
this.$emit('confirm', this.dataList);
},
cancel() {
this.$emit("cancel", false);
}
}
this.$emit('cancel', false);
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.select-wrapper {
font-family: PingFangSC-Regular;
......@@ -162,7 +179,7 @@ export default {
padding-bottom: 4px;
&:after {
content: " ";
content: ' ';
position: absolute;
left: 0;
bottom: 0;
......@@ -202,7 +219,7 @@ export default {
}
&.active:after {
content: " ";
content: ' ';
position: absolute;
left: 50%;
bottom: 0;
......@@ -270,4 +287,4 @@ export default {
}
}
}
</style>
\ No newline at end of file
</style>
<!-- 进度条组件 -->
<template>
<div class="common-process">
<span class="bar" :style="{'width': maxPocessWidth, 'background': barColor}"></span><span class="desc">{{value}}{{unitName}}</span>
<span
class="bar"
:style="{ width: maxPocessWidth, background: barColor }"
/><span class="desc">{{ value }}{{ unitName }}</span>
</div>
</template>
<script>
export default {
props: {
maxValue: {
type: Number | String,
default: 100
type: Number,
default: 100,
},
value: {
type: Number | String,
default: 0
type: Number,
default: 0,
},
processDataObj: {
type: Object,
default: () => {
return {
maxValue: 100,
value: 0
}
}
value: 0,
};
},
},
valueDescWidth: {
type: Number | String,
default: 124
type: Number,
default: 124,
},
barColor: {
type: String,
default: '#39AF9A'
default: '#39AF9A',
},
unitName: {
type: String,
default: '分钟'
default: '分钟',
},
processWidth: {
type: String,
default: '0px'
}
default: '0px',
},
},
data() {
return {
maxPocessWidth: '0px'
}
maxPocessWidth: '0px',
};
},
watch: {
processDataObj: {
handler(newVal) {
if(process.client) {
let clientWidth = window.outerWidth || document.body.clientWidth || document.documentElement.clientWidth;
let maxWidth = clientWidth - this.valueDescWidth;
handler() {
if (process.client) {
const clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
const maxWidth = clientWidth - this.valueDescWidth;
let ratio = 1;
// debugger
if(this.maxValue && this.maxValue < this.value) {
if (this.maxValue && this.maxValue < this.value) {
ratio = this.maxValue / this.value;
}
if(this.value && this.maxValue > this.value) {
if (this.value && this.maxValue > this.value) {
ratio = this.value / this.maxValue;
}
if(this.value < 1 || this.maxValue < 1 || ratio <= 0.01) {
this.maxPocessWidth = '1px'
if (this.value < 1 || this.maxValue < 1 || ratio <= 0.01) {
this.maxPocessWidth = '1px';
} else {
this.maxPocessWidth = Math.round(ratio * maxWidth) + 'px'
}
this.maxPocessWidth = Math.round(ratio * maxWidth) + 'px';
}
}
},
deep: true
}
}
deep: true,
},
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.common-process {
display: flex;
flex-direction: row;
......
import {
router,
store,
vueApp,
} from '@pica-cli/vue-cli-plugin-pica-cli-plugin/auto';
import Vue from 'vue';
import '@/router';
console.log('router, store, vueApp: ', Vue, router, store, vueApp);
[{"id":330,"url":"/banlance-detail","fullPath":"https://phome.yunqueyi.com/mall/banlance-detail","host":"https://phome.yunqueyi.com","menuCode":"7800350"},{"id":333,"url":"/bill-detail","fullPath":"https://phome.yunqueyi.com/mall/bill-detail","host":"https://phome.yunqueyi.com","menuCode":"7800353"},{"id":335,"url":"/bind-card","fullPath":"https://phome.yunqueyi.com/mall/bind-card","host":"https://phome.yunqueyi.com","menuCode":"7800355"},{"id":337,"url":"/capital","fullPath":"https://phome.yunqueyi.com/mall/capital","host":"https://phome.yunqueyi.com","menuCode":"7800357"},{"id":339,"url":"/cash-real","fullPath":"https://phome.yunqueyi.com/mall/cash-real","host":"https://phome.yunqueyi.com","menuCode":"7800359"},{"id":341,"url":"/check-serve","fullPath":"https://phome.yunqueyi.com/mall/check-serve","host":"https://phome.yunqueyi.com","menuCode":"7800361"},{"id":343,"url":"/consultation-capital","fullPath":"https://phome.yunqueyi.com/mall/consultation-capital","host":"https://phome.yunqueyi.com","menuCode":"7800363"},{"id":345,"url":"/custom-service","fullPath":"https://phome.yunqueyi.com/mall/custom-service","host":"https://phome.yunqueyi.com","menuCode":"7800365"},{"id":347,"url":"/doctor-detail","fullPath":"https://phome.yunqueyi.com/mall/doctor-detail","host":"https://phome.yunqueyi.com","menuCode":"7800367"},{"id":349,"url":"/doctor-manager","fullPath":"https://phome.yunqueyi.com/mall/doctor-manager","host":"https://phome.yunqueyi.com","menuCode":"7800369"},{"id":351,"url":"/fee-result","fullPath":"https://phome.yunqueyi.com/mall/fee-result","host":"https://phome.yunqueyi.com","menuCode":"7800371"},{"id":353,"url":"/find-med","fullPath":"https://phome.yunqueyi.com/mall/find-med","host":"https://phome.yunqueyi.com","menuCode":"7800373"},{"id":355,"url":"/fund-record","fullPath":"https://phome.yunqueyi.com/mall/fund-record","host":"https://phome.yunqueyi.com","menuCode":"7800375"},{"id":357,"url":"/goods","fullPath":"https://phome.yunqueyi.com/mall/goods","host":"https://phome.yunqueyi.com","menuCode":"7800377"},{"id":358,"url":"/invitation","fullPath":"https://phome.yunqueyi.com/mall/invitation","host":"https://phome.yunqueyi.com","menuCode":"7800378"},{"id":359,"url":"/med-detail","fullPath":"https://phome.yunqueyi.com/mall/med-detail","host":"https://phome.yunqueyi.com","menuCode":"7800379"},{"id":360,"url":"/med-list","fullPath":"https://phome.yunqueyi.com/mall/med-list","host":"https://phome.yunqueyi.com","menuCode":"7800380"},{"id":361,"url":"/monthly-report","fullPath":"https://phome.yunqueyi.com/mall/monthly-report","host":"https://phome.yunqueyi.com","menuCode":"7800381"},{"id":362,"url":"/my-card","fullPath":"https://phome.yunqueyi.com/mall/my-card","host":"https://phome.yunqueyi.com","menuCode":"7800382"},{"id":363,"url":"/opened-medication","fullPath":"https://phome.yunqueyi.com/mall/opened-medication","host":"https://phome.yunqueyi.com","menuCode":"7800383"},{"id":364,"url":"/pay","fullPath":"https://phome.yunqueyi.com/mall/pay","host":"https://phome.yunqueyi.com","menuCode":"7800384"},{"id":365,"url":"/pay-detail","fullPath":"https://phome.yunqueyi.com/mall/pay-detail","host":"https://phome.yunqueyi.com","menuCode":"7800385"},{"id":366,"url":"/pay-order","fullPath":"https://phome.yunqueyi.com/mall/pay-order","host":"https://phome.yunqueyi.com","menuCode":"7800386"},{"id":367,"url":"/protocol","fullPath":"https://phome.yunqueyi.com/mall/protocol","host":"https://phome.yunqueyi.com","menuCode":"7800387"},{"id":368,"url":"/push-pay","fullPath":"https://phome.yunqueyi.com/mall/push-pay","host":"https://phome.yunqueyi.com","menuCode":"7800388"},{"id":369,"url":"/search","fullPath":"https://phome.yunqueyi.com/mall/search","host":"https://phome.yunqueyi.com","menuCode":"7800389"},{"id":370,"url":"/search-bulk","fullPath":"https://phome.yunqueyi.com/mall/search-bulk","host":"https://phome.yunqueyi.com","menuCode":"7800390"},{"id":371,"url":"/service-detail","fullPath":"https://phome.yunqueyi.com/mall/service-detail","host":"https://phome.yunqueyi.com","menuCode":"7800391"},{"id":372,"url":"/set-pwd","fullPath":"https://phome.yunqueyi.com/mall/set-pwd","host":"https://phome.yunqueyi.com","menuCode":"7800392"},{"id":373,"url":"/shop-order","fullPath":"https://phome.yunqueyi.com/mall/shop-order","host":"https://phome.yunqueyi.com","menuCode":"7800393"},{"id":374,"url":"/store-certify","fullPath":"https://phome.yunqueyi.com/mall/store-certify","host":"https://phome.yunqueyi.com","menuCode":"7800394"},{"id":375,"url":"/trade-detail","fullPath":"https://phome.yunqueyi.com/mall/trade-detail","host":"https://phome.yunqueyi.com","menuCode":"7800395"},{"id":376,"url":"/unbind-card","fullPath":"https://phome.yunqueyi.com/mall/unbind-card","host":"https://phome.yunqueyi.com","menuCode":"7800396"},{"id":377,"url":"/verify-patient","fullPath":"https://phome.yunqueyi.com/mall/verify-patient","host":"https://phome.yunqueyi.com","menuCode":"7800397"},{"id":378,"url":"/address/add-address","fullPath":"https://phome.yunqueyi.com/mall/address/add-address","host":"https://phome.yunqueyi.com","menuCode":"7800398"},{"id":379,"url":"/address/address-list","fullPath":"https://phome.yunqueyi.com/mall/address/address-list","host":"https://phome.yunqueyi.com","menuCode":"7800399"},{"id":380,"url":"/check-serve/bluetooth","fullPath":"https://phome.yunqueyi.com/mall/check-serve/bluetooth","host":"https://phome.yunqueyi.com","menuCode":"7800400"},{"id":381,"url":"/check-serve/data","fullPath":"https://phome.yunqueyi.com/mall/check-serve/data","host":"https://phome.yunqueyi.com","menuCode":"7800401"},{"id":382,"url":"/check-serve/detail","fullPath":"https://phome.yunqueyi.com/mall/check-serve/detail","host":"https://phome.yunqueyi.com","menuCode":"7800402"},{"id":383,"url":"/check-serve/editChecker","fullPath":"https://phome.yunqueyi.com/mall/check-serve/editChecker","host":"https://phome.yunqueyi.com","menuCode":"7800403"},{"id":384,"url":"/check-serve/list","fullPath":"https://phome.yunqueyi.com/mall/check-serve/list","host":"https://phome.yunqueyi.com","menuCode":"7800404"},{"id":385,"url":"/check-serve/listv2","fullPath":"https://phome.yunqueyi.com/mall/check-serve/listv2","host":"https://phome.yunqueyi.com","menuCode":"7800405"},{"id":386,"url":"/check-serve/search","fullPath":"https://phome.yunqueyi.com/mall/check-serve/search","host":"https://phome.yunqueyi.com","menuCode":"7800406"},{"id":387,"url":"/check-serve/testbt","fullPath":"https://phome.yunqueyi.com/mall/check-serve/testbt","host":"https://phome.yunqueyi.com","menuCode":"7800407"},{"id":388,"url":"/consultation-capital/indexold","fullPath":"https://phome.yunqueyi.com/mall/consultation-capital/indexold","host":"https://phome.yunqueyi.com","menuCode":"7800408"},{"id":389,"url":"/fund-record/pannel","fullPath":"https://phome.yunqueyi.com/mall/fund-record/pannel","host":"https://phome.yunqueyi.com","menuCode":"7800409"},{"id":390,"url":"/goods/edit","fullPath":"https://phome.yunqueyi.com/mall/goods/edit","host":"https://phome.yunqueyi.com","menuCode":"7800410"},{"id":391,"url":"/goods/editv2","fullPath":"https://phome.yunqueyi.com/mall/goods/editv2","host":"https://phome.yunqueyi.com","menuCode":"7800411"},{"id":392,"url":"/goods/editv3","fullPath":"https://phome.yunqueyi.com/mall/goods/editv3","host":"https://phome.yunqueyi.com","menuCode":"7800412"},{"id":393,"url":"/goods/report","fullPath":"https://phome.yunqueyi.com/mall/goods/report","host":"https://phome.yunqueyi.com","menuCode":"7800413"},{"id":394,"url":"/invitation/invitation-share","fullPath":"https://phome.yunqueyi.com/mall/invitation/invitation-share","host":"https://phome.yunqueyi.com","menuCode":"7800414"},{"id":395,"url":"/med-list/sku-list","fullPath":"https://phome.yunqueyi.com/mall/med-list/sku-list","host":"https://phome.yunqueyi.com","menuCode":"7800415"},{"id":396,"url":"/order/detail","fullPath":"https://phome.yunqueyi.com/mall/order/detail","host":"https://phome.yunqueyi.com","menuCode":"7800416"},{"id":397,"url":"/order/list","fullPath":"https://phome.yunqueyi.com/mall/order/list","host":"https://phome.yunqueyi.com","menuCode":"7800417"},{"id":398,"url":"/order/logistics","fullPath":"https://phome.yunqueyi.com/mall/order/logistics","host":"https://phome.yunqueyi.com","menuCode":"7800418"},{"id":399,"url":"/search/medical","fullPath":"https://phome.yunqueyi.com/mall/search/medical","host":"https://phome.yunqueyi.com","menuCode":"7800419"},{"id":400,"url":"/store-certify/consts","fullPath":"https://phome.yunqueyi.com/mall/store-certify/consts","host":"https://phome.yunqueyi.com","menuCode":"7800420"},{"id":401,"url":"/store-certify/detail","fullPath":"https://phome.yunqueyi.com/mall/store-certify/detail","host":"https://phome.yunqueyi.com","menuCode":"7800421"},{"id":402,"url":"/verify-patient/list","fullPath":"https://phome.yunqueyi.com/mall/verify-patient/list","host":"https://phome.yunqueyi.com","menuCode":"7800422"},{"id":403,"url":"/verify-patient/search","fullPath":"https://phome.yunqueyi.com/mall/verify-patient/search","host":"https://phome.yunqueyi.com","menuCode":"7800423"},{"id":404,"url":"/check-serve/bluetooth/bluetooth-msg","fullPath":"https://phome.yunqueyi.com/mall/check-serve/bluetooth/bluetooth-msg","host":"https://phome.yunqueyi.com","menuCode":"7800424"},{"id":405,"url":"/","fullPath":"https://phome.yunqueyi.com/mall/","host":"https://phome.yunqueyi.com","menuCode":"7800425"},{"id":850,"url":"/bankList","fullPath":"https://phome.yunqueyi.com/mall/bankList","host":"https://phome.yunqueyi.com","menuCode":"7800871"},{"id":851,"url":"/zero","fullPath":"https://phome.yunqueyi.com/mall/zero","host":"https://phome.yunqueyi.com","menuCode":"7800872"},{"id":1317,"url":"/enchashment-result","fullPath":"https://phome.yunqueyi.com/mall/enchashment-result","host":"https://phome.yunqueyi.com","menuCode":"7801338"},{"id":1318,"url":"/order/offline","fullPath":"https://phome.yunqueyi.com/mall/order/offline","host":"https://phome.yunqueyi.com","menuCode":"7801339"}]
\ No newline at end of file
[{"id":1387,"url":"/examscore","fullPath":"https://phome.yunqueyi.com/lreport_ssr/examscore","host":"https://phome.yunqueyi.com","menuCode":"7801412","title":null},{"id":1388,"url":"/examtimes","fullPath":"https://phome.yunqueyi.com/lreport_ssr/examtimes","host":"https://phome.yunqueyi.com","menuCode":"7801413","title":null},{"id":1389,"url":"/klgpoint","fullPath":"https://phome.yunqueyi.com/lreport_ssr/klgpoint","host":"https://phome.yunqueyi.com","menuCode":"7801414","title":null},{"id":1390,"url":"/prolist","fullPath":"https://phome.yunqueyi.com/lreport_ssr/prolist","host":"https://phome.yunqueyi.com","menuCode":"7801415","title":null},{"id":1391,"url":"/rankdays","fullPath":"https://phome.yunqueyi.com/lreport_ssr/rankdays","host":"https://phome.yunqueyi.com","menuCode":"7801416","title":null},{"id":1392,"url":"/rankedu","fullPath":"https://phome.yunqueyi.com/lreport_ssr/rankedu","host":"https://phome.yunqueyi.com","menuCode":"7801417","title":null},{"id":1393,"url":"/","fullPath":"https://phome.yunqueyi.com/lreport_ssr/","host":"https://phome.yunqueyi.com","menuCode":"7801418","title":null}]
\ No newline at end of file
该目录放置Vue第三方插件初始化的文件。该目录会被自动加载。
例如:
```js
import Vue from 'vue';
import { Plugin } from 'vue-fragment';
Vue.use(Plugin);
Vue.property.$test = 'pica';
```
/**
* @name: appHooks
* @author: alan
* @date: 2021-09-13 17:05
* @description:appHooks
* @update: 2021-09-13 17:05
*/
export default {
data() {
return {};
},
created() {},
mounted() {},
};
import $http from 'mn-template/plugins/http';
// 设置axios默认属性
$http.setDefaults({
headers: {},
});
// 设置http配置信息 loading、error、clear、encrypt、mockUserInfo
$http.setOptions({
loading() {
console.log('我重写了默认的loading');
},
});
// 新增前置钩子
$http.addBeforeHook((config) => console.log('我是新增的前置钩子', config), 0);
// 新增后置钩子
$http.addAfterHook(
(response) => console.log('我是新增的后置钩子', response),
0
);
/**
* @name: vue-component
* @author: alan
* @date: 2021-11-16 18:03
* @description:vue-component
* @update: 2021-11-16 18:03
*/
import Vue from 'vue';
import PageModel from '@pica-kit/page-model';
import {
Dialog,
Toast,
Popup,
Icon,
Button,
Uploader,
List,
Loading,
Swipe,
SwipeItem,
} from 'vant';
import { BASE_URL } from '@/utils/enumerate';
import PicaGuideApp, { callApp } from 'pica-guide-app';
// import PicaTopicComment from '@pica-kit/pica-topic-comment';
import PicaTopicStencil from '@pica-kit/pica-topic-stencil';
import WebBuriedPoint, { sendBuriedData } from '@pica-core/web-buried-point';
import PicaH5Login from 'pica-h5-login';
import PicaH5Agreement from 'pica-h5-agreement';
import ClipboardJS from 'clipboard';
const cookies = require('cookie-universal')();
const WX_TYPE_MAP = {
dev: 1,
test: 15,
uat: 30,
prod: 5,
};
const app_env = ['dev', 'test'];
if (app_env.indexOf(process.env.NUXT_ENV_APP) != -1) {
console.log('当前运行环境 NUXT_ENV_APP =>', process.env.NUXT_ENV_APP);
const VConsole = require('vconsole');
new VConsole();
}
// Vue.use(PicaCallApp)
Vue.use(PicaGuideApp)
.use(PicaTopicStencil)
// .use(PicaTopicComment)
.use(PicaH5Login)
.use(PicaH5Agreement)
.use(Dialog)
.use(Toast)
.use(Icon)
.use(Popup)
.use(Loading)
.use(List)
.use(Button)
.use(Uploader)
.use(Swipe)
.use(SwipeItem)
.use(PageModel);
const { NUXT_ENV_APP } = process.env;
Vue.use(WebBuriedPoint, {
class_name: 'template_v2',
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`,
});
Vue.prototype.$sendBuriedData = sendBuriedData;
Vue.prototype.$cookies = cookies;
Vue.prototype.$callApp = callApp;
Vue.prototype.ClipboardJS = ClipboardJS;
Vue.prototype.$WX_TYPE = WX_TYPE_MAP[NUXT_ENV_APP];
import Vue from 'vue';
import rocNative from '@/utils/jsbridge';
// import echarts from 'echarts';
import { Toast } from 'vant';
const echarts = window.echarts;
Vue.use(Toast);
Vue.prototype.$echarts = echarts;
Vue.prototype.$rocNative = new rocNative();
import axios from 'axios';
import { name } from '../package.json';
// 整理路由
const routerObj = {};
const titleObj = {};
let baseUrl = process.env.VUE_APP_BASE_ROUTE_URL || process.env.BASE_URL || '';
let fullHost = location.host || '';
if (fullHost.indexOf('uat-') != -1) {
fullHost = fullHost.replace('uat-', '');
}
if (fullHost.indexOf('http') == -1) {
fullHost = (window.location.protocol || 'https:') + '//' + fullHost;
}
let rMode = 'history';
if (window.location.hash) {
rMode = 'hash';
baseUrl = baseUrl || location.pathname;
}
let projectName = name;
// 处理路由children
function allRouter(ele, spath) {
for (var i = 0; i < ele.length; i++) {
if (ele[i].path) {
let key = '';
if (spath && spath != '/') {
key = spath + '/' + ele[i].path;
} else {
key = ele[i].path;
}
routerObj[key] = key;
titleObj[key] = ele[i].meta && ele[i].meta.title;
if (ele[i].children) {
allRouter(ele[i].children, ele[i].path);
}
}
}
}
// 处理路由
function handleAllRouter(parmsObj) {
parmsObj.mode = parmsObj.mode || rMode;
projectName = parmsObj.projectName || projectName;
baseUrl = parmsObj.baseUrl || baseUrl || '';
const fhost = parmsObj.fullHost || fullHost;
if (baseUrl.substr(baseUrl.length - 1, 1) == '/') {
baseUrl = baseUrl.substr(0, baseUrl.length - 1);
}
if (parmsObj.mode == 'hash') {
baseUrl = baseUrl + '/#';
}
allRouter(parmsObj.routerConfig, '');
const arr = [];
for (var key in routerObj) {
const optionObj = {};
optionObj.url = routerObj[key];
optionObj.fullPath = fhost + baseUrl + routerObj[key];
optionObj.host = fhost;
optionObj.title = titleObj[key];
arr.push(optionObj);
}
sendAllRouterInfo(arr);
}
// 发送请求
function sendAllRouterInfo(data) {
let url = '';
if (process.env.NODE_ENV == 'development') {
url = 'https://dev-sc.yunqueyi.com/basic-data/menuCode/upload';
} else if (process.env.VUE_APP_ENV == 'uat') {
url = 'https://sc.yunqueyi.com/basic-data/menuCode/upload';
}
if (!url) {
return;
}
const obj = {
projectName: projectName,
menuCodeDtoList: data,
};
console.log(obj);
axios({
method: 'post',
url: url,
data: obj,
})
.then((res) => {
console.log('请求接口成功了', res.data);
return;
})
.catch((err) => {
console.log('errerrerr', err);
return;
});
}
export default handleAllRouter;
var axios=require('axios');
// 整理路由
const routerObj={};
let baseUrl='';
let port = (process.env.PORT == "80" || process.env.PORT == "443" ) ? '' : (":"+process.env.PORT)
let fullHost=process.env.HOST+port;
let projectName=require("../package.json").name
//production
// 处理路由children
function allRouter(ele){
for(var i=0;i< ele.length;i++){
if(ele[i].path){
//let key= baseUrl+spath+(spath ? "/" : '')+ele[i].path;
let key= ele[i].path;
routerObj[key]= key;
}
}
};
// 处理路由
function handleAllRouter(ObjParms){
// baseUrl
baseUrl=ObjParms.baseUrl || '';
let fhost= ObjParms.fullHost||fullHost;
allRouter(ObjParms.routes,'');
if(baseUrl.substr(baseUrl.length-1,1)=="/"){
baseUrl=baseUrl.substr(0,baseUrl.length-1)
}
let arr=[];
for(var key in routerObj){
let optionObj={};
optionObj.url=routerObj[key];
optionObj.fullPath=fhost+baseUrl+routerObj[key]
optionObj.host=fhost;
arr.push(optionObj)
}
sendAllRouterInfo(arr)
};
// 发送请求
function sendAllRouterInfo(data){
let url="https://dev-sc.yunqueyi.com/basic-data/menuCode/upload";
if(process.env.NUXT_ENV_APP!="development"){
url="https://sc.yunqueyi.com/basic-data/menuCode/upload";
}
let obj={
projectName:projectName,
menuCodeDtoList:data
}
axios({
method: 'post',
url:url,
data: obj
}).then(res=>{
console.log("请求接口成功了",res.data)
return
}).catch(err=>{
console.log("请求接口失败了")
return
});
};
// 定制化路由
// [{
// path:"/capital",
// meta:{isMountedReport:true,callback:()=>{return []}}
// }]
module.exports= handleAllRouter
```js
import { router } from '@pica-cli/vue-cli-plugin-pica-cli-plugin/auto';
import Index from '@/views/home.vue';
const routerConfig = [
{
path: '/',
name: 'Index',
component: Index
},
{
path: '*',
redirect: process.env.VUE_APP_BASE_ROUTE
}
];
router.addRoutes(routerConfig);
```
```js
// vue.config.js
module.exports = {
transpileDependencies: [
'@pica-cli/vue-cli-plugin-pica-cli-plugin'
],
pluginOptions: {
pica: {
jsSort: [],
cssSort: [],
// 配置骨架屏路由
skeletonRoutes: [
{
path: '',
name: 'Index',
meta: {
skeleton: true
}
}
],
enableAutoSkeletonRoutes: false,
routeMode: 'history',
dpsLimit: 5
},
tinypng: {
key: ''
}
}
};
module.exports.publicPath = process.env.VUE_APP_OSS_URL + '/static' + process.env.BASE_URL;
```
import { router } from '@pica-cli/vue-cli-plugin-pica-cli-plugin/auto';
try {
const originalPush = router.prototype.push;
router.prototype.push = function push(location) {
return originalPush.call(this, location).catch((err) => err);
};
} catch (error) {
console.log(error);
}
const routerConfig = [
{
path: '*',
redirect: process.env.VUE_APP_BASE_ROUTE,
},
{
path: '/',
name: 'index',
meta: {
title: '学情报告',
},
component: () => import('@/views/index'),
},
{
path: '/examscore',
name: 'examscore',
meta: {
title: '完成项目考试分数情况',
},
component: () => import('@/views/examscore'),
},
{
path: '/examtimes',
name: 'examtimes',
meta: {
title: '完成项目考试次数情况',
},
component: () => import('@/views/examscore'),
},
{
path: '/klgpoint',
name: 'klgpoint',
meta: {
title: '培训前后知识点掌握情况',
},
component: () => import('@/views/klgpoint'),
},
{
path: '/prolist',
name: 'prolist',
meta: {
title: '专项合作',
},
component: () => import('@/views/prolist'),
},
{
path: '/rankdays',
name: 'rankdays',
meta: {
title: '完成天数排名',
},
component: () => import('@/views/rankdays'),
},
{
path: '/rankedu',
name: 'rankedu',
meta: {
title: '项目情况排名',
},
component: () => import('@/views/rankedu'),
},
];
router.addRoutes(routerConfig);
import qs from 'qs';
import request from './api';
import request from 'mn-template/plugins/http';
export const getHospital = async (params) => {
let query = { pageNum: 1, pageSize: 1, ...params };
const query = { pageNum: 1, pageSize: 1, ...params };
const str = qs.stringify(query);
return request({ url: `/api-ws/hospitals/?${str}` });
};
/**
* 通用获取区域或机构列表
*/
export const getAreaOrOrgList = async params => {
export const getAreaOrOrgList = async (params) => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: 'stats/region'
url: 'stats/region',
});
};
/**
* 获取区域(一般是乡镇)下的机构列表
*/
export const getOrgListByTownId = async params => {
export const getOrgListByTownId = async (params) => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: '/basic-data/position/towns'
url: '/basic-data/position/towns',
});
};
/**
* 总体情况-选择地区下
*/
export const getGeneralData = async data => {
export const getGeneralData = async (data) => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/general'
url: 'stats/report/general',
});
};
/**
* 根据地区查询机构
*/
export const getHospitalsByRegionId = async params => {
export const getHospitalsByRegionId = async (params) => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: 'stats/region/hospital'
url: 'stats/region/hospital',
});
};
/**
* 人群分析
*/
export const getUserAnalysis = async data => {
export const getUserAnalysis = async (data) => {
return request({
// baseURL: 'http://10.177.11.156:10443/',
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/userAnalysis'
url: 'stats/report/userAnalysis',
});
};
/**
* 根据地区查询地区下是否有机构
*/
export const getHospitalsCNT = async params => {
export const getHospitalsCNT = async (params) => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: 'stats/region/hospitals/cnt'
url: 'stats/region/hospitals/cnt',
});
};
/**
* 总体情况-选择机构下人员情况
*/
export const getGeneralPersonal = async data => {
export const getGeneralPersonal = async (data) => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/generalPersonal/' + data.pageCfg.type
url: 'stats/report/generalPersonal/' + data.pageCfg.type,
// url: `stats/report/generalPersonal/${data.pageCfg.type}/${data.pageCfg.pageNo}/${data.pageCfg.pageSize}`
});
};
......@@ -98,12 +97,12 @@ export const getGeneralPersonal = async data => {
/**
* 总体情况-课程分析接口
*/
export const getGeneralCourse = async data => {
export const getGeneralCourse = async (data) => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/course'
url: 'stats/report/course',
// url: `stats/report/course/0/0`
});
};
......@@ -111,96 +110,95 @@ export const getGeneralCourse = async data => {
/**
* 总体情况-考试分析接口
*/
export const getGeneralExam = async data => {
export const getGeneralExam = async (data) => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/exam'
url: 'stats/report/exam',
});
};
/**
* 总体情况-考试分析考试列表
*/
export const getGeneralExamList = async data => {
export const getGeneralExamList = async (data) => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/exam/list'
url: 'stats/report/exam/list',
});
};
/**
* 总体情况-考试分析接口(单个机构)
*/
export const getGeneralExamSingle = async params => {
export const getGeneralExamSingle = async (params) => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: 'stats/report/exam/' + params.projectId + '/' + params.hospitalId
url: 'stats/report/exam/' + params.projectId + '/' + params.hospitalId,
});
};
/**
* 查询用户信息和权限
*/
export const getProjectInfo = async params => {
export const getProjectInfo = async (params) => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: 'stats/region/info'
url: 'stats/region/info',
});
};
/**
* 学习效果分析
*/
export const getStudyEffect = async data => {
export const getStudyEffect = async (data) => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/studyEffect'
url: 'stats/report/studyEffect',
});
};
/**
* 总体情况-项目情况排名
*/
export const getStudyRankData = async data => {
export const getStudyRankData = async (data) => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/studyRank/' + data.pageCfg.type
url: 'stats/report/studyRank/' + data.pageCfg.type,
});
};
/**
* 总体情况-完成天数排名
*/
export const getStudyTimeData = async data => {
export const getStudyTimeData = async (data) => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: 'stats/report/studyTime/' + data.pageCfg.type
url: 'stats/report/studyTime/' + data.pageCfg.type,
});
};
/**
* 查询用户项目列表
*/
export const getProjectList = async params => {
export const getProjectList = async (params) => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: 'portal/report/getReportListForApp'
url: 'portal/report/getReportListForApp',
});
};
......@@ -11,7 +11,7 @@ export const state = () => ({
areaDegree: 0,
currentOrgList: [],
originalFlag: 1,
})
});
export const getters = {
projectId(state) {
return state.projectId;
......@@ -45,11 +45,11 @@ export const getters = {
},
currentOrgList(state) {
return state.currentOrgList;
},
},
originalFlag(state) {
return state.originalFlag;
},
}
};
export const mutations = {
SET_PROJECT_ID(state, projectId) {
state.projectId = projectId;
......@@ -87,7 +87,7 @@ export const mutations = {
SET_ORIGINAL_FLAG(state, originalFlag) {
state.originalFlag = originalFlag;
},
}
};
export const actions = {
setProjectId({ commit }, projectId) {
commit('SET_PROJECT_ID', projectId);
......@@ -125,4 +125,4 @@ export const actions = {
setOriginalFlag({ commit }, originalFlag) {
commit('SET_ORIGINAL_FLAG', originalFlag);
},
}
\ No newline at end of file
};
export default {
namespaced: true,
state: {
count: 0,
},
mutations: {
add(state, val = 1) {
state.count += val;
},
},
};
@charset "utf-8";
* {
margin: 0;
padding: 0;
}
body {
background-color: $colorBackground;
// color: $color4;
}
a,
a:hover,
a:active,
a:focus {
text-decoration: none;
color: $color4;
}
input {
border: 0;
outline: none;
}
img {
display: block;
border: 0;
width: 100%;
height: 100%;
}
.clear:before,
.clear:after {
content: '';
display: block;
clear: both;
height: 0;
}
input::-webkit-input-placeholder {
color: $color10 !important;
}
input::-moz-placeholder {
color: $color10 !important;
}
input::-ms-input-placeholder {
color: $color10 !important;
}
input[type='search']::-webkit-search-cancel-button {
-webkit-appearance: none;
}
.van-picker__toolbar {
height: 45px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px -4px 15px 0px rgba(0, 0, 0, 0.05);
}
.van-picker__columns {
background: rgba(255, 255, 255, 1);
box-shadow: 0px -4px 15px 0px rgba(0, 0, 0, 0.05);
}
.van-picker__confirm {
color: #15a4ac;
}
.van-picker__title {
font-size: 13px;
font-weight: 400;
color: rgba(131, 139, 152, 1);
}
.fixed-bottom-20 {
position: fixed;
bottom: 20px;
}
.van-toast__icon {
font-size: 25px;
}
.page-right-content {
position: absolute;
left: -40px;
}
.flex-column {
display: flex;
flex-direction: column;
}
.flex-row {
display: flex;
flex-direction: row;
}
.flex-between {
justify-content: space-between;
}
.flex-around {
justify-content: space-around;
}
.flex-center {
align-items: center;
justify-content: center;
}
.flex-expanded {
flex: 1;
}
.van-action-sheet__item {
&:not(:first-child) {
border-top: 1px solid rgba(216, 216, 216, 0.8);
}
}
.van-cell__left-icon,
.van-cell__right-icon {
line-height: 24px !important;
}
#app {
.__vuescroll .__refresh svg.start .active-path,
.__vuescroll .__load svg.start .active-path {
stroke: #c8c9cc;
}
.__vuescroll .__refresh svg path,
.__vuescroll .__refresh svg rect,
.__vuescroll .__load svg path,
.__vuescroll .__load svg rect {
fill: #c8c9cc;
}
.__vuescroll .__refresh,
.__vuescroll .__load {
display: flex;
justify-content: center;
align-items: center;
font-size: 14px;
color: rgba(0, 0, 0, 0.5);
}
.__vuescroll .__refresh svg,
.__vuescroll .__load svg {
height: 16px;
width: 16px;
}
}
.symbol-icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
.echarts-tip {
&-warp {
position: relative;
}
&-background {
background: #fbbd52;
padding: 1px 7px;
border-radius: 2px;
font-size: 13px;
}
&-triangle-down {
width: 0;
height: 0;
position: relative;
left: calc(50% - 4px);
top: 0;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 3px solid #fbbd52;
}
}
html {
color: #000;
background: #fff;
overflow-y: scroll;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
html * {
outline: 0;
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
html,
body {
font-family: PingFangSC-Regular, -apple-system-font, Source Han Sans,
Helvetica Neue, sans-serif;
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td,
hr,
button,
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
margin: 0;
padding: 0;
}
/*
input, select, textarea {
font-size: 100%;
}
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset,
img {
border: 0;
}
abbr,
acronym {
border: 0;
font-variant: normal;
}
del {
text-decoration: line-through;
}
address,
caption,
cite,
code,
dfn,
em,
th,
var {
font-style: normal;
font-weight: 500;
}
ol,
ul {
list-style: none;
}
caption,
th {
text-align: left;
}
/*
h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: 500;
}
*/
q:before,
q:after {
content: '';
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
a:hover {
text-decoration: underline;
}
ins,
a {
text-decoration: none;
}
$color1: rgba(15, 28, 52, 1);
$color2: #58ffd2;
$color3: #ffbf38;
$color4: #15a4ac;
$color5: #83ffb5;
$color6: #eb4343;
$color7: #eb7c43;
$color8: linear-gradient(
360deg,
rgba(21, 164, 172, 1) 0%,
rgba(40, 210, 200, 1) 100%
);
$color9: #58ffd2;
$color10: #a4aab3;
$color11: #969dba;
$color12: #bbbbbb;
$color13: #ffab00;
$color14: #0000ff;
$color15: linear-gradient(
180deg,
rgba(255, 217, 125, 1) 0%,
rgba(255, 167, 17, 1) 100%
);
$color16: #d2d2d2;
$color17: #333333;
$color18: #999999;
$color19: linear-gradient(
90deg,
rgba(40, 210, 200, 1) 0%,
rgba(21, 164, 172, 1) 100%
);
$color20: #ff6e00;
$colorA: #4a90e2;
$colorB: #5ace6d;
$colorBackground: #f5f5f5;
$colorWhite: #fff;
$colorAqi1: #68cb00;
$colorAqi2: #ffc000;
$colorAqi3: #df2d00;
$colorAqi4: #6f0574;
.top-error-message {
top: 12%;
width: 80%;
}
......@@ -4,7 +4,7 @@ export const BASE_URL = {
dev: 'https://dev-sc.yunqueyi.com',
test: 'https://test1-sc.yunqueyi.com',
uat: 'https://uat-sc.yunqueyi.com',
prod: 'https://sc.yunqueyi.com'
prod: 'https://sc.yunqueyi.com',
};
export const SHARE_URL = {
......@@ -12,22 +12,10 @@ export const SHARE_URL = {
test: 'https://test1-phome.yunqueyi.com',
uat: 'https://uat-phome.yunqueyi.com',
prod: 'https://phome.yunqueyi.com',
}
};
export function getShareUrl() {
return SHARE_URL[NUXT_ENV_APP]
}
export const API_CONFIG = {
baseURL: BASE_URL[NUXT_ENV_APP],
headers: {
'X-Requested-With': 'XMLHttpRequest',
'Content-Type': 'application/json;charset=UTF-8'
},
timeout: 10000,
withCredentials: false,
responseType: 'json',
method: 'get'
return SHARE_URL[NUXT_ENV_APP];
}
export const REPONSE_CODE = {
......@@ -41,6 +29,5 @@ export const REPONSE_CODE = {
500: '服务器发生错误,请检查服务器。',
502: '网关错误。',
503: '服务不可用,服务器暂时过载或维护。',
504: '网关超时。'
504: '网关超时。',
};
import { getShareUrl } from './enumerate'
import { getShareUrl } from './enumerate';
export const getSearchByName = name => {
export const getSearchByName = (name) => {
const match = RegExp(`[?&]${name}=([^&]*)`).exec(window.location.href);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
};
export const getItem = name => {
export const getItem = (name) => {
if (!name) return;
const v = sessionStorage.getItem(name);
let val = null;
......@@ -26,33 +26,33 @@ export const setItem = (name, value) => {
sessionStorage.setItem(name, value);
};
export const removeItem = name => {
export const removeItem = (name) => {
if (!name) return;
sessionStorage.removeItem(name);
};
export const echartColors = [
"#F6BD16",
"#39AF9A",
"#5D7092",
"#1865FF",
"#6DC8EC",
"#E8684A",
"#FFB01B"
]
'#F6BD16',
'#39AF9A',
'#5D7092',
'#1865FF',
'#6DC8EC',
'#E8684A',
'#FFB01B',
];
// 日期与时间解析函数
export function parseTime(time, cFormat) {
if (arguments.length === 0) {
return null
return null;
}
const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'
let date
const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}';
let date;
if (typeof time === 'object') {
date = time
date = time;
} else {
if (('' + time).length === 10) time = parseInt(time) * 1000
date = new Date(time)
if (('' + time).length === 10) time = parseInt(time) * 1000;
date = new Date(time);
}
const formatObj = {
y: date.getFullYear(),
......@@ -61,55 +61,60 @@ export function parseTime(time, cFormat) {
h: date.getHours(),
i: date.getMinutes(),
s: date.getSeconds(),
a: date.getDay()
}
a: date.getDay(),
};
const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
let value = formatObj[key]
if (key === 'a') return ['一', '二', '三', '四', '五', '六', '日'][value - 1]
let value = formatObj[key];
if (key === 'a')
return ['一', '二', '三', '四', '五', '六', '日'][value - 1];
if (result.length > 0 && value < 10) {
value = '0' + value
value = '0' + value;
}
return value || 0
})
return time_str
return value || 0;
});
return time_str;
}
// 跳转到新的学情报告页面
export function goPageByNative(vm, pageSubUrl){
let url = getShareUrl() + pageSubUrl;
let paramList = [
export function goPageByNative(vm, pageSubUrl) {
const url = getShareUrl() + pageSubUrl;
const paramList = [
{
"key":"pageUrl",
"value": url,
"type":4,
"seqNo":1
},{
"key":"showTitle",
"value": false,
"type":1,
"seqNo":2
},{
"key":"title",
"value": '',
"type":1,
"seqNo":3
}
]
vm.$rocNative.dispatchEventByModuleCode && vm.$rocNative.dispatchEventByModuleCode({
key: 'pageUrl',
value: url,
type: 4,
seqNo: 1,
},
{
key: 'showTitle',
value: false,
type: 1,
seqNo: 2,
},
{
key: 'title',
value: '',
type: 1,
seqNo: 3,
},
];
vm.$rocNative.dispatchEventByModuleCode &&
vm.$rocNative.dispatchEventByModuleCode({
modeCode: 'M300',
jsonString: paramList
})
jsonString: paramList,
});
}
// 跳转到原生的学情详情页面
export function goNativePage(vm, config = {id: 1, authType: 1}){
let paramList = [
export function goNativePage(vm) {
const paramList = [
{
"key":"className",
key: 'className',
// "value": 'com.picahealth.yunque.activitys.learnreport.learnreport2.NewLearnReportActivity###NewLearnReportVC.PicaDo',
"value": 'com.picahealth.yunque.activitys.learnreport.MyLearnReportActivity###StudyCourseListViewController',
"type":4,
"seqNo":1
value:
'com.picahealth.yunque.activitys.learnreport.MyLearnReportActivity###StudyCourseListViewController',
type: 4,
seqNo: 1,
},
// {
// "key":"id",
......@@ -122,9 +127,10 @@ export function goNativePage(vm, config = {id: 1, authType: 1}){
// "type": 1,
// "seqNo": 3
// }
]
vm.$rocNative.dispatchEventByModuleCode && vm.$rocNative.dispatchEventByModuleCode({
];
vm.$rocNative.dispatchEventByModuleCode &&
vm.$rocNative.dispatchEventByModuleCode({
modeCode: 'M200',
jsonString: paramList
})
}
\ No newline at end of file
jsonString: paramList,
});
}
/*
* @Author: souse
* @Date: 2019-08-12 18:08:07
* @Author: souse
* @Date: 2019-08-12 18:08:07
* @Last Modified by: souse
* @Last Modified time: 2019-08-13 19:17:00
* @Descript 和app交互的接口调用 单例模式
......@@ -9,16 +9,26 @@
const ARRAY_CLASS = '[object Array]';
const _toString = Object.prototype.toString;
/**
* set default options
*/
/**
* set default options
*/
export const JsBridgeOptions = {
GLOBAL_NAME: 'rocNative',
NATIVE_IOS_NAME: 'rociOS',
NATIVE_ANDROID_NAME: '__rocAndroid',
initMethodsWithCallBack: ['getToken', 'getUserInfo', 'getLocalData'], // value is string
initMethodsWithoutCallBack: ['gotoLogin', 'appInit', 'goBack', 'shareWechat', 'showNativeToast', 'dispatchEventByModuleCode', 'appBuryingPointEntrust', 'webLoadSuccess', 'sendBuriedPoint'] // value is string
}
initMethodsWithoutCallBack: [
'gotoLogin',
'appInit',
'goBack',
'shareWechat',
'showNativeToast',
'dispatchEventByModuleCode',
'appBuryingPointEntrust',
'webLoadSuccess',
'sendBuriedPoint',
], // value is string
};
/**
* @description
......@@ -37,24 +47,34 @@ export default class PicaJsBridge {
this._GLOBAL_NAME = options.GLOBAL_NAME;
this._NATIVE_IOS_NAME = options.NATIVE_IOS_NAME;
this._NATIVE_ANDROID_NAME = options.NATIVE_ANDROID_NAME;
this.isIOS = this._isIos();
this.isAndroid = this._isAndroid();
this.isWeb = this._isWeb();
if (_toString.call(initMethodsWithCallBack) === ARRAY_CLASS && initMethodsWithCallBack.length !== 0) {
if (
_toString.call(initMethodsWithCallBack) === ARRAY_CLASS &&
initMethodsWithCallBack.length !== 0
) {
this.registerMethods(initMethodsWithCallBack, true);
}
if (_toString.call(initMethodsWithoutCallBack) === ARRAY_CLASS && initMethodsWithoutCallBack.length !== 0) {
if (
_toString.call(initMethodsWithoutCallBack) === ARRAY_CLASS &&
initMethodsWithoutCallBack.length !== 0
) {
this.registerMethods(initMethodsWithoutCallBack, false);
}
this.mountToWindow();
this.mountToWindow();
}
// is ios flag
_isIos() {
return !!(window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers[this._NATIVE_IOS_NAME]);
return !!(
window.webkit &&
window.webkit.messageHandlers &&
window.webkit.messageHandlers[this._NATIVE_IOS_NAME]
);
}
// is android flag
......@@ -73,27 +93,31 @@ export default class PicaJsBridge {
_this[method] = (param) => {
return new Promise((response, reject) => {
_this._callNative(method, param, function(result) {
_this._callNative(method, param, function (result) {
response(result);
}) ? void 0 : reject(`${method} not handled.`);
})
? void 0
: reject(`${method} not handled.`);
});
}
};
}
// register method widthout callback in window
_registerMethodWithoutMethod(method) {
const _this = this;
_this[method] = (param) => {
return new Promise((response, reject) => {
_this._callNative(method, param, null) ? response('success') : reject(`${method} not handled.`);
_this._callNative(method, param, null)
? response('success')
: reject(`${method} not handled.`);
});
}
};
}
// window call app method
_callNative(name, param, callbackFn) {
let callbackId = 0, pm;
let callbackId = 0;
if (typeof callbackFn === 'function') {
this._callbackId++;
......@@ -101,10 +125,10 @@ export default class PicaJsBridge {
this._callbakFns[callbackId] = callbackFn;
}
pm = JSON.stringify({
const pm = JSON.stringify({
name,
callbackId: callbackId ? callbackId.toString() : '',
param: param || {}
param: param || {},
});
if (this.isAndroid) {
......@@ -122,11 +146,10 @@ export default class PicaJsBridge {
// app call window method
__nativeCall(name, callbackId, result) {
const wFun = window[callbackId];
const fun = callbackId && this._callbakFns[callbackId];
//add by zhangping
const fun = callbackId && this._callbakFns[callbackId];
// add by zhangping
if (wFun && typeof wFun === 'function') {
wFun(result);
return;
......@@ -140,20 +163,24 @@ export default class PicaJsBridge {
// batch register methods
registerMethods(methods = [], widthCallback) {
if (undefined === widthCallback)
throw Error('widthCallback flag not defined, registerMethods should take second param value(true/false) for is not has callback.');
if(this.isWeb) return; // Add By Anndy Yang
methods.forEach(m => {
widthCallback === true ? this._registerMethod(m) : this._registerMethodWithoutMethod(m)
});
throw Error(
'widthCallback flag not defined, registerMethods should take second param value(true/false) for is not has callback.'
);
if (this.isWeb) return; // Add By Anndy Yang
methods.forEach((m) => {
widthCallback === true
? this._registerMethod(m)
: this._registerMethodWithoutMethod(m);
});
}
// async call app method do not need register
asyncCallNative(method, param) {
const _this = this;
return new Promise(resolve => {
_this._callNative(method, param, function(result) {
return new Promise((resolve) => {
_this._callNative(method, param, function (result) {
resolve(result);
});
});
......@@ -168,4 +195,4 @@ export default class PicaJsBridge {
mountToWindow() {
window[this._GLOBAL_NAME] = this;
}
}
\ No newline at end of file
}
// 跳转客服
import request from 'mn-template/plugins/http';
/*
*code ("0003-药械专线 0004-问诊专线 0007-会员专线 0002-教培专线 0005-招募专线 0001-基础业务")
*type 1-详情,2-ID、名称
*contentId 内容ID
*contentName 内容名称
*/
const getImUrl = (data) => {
return request({
withCredentials: true,
url: '/im/call/im/link',
method: 'post',
data: data,
});
};
function nativeGo(url) {
const paramList = [
{
key: 'pageUrl',
value: url,
type: 4,
seqNo: 1,
},
];
this.rocNative.dispatchEventByModuleCode({
modeCode: 'M300',
jsonString: paramList,
});
}
export const goKfFn = (params) => {
getImUrl(params)
.then((res) => {
if (res.code == '000000') {
nativeGo(res.data);
}
})
.catch((err) => {
console.log(err);
});
};
<template>
<section class="exam-score-wrapper">
<CommonHeader title="完成项目考试分数情况"></CommonHeader>
<CommonTitleWithDropdown :dataList="dropdownList" :title="title" :needRightBtn="needRightBtn" @selectSortItem="selectSortItem"></CommonTitleWithDropdown>
<ExamScoreList class="pdt-50" :dataList="dataList"></ExamScoreList>
<CommonNoMore v-if="dataList.length >= 10" class="mt-10"></CommonNoMore>
<Loading v-show="isShowLoading"></Loading>
<CommonHeader title="完成项目考试分数情况" />
<CommonTitleWithDropdown
:data-list="dropdownList"
:title="title"
:need-right-btn="needRightBtn"
@selectSortItem="selectSortItem"
/>
<ExamScoreList
class="pdt-50"
:data-list="dataList"
/>
<CommonNoMore
v-if="dataList.length >= 10"
class="mt-10"
/>
<Loading v-show="isShowLoading" />
</section>
</template>
<script>
const cookies = require("cookie-universal")();
import { getGeneralExam } from "@/service";
const cookies = require('cookie-universal')();
import { getGeneralExam } from '@/service';
import CommonHeader from "@/components/common/common-header";
import CommonTitleWithDropdown from "@/components/common/common-title-with-dropdown";
import CommonNoMore from "@/components/common/common-no-more";
import ExamScoreList from "@/components/bussiness/exam-score-list";
import Loading from "@/components/common/common-loading";
import { mapGetters } from "vuex";
import CommonHeader from '@/components/common/common-header';
import CommonTitleWithDropdown from '@/components/common/common-title-with-dropdown';
import CommonNoMore from '@/components/common/common-no-more';
import ExamScoreList from '@/components/bussiness/exam-score-list';
import Loading from '@/components/common/common-loading';
import { mapGetters } from 'vuex';
export default {
components: {
......@@ -24,99 +35,102 @@ export default {
CommonTitleWithDropdown,
CommonNoMore,
ExamScoreList,
Loading
Loading,
},
data() {
return {
isShowLoading: true,
title: "共0条数据",
title: '共0条数据',
needRightBtn: true,
token: "",
token: '',
// 查询概况数据
queryGDParams: {
appSelectType: 2,
beginDate: "",
endDate: "",
beginDate: '',
endDate: '',
hospitalIdList: [],
originalFlag: 2, // 默认值0:0不查看原始数据
projectId: 374,
regionId: "",
regionId: '',
timeFlag: 1,
pageNo: 0,
pageSize: 0,
sourceType: 1,
pageCfg: {
type: 1
}
type: 1,
},
},
allData: {},
dataList: [],
dropdownList: [{
desc: '1分',
type: 1
},{
desc: '5分',
type: 2
},{
desc: '10分',
type: 3
}],
dropdownList: [
{
desc: '1分',
type: 1,
},
{
desc: '5分',
type: 2,
},
{
desc: '10分',
type: 3,
},
],
};
},
computed: {
...mapGetters({
originalFlag: "originalFlag",
originalFlag: 'originalFlag',
}),
},
created() {
if (process.client) {
if(this.$route && this.$route.query) {
let cQuery = this.$route.query
if (this.$route && this.$route.query) {
const cQuery = this.$route.query;
this.queryGDParams.projectId = cQuery.projectId || '';
this.queryGDParams.regionId = cQuery.regionId || '';
let hospitalIdList = cQuery.hospitalIdList || ''
this.queryGDParams.hospitalIdList = hospitalIdList && hospitalIdList.split(',') || [];
cookies.set("lreporttoken", cQuery.token || '');
const hospitalIdList = cQuery.hospitalIdList || '';
this.queryGDParams.hospitalIdList =
(hospitalIdList && hospitalIdList.split(',')) || [];
cookies.set('lreporttoken', cQuery.token || '');
this.queryGDParams.originalFlag = cQuery.originalFlag;
this.getGeneralExam(this.queryGDParams);
}
}
},
mounted() {
},
mounted() {},
methods: {
// 考试分析
async getGeneralExam(queryData) {
await getGeneralExam(queryData).then(res => {
if (res.code === "000000") {
await getGeneralExam(queryData).then((res) => {
if (res.code === '000000') {
this.isShowLoading = false;
this.allData = res.data;
this.dataList = res.data.examScoreList;
this.title = `共${this.dataList.length}条数据`;
}
});
},
},
selectSortItem(type) {
if(type == 1) {
if (type == 1) {
this.dataList = this.allData.examScoreList || [];
} else if(type === 2) {
} else if (type === 2) {
this.dataList = this.allData.fiveExamScoreList || [];
} else if(type === 3) {
} else if (type === 3) {
this.dataList = this.allData.tenExamScoreList || [];
}
this.title = `共${this.dataList.length}条数据`;
}
}
},
},
};
</script>
<style lang="less" scoped>
.exam-score-wrapper {
.pdt-50 {
padding-top: 50px;
}
.mt-10 {
margin-top: 10px !important;
}
<style lang="scss" scoped>
.exam-score-wrapper {
.pdt-50 {
padding-top: 50px;
}
.mt-10 {
margin-top: 10px !important;
}
</style>
\ No newline at end of file
}
</style>
<template>
<section class="exam-times-wrapper">
<CommonHeader title="完成项目考试次数情况"></CommonHeader>
<CommonTitleMini :title="title" :needRightBtn="needRightBtn"></CommonTitleMini>
<ExamTimesList class="pdt-50" :dataList="dataList"></ExamTimesList>
<CommonNoMore v-if="dataList.length >= 10" class="mt-10"></CommonNoMore>
<Loading v-show="isShowLoading"></Loading>
<CommonHeader title="完成项目考试次数情况" />
<CommonTitleMini
:title="title"
:need-right-btn="needRightBtn"
/>
<ExamTimesList
class="pdt-50"
:data-list="dataList"
/>
<CommonNoMore
v-if="dataList.length >= 10"
class="mt-10"
/>
<Loading v-show="isShowLoading" />
</section>
</template>
<script>
const cookies = require("cookie-universal")();
import { getGeneralExam } from "@/service";
const cookies = require('cookie-universal')();
import { getGeneralExam } from '@/service';
import CommonHeader from "@/components/common/common-header";
import CommonTitleMini from "@/components/common/common-title-mini";
import CommonNoMore from "@/components/common/common-no-more";
import ExamTimesList from "@/components/bussiness/exam-times-list";
import Loading from "@/components/common/common-loading";
import { mapGetters } from "vuex";
import CommonHeader from '@/components/common/common-header';
import CommonTitleMini from '@/components/common/common-title-mini';
import CommonNoMore from '@/components/common/common-no-more';
import ExamTimesList from '@/components/bussiness/exam-times-list';
import Loading from '@/components/common/common-loading';
import { mapGetters } from 'vuex';
export default {
components: {
......@@ -24,77 +33,76 @@ export default {
CommonTitleMini,
CommonNoMore,
ExamTimesList,
Loading
Loading,
},
data() {
return {
isShowLoading: true,
title: "共0条数据",
title: '共0条数据',
needRightBtn: false,
token: "",
// 查询概况数据
token: '',
// 查询概况数据
queryGDParams: {
appSelectType: 1,
beginDate: "",
endDate: "",
beginDate: '',
endDate: '',
hospitalIdList: [],
originalFlag: 2, // 默认值0:0不查看原始数据
projectId: 374,
regionId: "",
regionId: '',
timeFlag: 1,
pageNo: 0,
pageSize: 0,
sourceType: 1,
pageCfg: {
type: 1
}
type: 1,
},
},
dataList: []
dataList: [],
};
},
computed: {
...mapGetters({
originalFlag: "originalFlag",
originalFlag: 'originalFlag',
}),
},
created() {
if (process.client) {
if(this.$route && this.$route.query) {
let cQuery = this.$route.query
let hospitalIdList = cQuery.hospitalIdList || ''
if (this.$route && this.$route.query) {
const cQuery = this.$route.query;
const hospitalIdList = cQuery.hospitalIdList || '';
this.queryGDParams.projectId = cQuery.projectId || '';
this.queryGDParams.regionId = cQuery.regionId || '';
this.queryGDParams.hospitalIdList = hospitalIdList && hospitalIdList.split(',') || [];
cookies.set("lreporttoken", cQuery.token || '');
this.queryGDParams.hospitalIdList =
(hospitalIdList && hospitalIdList.split(',')) || [];
cookies.set('lreporttoken', cQuery.token || '');
this.queryGDParams.originalFlag = cQuery.originalFlag;
this.getGeneralExam(this.queryGDParams);
}
}
},
mounted() {
},
mounted() {},
methods: {
// 考试分析
async getGeneralExam(queryData) {
await getGeneralExam(queryData).then(res => {
if (res.code === "000000") {
await getGeneralExam(queryData).then((res) => {
if (res.code === '000000') {
this.isShowLoading = false;
this.dataList = res.data.examTimesList;
this.title = `共${this.dataList.length}条数据`
this.title = `共${this.dataList.length}条数据`;
}
});
},
}
},
},
};
</script>
<style lang="less" scoped>
.exam-times-wrapper {
.pdt-50 {
padding-top: 50px;
}
.mt-10 {
margin-top: 10px !important;
}
<style lang="scss" scoped>
.exam-times-wrapper {
.pdt-50 {
padding-top: 50px;
}
.mt-10 {
margin-top: 10px !important;
}
</style>
\ No newline at end of file
}
</style>
<template>
<section class="container">
<CommonHeader :title="projectInfo.projectName | shortName" :isShowKf="isShowKf"></CommonHeader>
<CommonAreaSelect v-show="!isScroll" @areaClick="areaTabClick" :areaName="areaName" :showArea="isShowArea">
</CommonAreaSelect>
<CommonTaps :needFixed="isScroll" :projectInfo="projectInfo" @tabClicked="tabClicked"></CommonTaps>
<CommonHeader
:title="projectInfo.projectName | shortName"
:is-show-kf="isShowKf"
/>
<CommonAreaSelect
v-show="!isScroll"
:area-name="areaName"
:show-area="isShowArea"
@areaClick="areaTabClick"
/>
<CommonTaps
:need-fixed="isScroll"
:project-info="projectInfo"
@tabClicked="tabClicked"
/>
<!-- 总体概况 -->
<div v-show="isScroll" class="pd-top-60"></div>
<div
v-show="isScroll"
class="pd-top-60"
/>
<article v-show="cIndex === 0">
<CommonSwiperItem :isSingleOrg="isSingleOrg" :percentData="allData.percentData || {}" :certFlag="projectInfo.certFlag" @tipsClick="tipsSwiperClick"></CommonSwiperItem>
<CommonSwiperItem
:is-single-org="isSingleOrg"
:percent-data="allData.percentData || {}"
:cert-flag="projectInfo.certFlag"
@tipsClick="tipsSwiperClick"
/>
<div v-show="!isSingleOrg">
<CommonTitle v-if="projectInfo.certFlag" title="证书分布情况"></CommonTitle>
<ChartPie v-if="projectInfo.certFlag" :certFlag="projectInfo.certFlag" id="certPieId2" :pieData="(allData && allData.certData)"></ChartPie>
<CommonTitle v-if="projectInfo.certFlag" title="证书级别按学历分布情况"></CommonTitle>
<ChartColumnStack v-if="projectInfo.certFlag" :certFlag="projectInfo.certFlag" :echartsData="echartsData"></ChartColumnStack>
<CommonSplitLine></CommonSplitLine>
<CommonTitle title="项目情况排名"></CommonTitle>
<RankingList :certFlag="projectInfo.certFlag" :rankList="studyRankList.slice(0, 5)"></RankingList>
<ShowAll v-show="studyRankList.length > 5" @action="gotoPage('/rankedu', true)"></ShowAll>
<CommonSplitLine></CommonSplitLine>
<CommonTitleWithWhat @tipsClick="tipsRankingItemClick" title="完成天数排名"></CommonTitleWithWhat>
<RankingItemDays :rankList="costRankList.slice(0, 5)"></RankingItemDays>
<ShowAll v-show="costRankList.length > 5" @action="gotoPage('/rankdays')"></ShowAll>
<CommonTitle
v-if="projectInfo.certFlag"
title="证书分布情况"
/>
<ChartPie
v-if="projectInfo.certFlag"
id="certPieId2"
:cert-flag="projectInfo.certFlag"
:pie-data="allData && allData.certData"
/>
<CommonTitle
v-if="projectInfo.certFlag"
title="证书级别按学历分布情况"
/>
<ChartColumnStack
v-if="projectInfo.certFlag"
:cert-flag="projectInfo.certFlag"
:echarts-data="echartsData"
/>
<CommonSplitLine />
<CommonTitle title="项目情况排名" />
<RankingList
:cert-flag="projectInfo.certFlag"
:rank-list="studyRankList.slice(0, 5)"
/>
<ShowAll
v-show="studyRankList.length > 5"
@action="gotoPage('/rankedu', true)"
/>
<CommonSplitLine />
<CommonTitleWithWhat
title="完成天数排名"
@tipsClick="tipsRankingItemClick"
/>
<RankingItemDays :rank-list="costRankList.slice(0, 5)" />
<ShowAll
v-show="costRankList.length > 5"
@action="gotoPage('/rankdays')"
/>
</div>
<div v-show="isSingleOrg">
<CommonTitle title="培训机构情况"></CommonTitle>
<OrgDoctorList @orgDoctorTabChange="orgDoctorTabChange" :certUserList="orgDoctorTabData.certUserList" :noCertUserList="orgDoctorTabData.noCertUserList" :noJoinList="orgDoctorTabData.noJoinList" :certFlag="projectInfo.certFlag" :containOfficialFlag="projectInfo.containOfficialFlag"></OrgDoctorList>
<CommonTitle title="培训机构情况" />
<OrgDoctorList
:cert-user-list="orgDoctorTabData.certUserList"
:no-cert-user-list="orgDoctorTabData.noCertUserList"
:no-join-list="orgDoctorTabData.noJoinList"
:cert-flag="projectInfo.certFlag"
:contain-official-flag="projectInfo.containOfficialFlag"
@orgDoctorTabChange="orgDoctorTabChange"
/>
</div>
<CommonBottomInfo></CommonBottomInfo>
<CommonBottomInfo />
</article>
<!-- 人群分析 -->
<article v-show="cIndex === 1">
<CommonTitleWithBtn title="人员学历情况" @btnClick="analysisEduClick"></CommonTitleWithBtn>
<ChartPieEdu :dataList="analysisEduData"></ChartPieEdu>
<CommonSplitLine></CommonSplitLine>
<CommonTitleWithBtn title="人员职称情况" @btnClick="analysisTitleClick"></CommonTitleWithBtn>
<ChartPieTitle :dataList="analysisTitleData"></ChartPieTitle>
<CommonBottomInfo></CommonBottomInfo>
<CommonTitleWithBtn
title="人员学历情况"
@btnClick="analysisEduClick"
/>
<ChartPieEdu :data-list="analysisEduData" />
<CommonSplitLine />
<CommonTitleWithBtn
title="人员职称情况"
@btnClick="analysisTitleClick"
/>
<ChartPieTitle :data-list="analysisTitleData" />
<CommonBottomInfo />
</article>
<!-- 课程分析 -->
<article ref="courseAnalysitRef" v-show="(cIndex === 2) && (projectInfo.existCourse == 1)" style="padding-top: 8px;">
<CourseTimesStat :totalSize="courseInfo.totalSize" :maxDuration="courseInfo.pCourseTotalTime" :avgDuration="courseInfo.pCourseAvg" :processDataObj="processDataObj"></CourseTimesStat>
<CommonSplitLine></CommonSplitLine>
<CommonTitle title="课程列表"></CommonTitle>
<CourseTimesList :dataList="courseInfo.pCourseList"></CourseTimesList>
<CommonBottomInfo :class="{'fixed-bottom-info': needFixedBottomInfo}"></CommonBottomInfo>
<article
v-show="cIndex === 2 && projectInfo.existCourse == 1"
ref="courseAnalysitRef"
style="padding-top: 8px"
回归
>
<CourseTimesStat
:total-size="courseInfo.totalSize"
:max-duration="courseInfo.pCourseTotalTime"
:avg-duration="courseInfo.pCourseAvg"
:process-data-obj="processDataObj"
/>
<CommonSplitLine />
<CommonTitle title="课程列表" />
<CourseTimesList :data-list="courseInfo.pCourseList" />
<CommonBottomInfo :class="{ 'fixed-bottom-info': needFixedBottomInfo }" />
</article>
<!-- 考试分析 -->
<article v-show="(cIndex === 3) && (projectInfo.existExam == 1)">
<CommonCard :cardList="examCardList"></CommonCard>
<CommonSplitLine></CommonSplitLine>
<article v-show="cIndex === 3 && projectInfo.existExam == 1">
<CommonCard :card-list="examCardList" />
<CommonSplitLine />
<div v-if="projectInfo.containOfficialFlag">
<CommonTitle title="完成项目考试次数情况"></CommonTitle>
<ChartColumnVerticalTimes :dataList="(generalExamData.examTimesList || []).slice(0, 5)" id="chartCourseTimesId" :colors="colors"></ChartColumnVerticalTimes>
<CommonTitle title="完成项目考试次数情况" />
<ChartColumnVerticalTimes
id="chartCourseTimesId"
:data-list="(generalExamData.examTimesList || []).slice(0, 5)"
:colors="colors"
/>
<!-- <ShowAll v-show="generalExamData.examTimesList.length" @action="gotoPage('/examtimes')" class="mt-10"></ShowAll> -->
<ShowAll v-show="generalExamData && generalExamData.examTimesList.length > 5" @action="gotoPage('/examtimes')" class="mt-10"></ShowAll>
<CommonSplitLine></CommonSplitLine>
<CommonTitle title="完成项目考试分数情况"></CommonTitle>
<ChartColumnVerticalScore id="chartCourseScoreId" :dataList="(generalExamData.examScoreList || []).slice(0, 5)"></ChartColumnVerticalScore>
<ShowAll v-show="generalExamData.examScoreList && generalExamData.examScoreList.length > 5" @action="gotoPage('/examscore')" class="mt-10"></ShowAll>
<CommonSplitLine></CommonSplitLine>
<ShowAll
v-show="generalExamData && generalExamData.examTimesList.length > 5"
class="mt-10"
@action="gotoPage('/examtimes')"
/>
<CommonSplitLine />
<CommonTitle title="完成项目考试分数情况" />
<ChartColumnVerticalScore
id="chartCourseScoreId"
:data-list="(generalExamData.examScoreList || []).slice(0, 5)"
/>
<ShowAll
v-show="
generalExamData.examScoreList &&
generalExamData.examScoreList.length > 5
"
class="mt-10"
@action="gotoPage('/examscore')"
/>
<CommonSplitLine />
</div>
<CommonTitle title="考试列表"></CommonTitle>
<ExamList :dataList="examInfoList"></ExamList>
<CommonBottomInfo :class="{'fixed-bottom-info': !projectInfo.containOfficialFlag && examInfoList.length < 4}"></CommonBottomInfo>
<CommonTitle title="考试列表" />
<ExamList :data-list="examInfoList" />
<CommonBottomInfo
:class="{
'fixed-bottom-info':
!projectInfo.containOfficialFlag && examInfoList.length < 4,
}"
/>
</article>
<!-- 学习效果分析 -->
<article v-show="(cIndex === 4) && (projectInfo.existEffect == 1)">
<CommonCard :needBG="needBG" :cardList="effectCardList"></CommonCard>
<CommonSplitLine></CommonSplitLine>
<CommonTitle title="不同学历培训前后正确率对比"></CommonTitle>
<ChartColumnVerticalTC :dataList="studyEffect.educationEffectList || []" id="chartColumnVerticalTC"></ChartColumnVerticalTC>
<CommonSplitLine style="margin-top: 10px;"></CommonSplitLine>
<CommonTitle title="培训前后知识点掌握情况"></CommonTitle>
<ChartColumnHorizontalTC :dataList="(studyEffect.knowledgeEffectList || []).slice(0, 5)" id="ChartColumnVerticalTC2"></ChartColumnHorizontalTC>
<ShowAll v-show="studyEffect.knowledgeEffectList && studyEffect.knowledgeEffectList.length > 5" @action="gotoPage('/klgpoint')" class="mt-10"></ShowAll>
<CommonBottomInfo></CommonBottomInfo>
<article v-show="cIndex === 4 && projectInfo.existEffect == 1">
<CommonCard
:need-b-g="needBG"
:card-list="effectCardList"
/>
<CommonSplitLine />
<CommonTitle title="不同学历培训前后正确率对比" />
<ChartColumnVerticalTC
id="chartColumnVerticalTC"
:data-list="studyEffect.educationEffectList || []"
/>
<CommonSplitLine style="margin-top: 10px" />
<CommonTitle title="培训前后知识点掌握情况" />
<ChartColumnHorizontalTC
id="ChartColumnVerticalTC2"
:data-list="(studyEffect.knowledgeEffectList || []).slice(0, 5)"
/>
<ShowAll
v-show="
studyEffect.knowledgeEffectList &&
studyEffect.knowledgeEffectList.length > 5
"
class="mt-10"
@action="gotoPage('/klgpoint')"
/>
<CommonBottomInfo />
</article>
<PicaArea v-show="isShowArea" @confirm="areaConfirm" @cancel="areaCancel" :projectId="projectId" :token="token"></PicaArea>
<CommonLoading v-show="false"></CommonLoading>
<PopTips :tipsContent="tipsContent" @clickTips="clickTips" v-show="isShowTips"></PopTips>
<Loading v-show="isShowLoading"></Loading>
<PicaArea
v-show="isShowArea"
:project-id="projectId"
:token="token"
@confirm="areaConfirm"
@cancel="areaCancel"
/>
<CommonLoading v-show="false" />
<PopTips
v-show="isShowTips"
:tips-content="tipsContent"
@clickTips="clickTips"
/>
<Loading v-show="isShowLoading" />
</section>
</template>
<script>
const cookies = require("cookie-universal")();
import {
goPageByNative
} from "@/utils";
import { mapGetters, mapActions } from "vuex";
const cookies = require('cookie-universal')();
import { goPageByNative } from '@/utils';
import { mapGetters, mapActions } from 'vuex';
import {
getAreaOrOrgList,
getUserAnalysis,
......@@ -103,47 +218,41 @@ import {
getGeneralPersonal,
getGeneralCourse,
getGeneralExam,
getProjectInfo,
getGeneralExamList,
getStudyEffect,
} from "@/service";
import CommonHeader from "@/components/common/common-header";
import CommonTitle from "@/components/common/common-title";
import CommonTitleWithWhat from "@/components/common/common-title-with-what";
import CommonTitleWithBtn from "@/components/common/common-title-with-btn";
import CommonLoading from "@/components/common/common-loading";
import CommonTaps from "@/components/common/common-tabs";
import CommonSwiperItem from "@/components/common/common-swiper-item";
import CommonSplitLine from "@/components/common/common-split-line";
import RankingList from "@/components/bussiness/ranking-item";
import ShowAll from "@/components/common/common-show-all";
import CommonBottomInfo from "@/components/common/common-bottom-info";
import RankingItemDays from "@/components/bussiness/ranking-item-days";
import ChartPie from "@/components/bussiness/charts/chart-pie";
import ChartPieEdu from "@/components/bussiness/charts/chart-pie-edu";
import ChartPieTitle from "@/components/bussiness/charts/chart-pie-title";
import ChartColumnStack from "@/components/bussiness/charts/chart-column-stack";
import ChartColumnVerticalTimes from "@/components/bussiness/charts/chart-column-vertical-times";
import ChartColumnVerticalScore from "@/components/bussiness/charts/chart-column-vertical-score";
import ChartColumnVerticalTC from "@/components/bussiness/charts/chart-column-vertical-tc";
import ChartColumnHorizontalTC from "@/components/bussiness/charts/chart-column-horizontal-tc";
import PicaArea from "@/components/common/pica-area";
import PicaOrg from "@/components/common/pica-org";
import CommonAreaSelect from "@/components/common/common-area-select";
import ProcessBar from "@/components/common/pica-process";
import CourseTimesStat from "@/components/bussiness/course-times-stat";
import CourseTimesList from "@/components/bussiness/course-times-list";
import OrgDoctorList from "@/components/bussiness/org-doctor-list";
import ExamList from "@/components/bussiness/exam-list";
import PopTips from "@/components/bussiness/pop-tips";
import CommonCard from "@/components/common/common-card";
import Loading from "@/components/common/common-loading";
import {
getGeneralData
} from "@/service/index";
let timeOutId = null;
} from '@/service';
import CommonHeader from '@/components/common/common-header';
import CommonTitle from '@/components/common/common-title';
import CommonTitleWithWhat from '@/components/common/common-title-with-what';
import CommonTitleWithBtn from '@/components/common/common-title-with-btn';
import CommonLoading from '@/components/common/common-loading';
import CommonTaps from '@/components/common/common-tabs';
import CommonSwiperItem from '@/components/common/common-swiper-item';
import CommonSplitLine from '@/components/common/common-split-line';
import RankingList from '@/components/bussiness/ranking-item';
import ShowAll from '@/components/common/common-show-all';
import CommonBottomInfo from '@/components/common/common-bottom-info';
import RankingItemDays from '@/components/bussiness/ranking-item-days';
import ChartPie from '@/components/bussiness/charts/chart-pie';
import ChartPieEdu from '@/components/bussiness/charts/chart-pie-edu';
import ChartPieTitle from '@/components/bussiness/charts/chart-pie-title';
import ChartColumnStack from '@/components/bussiness/charts/chart-column-stack';
import ChartColumnVerticalTimes from '@/components/bussiness/charts/chart-column-vertical-times';
import ChartColumnVerticalScore from '@/components/bussiness/charts/chart-column-vertical-score';
import ChartColumnVerticalTC from '@/components/bussiness/charts/chart-column-vertical-tc';
import ChartColumnHorizontalTC from '@/components/bussiness/charts/chart-column-horizontal-tc';
import PicaArea from '@/components/common/pica-area';
import CommonAreaSelect from '@/components/common/common-area-select';
import CourseTimesStat from '@/components/bussiness/course-times-stat';
import CourseTimesList from '@/components/bussiness/course-times-list';
import OrgDoctorList from '@/components/bussiness/org-doctor-list';
import ExamList from '@/components/bussiness/exam-list';
import PopTips from '@/components/bussiness/pop-tips';
import CommonCard from '@/components/common/common-card';
import Loading from '@/components/common/common-loading';
import { getGeneralData } from '@/service/index';
export default {
components: {
CommonHeader,
......@@ -161,9 +270,7 @@ export default {
RankingItemDays,
ChartColumnStack,
PicaArea,
PicaOrg,
CommonAreaSelect,
ProcessBar,
CourseTimesStat,
CourseTimesList,
CommonCard,
......@@ -177,7 +284,16 @@ export default {
ChartColumnVerticalScore,
PopTips,
CommonTitleWithWhat,
Loading
Loading,
},
filters: {
shortName: function (value, length = 15, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append;
} else {
return value;
}
},
},
data() {
return {
......@@ -190,69 +306,70 @@ export default {
tipsContent: '',
areaName: '全部',
cIndex: 0,
colors: ["#39AF9A", "#FF9A4B", "#abb7bb", "#76d2d2"],
colors: ['#39AF9A', '#FF9A4B', '#abb7bb', '#76d2d2'],
needBG: true,
effectCardList: [{
effectCardList: [
{
count: 65,
unitName: "%",
description: "培训前正确率"
unitName: '%',
description: '培训前正确率',
},
{
count: 80,
unitName: "%",
description: "培训后正确率"
}
unitName: '%',
description: '培训后正确率',
},
],
allData: {},
studyRankList: [],
costRankList: [],
projectId: "",
token: "568E9A4C115F47649BDA1B0B70D4B4F9",
projectId: '',
token: '568E9A4C115F47649BDA1B0B70D4B4F9',
isOrgStat: false,
// 区域选择通用接口参数
queryParams: {
projectId: 374,
regionId: ""
regionId: '',
},
// 查询概况数据
queryGDParams: {
beginDate: "",
endDate: "",
beginDate: '',
endDate: '',
hospitalIdList: [],
originalFlag: 2, // 默认值2:1.查看原始数据 2.查看调整后的数据
projectId: 374,
regionId: "",
regionId: '',
timeFlag: 1,
pageNo: 0,
pageSize: 0,
sourceType: 1,
pageCfg: {
type: 1
}
type: 1,
},
},
echartsData: null,
analysisData: {
eduList: {
join: [],
finish: []
finish: [],
},
titleList: {
join: [],
finish: []
finish: [],
},
},
analysisEduData: [],
analysisTitleData: [],
CNTParams: {
projectId: 374,
regionId: ""
regionId: '',
},
hospitalCnt: 2,
isSingleOrg: false,
orgDoctorTabData: {
certUserList: [],
noCertUserList: [],
noJoinList: []
noJoinList: [],
},
projectInfo: {
projectName: '项目名称',
......@@ -262,12 +379,12 @@ export default {
existExam: 2, // 是否显示考试分析 1:显示 2:不显示
roleType: 0, // 0:普通人 1:内部管理员 2:项目负责人 3:次级负责人
status: 0, // 是否显示查看原始数据 1:显示 2:不显示
containOfficialFlag: 0 // 0: 无正式考考试 1: 有正式考考试
containOfficialFlag: 0, // 0: 无正式考考试 1: 有正式考考试
},
courseInfo: {
pCourseTotalTime: 0,
pCourseAvg: 0,
pCourseList: []
pCourseList: [],
},
generalExamData: {
beforeExamCount: 4,
......@@ -276,7 +393,7 @@ export default {
examTimesList: [],
examScoreList: [],
fiveExamScoreList: [],
tenExamScoreList: []
tenExamScoreList: [],
},
examCardList: [],
examInfoList: [],
......@@ -284,28 +401,17 @@ export default {
beforeRate: 0,
afterRate: 0,
educationEffectList: [],
knowledgeEffectList: []
},
processDataObj: {
knowledgeEffectList: [],
},
processDataObj: {},
needFixedBottomInfo: false,
};
},
filters: {
shortName: function (value, length = 15, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
} else {
return value
}
}
},
computed: {
...mapGetters({
orgList: "orgList",
areaDegree: "areaDegree",
originalFlag: "originalFlag"
orgList: 'orgList',
areaDegree: 'areaDegree',
originalFlag: 'originalFlag',
}),
},
asyncData() {
......@@ -313,14 +419,18 @@ export default {
},
created() {
if (process.client) {
this.token = (this.$route && this.$route.query && this.$route.query.token) || this.token;
this.projectId = (this.$route && this.$route.query && this.$route.query.projectId) || 374;
this.token =
(this.$route && this.$route.query && this.$route.query.token) ||
this.token;
this.projectId =
(this.$route && this.$route.query && this.$route.query.projectId) ||
374;
this.queryGDParams.projectId = this.projectId;
this.CNTParams.projectId = this.projectId;
this.queryParams.projectId = this.projectId;
if (this.$rocNative.isWeb) {
this.setUserToken(this.token);
cookies.set("lreporttoken", this.token);
cookies.set('lreporttoken', this.token);
this.setProjectId(this.projectId);
} else {
this.getUserInfo();
......@@ -333,7 +443,13 @@ export default {
this.getProjectInfo(this.queryParams);
}
window.addEventListener('scroll', () => { this.handleScroll() }, false);
window.addEventListener(
'scroll',
() => {
this.handleScroll();
},
false
);
},
methods: {
handleScroll() {
......@@ -350,7 +466,12 @@ export default {
var doc = document;
var docE = doc.documentElement;
var body = doc.body;
return docE && docE.clientHeight || body && body.offsetHeight || window.innerHeight || 0;
return (
(docE && docE.clientHeight) ||
(body && body.offsetHeight) ||
window.innerHeight ||
0
);
// return {
// 'width': docE && docE.clientWidth || body && body.offsetWidth || window.innerWidth || 0,
// 'height': docE && docE.clientHeight || body && body.offsetHeight || window.innerHeight || 0
......@@ -368,47 +489,51 @@ export default {
// getProjectInfo({
// projectId: this.projectId
// }).then(res => {
// if (res.code === "000000") {
// this.projectInfo = res.data;
getAreaOrOrgList(params).then(res => {
if (res.code === "000000") {
this.projectInfo = res.data.doctorInfoRep;
this.queryGDParams.originalFlag = res.data.doctorInfoRep.originalFlag;
if(!this.queryGDParams.regionId) {
this.setOriginalFlag(res.data.doctorInfoRep.originalFlag);
}
// 如果直接是5级,则将其进行拆分(区域ID与机构ID)
let regionId = '', orgId = '', firstData = res.data.list[0];
if(firstData.degree == 5) {
let regionIdAndOrgId = firstData.id, lindex = regionIdAndOrgId.lastIndexOf('_');
regionId = regionIdAndOrgId.slice(0, lindex);
orgId = regionIdAndOrgId.slice(lindex + 1);
} else {
regionId = firstData.id || '';
}
this.queryGDParams.regionId = regionId;
this.CNTParams.regionId = regionId;
let proviceList = (res.data && res.data.list) || [];
let degree = (proviceList.length && proviceList[0].degree) || 0;
this.areaName = (proviceList.length && proviceList[0].label) || '全部';
this.queryParams.projectId = this.projectId;
this.queryParams.regionId = regionId;
if(proviceList.length && res.data.containHospitalFlag == 1) {
proviceList[0].containHospitalFlag = 1;
}
this.setProvinceList(proviceList);
this.setAreaDegree(degree);
if(firstData.degree == 5) {
this.isSingleOrg = true;
this.queryGDParams.hospitalIdList = [];
this.queryGDParams.hospitalIdList.push(orgId);
this.getGeneralPersonal(this.queryGDParams);
this.otherInterface();
} else {
this.getHospitalsCNT(this.CNTParams);
}
}
});
// if (res.code === "000000") {
// this.projectInfo = res.data;
getAreaOrOrgList(params).then((res) => {
if (res.code === '000000') {
this.projectInfo = res.data.doctorInfoRep;
this.queryGDParams.originalFlag = res.data.doctorInfoRep.originalFlag;
if (!this.queryGDParams.regionId) {
this.setOriginalFlag(res.data.doctorInfoRep.originalFlag);
}
// 如果直接是5级,则将其进行拆分(区域ID与机构ID)
let regionId = '',
orgId = '';
const firstData = res.data.list[0];
if (firstData.degree == 5) {
const regionIdAndOrgId = firstData.id,
lindex = regionIdAndOrgId.lastIndexOf('_');
regionId = regionIdAndOrgId.slice(0, lindex);
orgId = regionIdAndOrgId.slice(lindex + 1);
} else {
regionId = firstData.id || '';
}
this.queryGDParams.regionId = regionId;
this.CNTParams.regionId = regionId;
const proviceList = (res.data && res.data.list) || [];
const degree = (proviceList.length && proviceList[0].degree) || 0;
this.areaName =
(proviceList.length && proviceList[0].label) || '全部';
this.queryParams.projectId = this.projectId;
this.queryParams.regionId = regionId;
if (proviceList.length && res.data.containHospitalFlag == 1) {
proviceList[0].containHospitalFlag = 1;
}
this.setProvinceList(proviceList);
this.setAreaDegree(degree);
if (firstData.degree == 5) {
this.isSingleOrg = true;
this.queryGDParams.hospitalIdList = [];
this.queryGDParams.hospitalIdList.push(orgId);
this.getGeneralPersonal(this.queryGDParams);
this.otherInterface();
} else {
this.getHospitalsCNT(this.CNTParams);
}
}
});
// }
// });
},
......@@ -417,16 +542,19 @@ export default {
otherInterface() {
setTimeout(() => {
this.getUserAnalysis(this.queryGDParams);
this.projectInfo.existCourse == 1 && this.getGeneralCourse(this.queryGDParams);
this.projectInfo.existExam == 1 && this.getGeneralExam(this.queryGDParams);
this.projectInfo.existEffect == 1 && this.getStudyEffect(this.queryGDParams);
this.projectInfo.existCourse == 1 &&
this.getGeneralCourse(this.queryGDParams);
this.projectInfo.existExam == 1 &&
this.getGeneralExam(this.queryGDParams);
this.projectInfo.existEffect == 1 &&
this.getStudyEffect(this.queryGDParams);
}, 100);
},
// 根据地区查询地区下是否有机构
getHospitalsCNT(params) {
getHospitalsCNT(params).then(res => {
if (res.code === "000000") {
getHospitalsCNT(params).then((res) => {
if (res.code === '000000') {
this.hospitalCnt = res.data.hospitalCnt;
this.isSingleOrg = res.data.hospitalCnt === 1;
if (this.isSingleOrg) {
......@@ -444,8 +572,8 @@ export default {
// 请求单个机构下的数据(总体概述的数据)
getGeneralPersonal(params) {
getGeneralPersonal(params).then(res => {
if (res.code === "000000") {
getGeneralPersonal(params).then((res) => {
if (res.code === '000000') {
this.isShowLoading = false;
this.allData = res.data;
this.studyRankList = this.allData.studyRank || [];
......@@ -463,11 +591,11 @@ export default {
// 请求多个机构下的数据
getGeneralData(queryData) {
getGeneralData(queryData).then(res => {
if (res.code === "000000") {
getGeneralData(queryData).then((res) => {
if (res.code === '000000') {
this.isShowLoading = false;
this.allData = res.data;
this.studyRankList = this.allData.studyRank || []
this.studyRankList = this.allData.studyRank || [];
this.costRankList = this.allData.costRank || [];
this.echartsData = res.data.eduData;
}
......@@ -476,8 +604,8 @@ export default {
// 人群分析
getUserAnalysis(queryData) {
getUserAnalysis(queryData).then(res => {
if (res.code === "000000") {
getUserAnalysis(queryData).then((res) => {
if (res.code === '000000') {
this.analysisData = res.data;
this.analysisEduData = res.data.eduList.join;
this.analysisTitleData = res.data.titleList.join;
......@@ -488,52 +616,53 @@ export default {
// 考试分析
getGeneralExam(queryData) {
// 上面三个图标数据
getGeneralExam(queryData).then(res => {
if (res.code === "000000") {
getGeneralExam(queryData).then((res) => {
if (res.code === '000000') {
this.generalExamData = res.data;
this.setExamTimesList(res.data.examTimesList)
this.setExamScoreList(res.data.examScoreList)
this.examCardList = [{
this.setExamTimesList(res.data.examTimesList);
this.setExamScoreList(res.data.examScoreList);
this.examCardList = [
{
count: res.data.afterExamCount,
unitName: "门",
description: "正式考试数"
unitName: '门',
description: '正式考试数',
},
{
count: res.data.beforeExamCount,
unitName: "门",
description: "模拟考试数"
unitName: '门',
description: '模拟考试数',
},
{
count: res.data.examTitleCount,
unitName: "道",
description: "所有考题数"
}
unitName: '道',
description: '所有考题数',
},
];
}
});
// 下面一个列表数据
getGeneralExamList(queryData).then(res => {
if (res.code === "000000") {
this.examInfoList = res.data.examInfoList || []
getGeneralExamList(queryData).then((res) => {
if (res.code === '000000') {
this.examInfoList = res.data.examInfoList || [];
}
});
},
// 课程数据
getGeneralCourse(params) {
getGeneralCourse(params).then(res => {
if (res.code === "000000") {
getGeneralCourse(params).then((res) => {
if (res.code === '000000') {
this.processDataObj = {
maxDuration: res.data.pCourseTotalTime,
avgDuration: res.data.pCourseAvg
}
avgDuration: res.data.pCourseAvg,
};
this.processDataObj.maxDuration = res.data.pCourseTotalTime;
this.processDataObj.avgDuration = res.data.pCourseAvg;
this.courseInfo = res.data;
let viewportHeight = this.getViewportHeight();
let courseLength = res.data.pCourseList.length;
const viewportHeight = this.getViewportHeight();
const courseLength = res.data.pCourseList.length;
// 上面的高度 468 每一条数据的高度 60
if (viewportHeight > (468 + (courseLength - 1) * 60)) {
if (viewportHeight > 468 + (courseLength - 1) * 60) {
this.needFixedBottomInfo = true;
}
}
......@@ -542,8 +671,8 @@ export default {
// 学习效果分析
getStudyEffect(params) {
getStudyEffect(params).then(res => {
if (res.code === "000000") {
getStudyEffect(params).then((res) => {
if (res.code === '000000') {
this.studyEffect = res.data;
this.effectCardList[0].count = (res.data.beforeRate * 100).toFixed(1);
this.effectCardList[1].count = (res.data.afterRate * 100).toFixed(1);
......@@ -564,10 +693,23 @@ export default {
// 确认选择区域
areaConfirm(selData) {
console.log(selData);
if (selData.newOrgName || selData.townName || selData.countyName || selData.cityName || selData.provinceName) {
this.areaName = this.shortName(selData.newOrgName || selData.townName || selData.countyName || selData.cityName || selData.provinceName, 18)
}
if(selData.areaDegree == 5) {
if (
selData.newOrgName ||
selData.townName ||
selData.countyName ||
selData.cityName ||
selData.provinceName
) {
this.areaName = this.shortName(
selData.newOrgName ||
selData.townName ||
selData.countyName ||
selData.cityName ||
selData.provinceName,
18
);
}
if (selData.areaDegree == 5) {
this.orgConfirmNew(selData);
return;
}
......@@ -577,7 +719,6 @@ export default {
this.getHospitalsCNT(this.CNTParams);
this.isShowArea = false;
this.setAreaDegree(selData.areaDegree);
},
// 取消选择区域
......@@ -587,9 +728,11 @@ export default {
// 确认选择机构
orgConfirmNew(selData) {
let regionIdAndOrgId = selData.regionId, lindex = regionIdAndOrgId.lastIndexOf('_');
let regionId = regionIdAndOrgId.slice(0, lindex), orgId = regionIdAndOrgId.slice(lindex + 1);
let hospitalIds = [orgId];
const regionIdAndOrgId = selData.regionId,
lindex = regionIdAndOrgId.lastIndexOf('_');
const regionId = regionIdAndOrgId.slice(0, lindex),
orgId = regionIdAndOrgId.slice(lindex + 1);
const hospitalIds = [orgId];
this.isShowArea = false;
this.queryGDParams.regionId = regionId;
this.CNTParams.regionId = regionId;
......@@ -599,7 +742,7 @@ export default {
return;
}
if (hospitalIds.length === 1) {
this.hospitalCnt = 1 // todo
this.hospitalCnt = 1; // todo
this.orgDoctorTabData.certUserList = [];
this.orgDoctorTabData.noCertUserList = [];
this.orgDoctorTabData.noJoinList = [];
......@@ -619,40 +762,44 @@ export default {
// 通用跳转页面
gotoPage(subUrl, hasCert) {
let subUrlAndParams = `${subUrl}?token=${this.token}&projectId=${this.queryGDParams.projectId}&regionId=${this.queryGDParams.regionId}&hospitalIdList=${this.queryGDParams.hospitalIdList.join(',')}&originalFlag=${this.originalFlag}`
let subUrlAndParams = `${subUrl}?token=${this.token}&projectId=${
this.queryGDParams.projectId
}&regionId=${
this.queryGDParams.regionId
}&hospitalIdList=${this.queryGDParams.hospitalIdList.join(
','
)}&originalFlag=${this.originalFlag}`;
if (hasCert) {
subUrlAndParams += `&certFlag=${this.projectInfo.certFlag}`
subUrlAndParams += `&certFlag=${this.projectInfo.certFlag}`;
}
if (this.$rocNative.isWeb) {
this.$router.push(subUrlAndParams);
} else {
let nativeUrl = `/lreport_ssr${subUrlAndParams}`
const nativeUrl = `/lreport_ssr${subUrlAndParams}`;
goPageByNative(this, nativeUrl);
}
},
// 人员学历情况切换按钮
analysisEduClick(index) {
this.analysisEduData = this.analysisData.eduList[
index ? "finish" : "join"
] || [];
this.analysisEduData =
this.analysisData.eduList[index ? 'finish' : 'join'] || [];
this.$forceUpdate();
},
// 人员职称情况切换按钮
analysisTitleClick(index) {
this.analysisTitleData = this.analysisData.titleList[
index ? "finish" : "join"
] || [];
this.analysisTitleData =
this.analysisData.titleList[index ? 'finish' : 'join'] || [];
this.$forceUpdate();
},
// 与原生交互,获取用户信息
getUserInfo() {
this.$rocNative.getUserInfo &&
this.$rocNative.getUserInfo().then(params => {
this.$rocNative.getUserInfo().then((params) => {
this.token = params.userToken; // 测试用时注释掉
cookies.set("lreporttoken", this.token);
cookies.set('lreporttoken', this.token);
this.setUserToken(this.token);
this.setProjectId(this.projectId);
this.getProjectInfo(this.queryParams);
......@@ -661,48 +808,48 @@ export default {
// 弹出提示信息一
tipsRankingItemClick() {
this.tipsContent = '在线项目完成天数=完成项目时间-开始参与项目时间'
this.isShowTips = true
this.tipsContent = '在线项目完成天数=完成项目时间-开始参与项目时间';
this.isShowTips = true;
},
// 弹出提示信息二
tipsSwiperClick(tipsContent) {
this.tipsContent = tipsContent; //'是已获证人数/应参与人数*100%'
this.isShowTips = true
this.tipsContent = tipsContent; // '是已获证人数/应参与人数*100%'
this.isShowTips = true;
},
// 关闭提示信息
clickTips() {
this.isShowTips = false
this.isShowTips = false;
},
// 文本截断
shortName: function (value, length = 15, append = '...') {
if (value && value.length > length) {
return value.substring(0, length) + append
return value.substring(0, length) + append;
} else {
return value
return value;
}
},
// 映射Store中的Actions
...mapActions({
setOrgList: "setOrgList",
setProjectId: "setProjectId",
setRegionId: "setRegionId",
setUserToken: "setUserToken",
setProvinceList: "setProvinceList",
setExamTimesList: "setExamTimesList",
setExamScoreList: "setExamScoreList",
setAreaDegree: "setAreaDegree",
setOrgList: 'setOrgList',
setProjectId: 'setProjectId',
setRegionId: 'setRegionId',
setUserToken: 'setUserToken',
setProvinceList: 'setProvinceList',
setExamTimesList: 'setExamTimesList',
setExamScoreList: 'setExamScoreList',
setAreaDegree: 'setAreaDegree',
setCurrentOrgList: 'setCurrentOrgList',
setOriginalFlag: 'setOriginalFlag'
})
}
setOriginalFlag: 'setOriginalFlag',
}),
},
};
</script>
<style lang="less" scoped>
<style lang="scss" scoped>
.container {
margin: 0 auto;
font-size: 17px;
......@@ -715,7 +862,7 @@ export default {
.m1 {
width: 100%;
>div {
> div {
width: 100%;
}
}
......@@ -734,5 +881,4 @@ export default {
padding-top: 94px;
}
}
</style>
<template>
<section class="klg-point-wrapper">
<CommonHeader title="培训前后知识点掌握情况"></CommonHeader>
<TitleKLGPoint :title="title"></TitleKLGPoint>
<TipsInfo :content="tipsContent"></TipsInfo>
<ChartColumnHorizontalTCLong :dataList="knowledgeEffectList" class="mt-10"></ChartColumnHorizontalTCLong>
<Loading v-show="isShowLoading"></Loading>
<CommonHeader title="培训前后知识点掌握情况" />
<TitleKLGPoint :title="title" />
<TipsInfo :content="tipsContent" />
<ChartColumnHorizontalTCLong
:data-list="knowledgeEffectList"
class="mt-10"
/>
<Loading v-show="isShowLoading" />
</section>
</template>
<script>
const cookies = require("cookie-universal")();
import { getStudyEffect } from "@/service";
const cookies = require('cookie-universal')();
import { getStudyEffect } from '@/service';
import CommonHeader from "@/components/common/common-header";
import TitleKLGPoint from "@/components/bussiness/title-klg-point";
import TipsInfo from '@/components/bussiness/tips-info'
import ChartColumnHorizontalTCLong from "@/components/bussiness/charts/chart-column-horizontal-tc-long";
import Loading from "@/components/common/common-loading";
import { mapGetters } from "vuex";
import CommonHeader from '@/components/common/common-header';
import TitleKLGPoint from '@/components/bussiness/title-klg-point';
import TipsInfo from '@/components/bussiness/tips-info';
import ChartColumnHorizontalTCLong from '@/components/bussiness/charts/chart-column-horizontal-tc-long';
import Loading from '@/components/common/common-loading';
import { mapGetters } from 'vuex';
export default {
components: {
......@@ -24,28 +27,28 @@ export default {
TitleKLGPoint,
ChartColumnHorizontalTCLong,
TipsInfo,
Loading
Loading,
},
data() {
return {
isShowLoading: true,
title: "共0个知识点",
title: '共0个知识点',
token: '',
queryGDParams: {
appSelectType: 2, //考试分析(1考试次数全部2考试分数全部) 学习效果分析(1正确率对比全部2知识点对比全部)
beginDate: "",
endDate: "",
appSelectType: 2, // 考试分析(1考试次数全部2考试分数全部) 学习效果分析(1正确率对比全部2知识点对比全部)
beginDate: '',
endDate: '',
hospitalIdList: [],
originalFlag: 2,
projectId: 374,
regionId: "",
regionId: '',
timeFlag: 1,
pageNo: 0,
pageSize: 0,
sourceType: 1,
pageCfg: {
type: 1
}
type: 1,
},
},
tipsContent: '报告数据来源仅包含摸底考和正式考的课程培训',
knowledgeEffectList: [],
......@@ -53,18 +56,19 @@ export default {
},
computed: {
...mapGetters({
originalFlag: "originalFlag",
originalFlag: 'originalFlag',
}),
},
created() {
if (process.client) {
if (this.$route && this.$route.query) {
let cQuery = this.$route.query;
let hospitalIdList = cQuery.hospitalIdList || ''
this.queryGDParams.projectId = cQuery.projectId || "";
this.queryGDParams.regionId = cQuery.regionId || "";
this.queryGDParams.hospitalIdList = hospitalIdList && hospitalIdList.split(',') || [];
cookies.set("lreporttoken", cQuery.token || "");
const cQuery = this.$route.query;
const hospitalIdList = cQuery.hospitalIdList || '';
this.queryGDParams.projectId = cQuery.projectId || '';
this.queryGDParams.regionId = cQuery.regionId || '';
this.queryGDParams.hospitalIdList =
(hospitalIdList && hospitalIdList.split(',')) || [];
cookies.set('lreporttoken', cQuery.token || '');
this.queryGDParams.originalFlag = cQuery.originalFlag;
this.getStudyEffect(this.queryGDParams);
}
......@@ -73,21 +77,21 @@ export default {
methods: {
// 学习效果分析
async getStudyEffect(params) {
await getStudyEffect(params).then(res => {
if (res.code === "000000") {
await getStudyEffect(params).then((res) => {
if (res.code === '000000') {
this.isShowLoading = false;
this.knowledgeEffectList = res.data.knowledgeEffectList || [];
this.title = `共${this.knowledgeEffectList.length}个知识点`;
}
});
}
}
},
},
};
</script>
<style lang="less" scoped>
.klg-point-wrapper {
.mt-10 {
margin-top: 20px !important;
}
<style lang="scss" scoped>
.klg-point-wrapper {
.mt-10 {
margin-top: 20px !important;
}
</style>
\ No newline at end of file
}
</style>
......@@ -2,41 +2,47 @@
<!-- 专项合作首页: 我参与的,其它项目 -->
<div class="pro-list-container">
<!-- <CommonHeader :title="title"></CommonHeader> -->
<CommonHeaderNew borderStyle="1px solid #e7e7e7" :title="title" :isShowKf="isShowKf"></CommonHeaderNew>
<CoopListItem style="margin: 10px 0;" :dataList="projectList"></CoopListItem>
<Loading v-if="showLoading"/>
<CommonHeaderNew
border-style="1px solid #e7e7e7"
:title="title"
:is-show-kf="isShowKf"
/>
<CoopListItem
style="margin: 10px 0"
:data-list="projectList"
/>
<Loading v-if="showLoading" />
</div>
</template>
<script>
import CommonHeaderNew from "@/components/common/common-header-new";
import CoopListItem from "@/components/bussiness/coop-list-item";
import Loading from "@/components/common/common-loading";
import { getProjectList } from "@/service";
import CommonHeaderNew from '@/components/common/common-header-new';
import CoopListItem from '@/components/bussiness/coop-list-item';
import Loading from '@/components/common/common-loading';
import { getProjectList } from '@/service';
import { BASE_URL } from '@/utils/enumerate';
const { NUXT_ENV_APP } = process.env;
const cookies = require("cookie-universal")();
const cookies = require('cookie-universal')();
export default {
components: {
CommonHeaderNew,
CoopListItem,
Loading,
},
data() {
return {
token: 'D8E0930EAB3E481B9CCA2ECBD2146BAD',
showLoading: true,
title: "学情报告",
title: '学情报告',
projectList: [],
isShowKf: true
isShowKf: true,
};
},
components: {
CommonHeaderNew,
CoopListItem,
Loading
},
created() {
if (process.client) {
var _this = this;
if (this.$rocNative.isWeb) {
cookies.set("lreporttoken", _this.token);
cookies.set('lreporttoken', _this.token);
_this.getProjectList();
} else {
_this.getUserInfo();
......@@ -44,34 +50,35 @@ export default {
}
},
mounted() {
this.$sendBuriedData && this.$sendBuriedData({
action: 'ACTION_WEB_ENTER',
component_tag: `467`,
class_name: `learning_report`,
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`
});
this.$sendBuriedData &&
this.$sendBuriedData({
action: 'ACTION_WEB_ENTER',
component_tag: '467',
class_name: 'learning_report',
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`,
});
},
methods: {
// 与原生交互,获取用户信息
getUserInfo() {
this.$rocNative.getUserInfo &&
this.$rocNative.getUserInfo().then(params => {
this.$rocNative.getUserInfo().then((params) => {
this.token = params.userToken;
cookies.set("lreporttoken", this.token);
cookies.set('lreporttoken', this.token);
this.getProjectList();
});
},
// 课程数据
getProjectList() {
let params = {
token: this.token
}
getProjectList(params).then(res => {
const params = {
token: this.token,
};
getProjectList(params).then((res) => {
this.showLoading = true;
if (res.code === "000000") {
this.projectList = res.data && res.data.data || [];
if (res.code === '000000') {
this.projectList = (res.data && res.data.data) || [];
setTimeout(() => {
this.showLoading = false;
}, 100);
......@@ -81,12 +88,9 @@ export default {
// })
}
});
}
}
},
},
};
</script>
<style lang="less" scoped>
</style>
<style lang="scss" scoped></style>
<template>
<section class="rank-days-wrapper">
<CommonHeader title="完成天数排名"></CommonHeader>
<CommonTitleWithDropdown :title="listTitle" @selectSortItem="selectSortItem"></CommonTitleWithDropdown>
<RankingItemDays class="pdt-50" :rankList="rankList"></RankingItemDays>
<CommonNoMore v-if="rankList.length >= 10" class="mt-10"></CommonNoMore>
<Loading v-show="isShowLoading"></Loading>
<CommonHeader title="完成天数排名" />
<CommonTitleWithDropdown :title="listTitle" />
<RankingItemDays
class="pdt-50"
:rank-list="rankList"
/>
<CommonNoMore
v-if="rankList.length >= 10"
class="mt-10"
/>
<Loading v-show="isShowLoading" />
</section>
</template>
<script>
const cookies = require("cookie-universal")();
import { getStudyTimeData } from "@/service";
const cookies = require('cookie-universal')();
import { getStudyTimeData } from '@/service';
import CommonHeader from "@/components/common/common-header";
import CommonTitleWithDropdown from "@/components/common/common-title-with-dropdown";
import RankingItemDays from "@/components/bussiness/ranking-item-days";
import CommonNoMore from "@/components/common/common-no-more";
import Loading from "@/components/common/common-loading";
import { mapGetters } from "vuex";
import CommonHeader from '@/components/common/common-header';
import CommonTitleWithDropdown from '@/components/common/common-title-with-dropdown';
import RankingItemDays from '@/components/bussiness/ranking-item-days';
import CommonNoMore from '@/components/common/common-no-more';
import Loading from '@/components/common/common-loading';
import { mapGetters } from 'vuex';
export default {
components: {
......@@ -24,7 +30,7 @@ export default {
CommonTitleWithDropdown,
RankingItemDays,
CommonNoMore,
Loading
Loading,
},
data() {
return {
......@@ -32,37 +38,37 @@ export default {
listTitle: '共0条数据',
rankList: [],
queryGDParams: {
beginDate: "",
endDate: "",
beginDate: '',
endDate: '',
hospitalIdList: [],
originalFlag: 2, // 默认值0:0不查看原始数据
projectId: 374,
regionId: "",
regionId: '',
timeFlag: 1,
pageNo: 0,
pageSize: 0,
sourceType: 1,
pageCfg: {
type: 1
}
type: 1,
},
},
};
},
computed: {
...mapGetters({
originalFlag: "originalFlag",
originalFlag: 'originalFlag',
}),
},
created() {
if (process.client) {
let cQuery = this.$route.query;
let hospitalIdList = cQuery.hospitalIdList || "";
this.queryGDParams.projectId = cQuery.projectId || "";
this.queryGDParams.regionId = cQuery.regionId || "";
const cQuery = this.$route.query;
const hospitalIdList = cQuery.hospitalIdList || '';
this.queryGDParams.projectId = cQuery.projectId || '';
this.queryGDParams.regionId = cQuery.regionId || '';
this.queryGDParams.hospitalIdList =
(hospitalIdList && hospitalIdList.split(",")) || [];
(hospitalIdList && hospitalIdList.split(',')) || [];
// cookies.remove("token");
cookies.set("lreporttoken", cQuery.token || "");
cookies.set('lreporttoken', cQuery.token || '');
this.queryGDParams.originalFlag = cQuery.originalFlag;
this.getStudyTimeData(this.queryGDParams);
}
......@@ -70,30 +76,24 @@ export default {
methods: {
// 完成天数排名
async getStudyTimeData(params) {
await getStudyTimeData(params).then(res => {
if (res.code === "000000") {
await getStudyTimeData(params).then((res) => {
if (res.code === '000000') {
this.isShowLoading = false;
this.rankList = res.data.costRank;
// this.listTitle = `共${this.rankList.length}个省`
this.listTitle = `共${this.rankList.length}条数据`
this.listTitle = `共${this.rankList.length}条数据`;
}
});
},
selectSortItem(type) {
// this.queryGDParams.pageCfg.type = type;
// this.getStudyTimeData(this.queryGDParams);
}
}
},
};
</script>
<style lang="less" scoped>
.rank-days-wrapper {
.pdt-50 {
padding-top: 50px;
}
.mt-10 {
margin-top: 10px !important;
}
<style lang="scss" scoped>
.rank-days-wrapper {
.pdt-50 {
padding-top: 50px;
}
.mt-10 {
margin-top: 10px !important;
}
</style>
\ No newline at end of file
}
</style>
<template>
<section class="rank-edu-wrapper">
<CommonHeader title="项目情况排名"></CommonHeader>
<CommonTitleWithDropdown :dataList="dropdownList" :title="title" :needRightBtn="needRightBtn" @selectSortItem="selectSortItem"></CommonTitleWithDropdown>
<RankingList class="pdt-50" :certFlag="certFlag" :rankList="rankList"></RankingList>
<CommonNoMore v-if="rankList.length >= 10" class="mt-10"></CommonNoMore>
<Loading v-show="isShowLoading"></Loading>
<CommonHeader title="项目情况排名" />
<CommonTitleWithDropdown
:data-list="dropdownList"
:title="title"
:need-right-btn="needRightBtn"
@selectSortItem="selectSortItem"
/>
<RankingList
class="pdt-50"
:cert-flag="certFlag"
:rank-list="rankList"
/>
<CommonNoMore
v-if="rankList.length >= 10"
class="mt-10"
/>
<Loading v-show="isShowLoading" />
</section>
</template>
<script>
const cookies = require("cookie-universal")();
import { getStudyRankData } from "@/service";
const cookies = require('cookie-universal')();
import { getStudyRankData } from '@/service';
import CommonHeader from "@/components/common/common-header";
import CommonTitleWithDropdown from "@/components/common/common-title-with-dropdown";
import CommonNoMore from "@/components/common/common-no-more";
import RankingList from "@/components/bussiness/ranking-item";
import Loading from "@/components/common/common-loading";
import { mapGetters } from "vuex";
import CommonHeader from '@/components/common/common-header';
import CommonTitleWithDropdown from '@/components/common/common-title-with-dropdown';
import CommonNoMore from '@/components/common/common-no-more';
import RankingList from '@/components/bussiness/ranking-item';
import Loading from '@/components/common/common-loading';
import { mapGetters } from 'vuex';
export default {
components: {
......@@ -24,7 +36,7 @@ export default {
CommonTitleWithDropdown,
CommonNoMore,
RankingList,
Loading
Loading,
},
data() {
return {
......@@ -33,60 +45,69 @@ export default {
rankList: [],
needRightBtn: true,
queryGDParams: {
beginDate: "",
endDate: "",
beginDate: '',
endDate: '',
hospitalIdList: [],
originalFlag: 2, // 默认值0:0不查看原始数据
projectId: 374,
regionId: "",
regionId: '',
timeFlag: 1,
pageNo: 0,
pageSize: 0,
sourceType: 1,
pageCfg: {
type: 1
}
type: 1,
},
},
dropdownList: [{
desc: '按获证人数排名',
type: 1
},{
desc: '按获证比例排名',
type: 2
},{
desc: '按参与人数排名',
type: 3
}],
certFlag: 0
dropdownList: [
{
desc: '按获证人数排名',
type: 1,
},
{
desc: '按获证比例排名',
type: 2,
},
{
desc: '按参与人数排名',
type: 3,
},
],
certFlag: 0,
};
},
computed: {
...mapGetters({
originalFlag: "originalFlag",
originalFlag: 'originalFlag',
}),
},
created() {
if(process.client) {
if(this.$route && this.$route.query) {
let cQuery = this.$route.query
let hospitalIdList = cQuery.hospitalIdList || ''
if (process.client) {
if (this.$route && this.$route.query) {
const cQuery = this.$route.query;
const hospitalIdList = cQuery.hospitalIdList || '';
this.queryGDParams.projectId = cQuery.projectId || '';
this.queryGDParams.regionId = cQuery.regionId || '';
this.queryGDParams.hospitalIdList = hospitalIdList && hospitalIdList.split(',') || [];
this.certFlag = cQuery.certFlag - 0
if(!this.certFlag) {
this.dropdownList = [{
desc: '按完成人数排名',
type: 1
},{
desc: '按完成比例排名',
type: 2
},{
desc: '按参与人数排名',
type: 3
}]
this.queryGDParams.hospitalIdList =
(hospitalIdList && hospitalIdList.split(',')) || [];
this.certFlag = cQuery.certFlag - 0;
if (!this.certFlag) {
this.dropdownList = [
{
desc: '按完成人数排名',
type: 1,
},
{
desc: '按完成比例排名',
type: 2,
},
{
desc: '按参与人数排名',
type: 3,
},
];
}
cookies.set("lreporttoken", cQuery.token || '');
cookies.set('lreporttoken', cQuery.token || '');
this.queryGDParams.originalFlag = cQuery.originalFlag;
this.getStudyRankData(this.queryGDParams);
}
......@@ -95,30 +116,29 @@ export default {
methods: {
// 项目情况排名
async getStudyRankData(params) {
await getStudyRankData(params).then(res => {
if (res.code === "000000") {
await getStudyRankData(params).then((res) => {
if (res.code === '000000') {
this.isShowLoading = false;
this.rankList = res.data.studyRank;
this.title = `共${this.rankList.length}条数据`
this.title = `共${this.rankList.length}条数据`;
}
});
},
selectSortItem(type) {
this.queryGDParams.pageCfg.type = type;
this.getStudyRankData(this.queryGDParams);
}
},
},
};
</script>
<style lang="less" scoped>
.rank-edu-wrapper {
.pdt-50 {
padding-top: 50px;
}
.mt-10 {
margin-top: 10px !important;
}
<style lang="scss" scoped>
.rank-edu-wrapper {
.pdt-50 {
padding-top: 50px;
}
.mt-10 {
margin-top: 10px !important;
}
}
</style>
# STATIC
**This directory is not required, you can delete it if you don't want to use it.**
This directory contains your static files.
Each file inside this directory is mapped to `/`.
Thus you'd want to delete this README.md before deploying to production.
Example: `/static/robots.txt` is mapped as `/robots.txt`.
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#static).
@charset "utf-8";
html {
color: #000;
background: #fff;
overflow-y: scroll;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%
}
html * {
outline: 0;
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
html,body {
font-family: PingFangSC-Regular, -apple-system-font, Source Han Sans, Helvetica Neue, sans-serif;
font-size: 20px;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
margin: 0;
padding: 0;
font-size: 20px;
}
/*
input, select, textarea {
font-size: 100%;
}
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset, img {
border: 0;
}
abbr, acronym {
border: 0;
font-variant: normal;
}
del {
text-decoration: line-through;
}
address, caption, cite, code, dfn, em, th, var {
font-style: normal;
font-weight: 500;
}
ol, ul {
list-style: none;
font-size: 20px;
}
caption, th {
text-align: left;
}
/*
h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: 500;
}
*/
q:before, q:after {
content: '';
}
sub, sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -.5em;
}
sub {
bottom: -.25em;
}
a:hover {
text-decoration: underline;
}
ins, a {
text-decoration: none;
}
.van-dropdown-menu__title {
color: red !important;
}
.van-ellipsis {
color: red !important;
}
;(function(win, lib) {
var doc = win.document;
var docEl = doc.documentElement;
var metaEl = doc.querySelector('meta[name="viewport"]');
var flexibleEl = doc.querySelector('meta[name="flexible"]');
var dpr = 0;
var scale = 0;
var tid;
var flexible = lib.flexible || (lib.flexible = {});
if (metaEl) {
console.warn('将根据已有的meta标签来设置缩放比例');
var match = metaEl.getAttribute('content').match(/initial\-scale=([\d\.]+)/);
if (match) {
scale = parseFloat(match[1]);
dpr = parseInt(1 / scale);
}
} else if (flexibleEl) {
var content = flexibleEl.getAttribute('content');
if (content) {
var initialDpr = content.match(/initial\-dpr=([\d\.]+)/);
var maximumDpr = content.match(/maximum\-dpr=([\d\.]+)/);
if (initialDpr) {
dpr = parseFloat(initialDpr[1]);
scale = parseFloat((1 / dpr).toFixed(2));
}
if (maximumDpr) {
dpr = parseFloat(maximumDpr[1]);
scale = parseFloat((1 / dpr).toFixed(2));
}
}
}
if (!dpr && !scale) {
var isAndroid = win.navigator.appVersion.match(/android/gi);
var isIPhone = win.navigator.appVersion.match(/iphone/gi);
var devicePixelRatio = win.devicePixelRatio;
if (isIPhone) {
// iOS下,对于2和3的屏,用2倍的方案,其余的用1倍方案
if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
dpr = 3;
} else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)){
dpr = 2;
} else {
dpr = 1;
}
} else {
// 其他设备下,仍旧使用1倍的方案
dpr = 1;
}
scale = 1 / dpr;
}
docEl.setAttribute('data-dpr', dpr);
if (!metaEl) {
metaEl = doc.createElement('meta');
metaEl.setAttribute('name', 'viewport');
metaEl.setAttribute('content', 'initial-scale=' + scale + ', maximum-scale=' + scale + ', minimum-scale=' + scale + ', user-scalable=no');
if (docEl.firstElementChild) {
docEl.firstElementChild.appendChild(metaEl);
} else {
var wrap = doc.createElement('div');
wrap.appendChild(metaEl);
doc.write(wrap.innerHTML);
}
}
function refreshRem(){
var width = docEl.getBoundingClientRect().width;
if (width / dpr > 540) {
width = 540 * dpr;
}
var rem = width / 10;
docEl.style.fontSize = rem + 'px';
flexible.rem = win.rem = rem;
}
win.addEventListener('resize', function() {
clearTimeout(tid);
tid = setTimeout(refreshRem, 300);
}, false);
win.addEventListener('pageshow', function(e) {
if (e.persisted) {
clearTimeout(tid);
tid = setTimeout(refreshRem, 300);
}
}, false);
if (doc.readyState === 'complete') {
doc.body.style.fontSize = 12 * dpr + 'px';
} else {
doc.addEventListener('DOMContentLoaded', function(e) {
doc.body.style.fontSize = 12 * dpr + 'px';
}, false);
}
refreshRem();
flexible.dpr = win.dpr = dpr;
flexible.refreshRem = refreshRem;
flexible.rem2px = function(d) {
var val = parseFloat(d) * this.rem;
if (typeof d === 'string' && d.match(/rem$/)) {
val += 'px';
}
return val;
}
flexible.px2rem = function(d) {
var val = parseFloat(d) / this.rem;
if (typeof d === 'string' && d.match(/px$/)) {
val += 'rem';
}
return val;
}
})(window, window['lib'] || (window['lib'] = {}));
\ No newline at end of file
import { mount } from '@vue/test-utils'
import Logo from '@/components/Logo.vue'
describe('Logo', () => {
test('is a Vue instance', () => {
const wrapper = mount(Logo)
expect(wrapper.isVueInstance()).toBeTruthy()
})
})
// 跳转客服
import request from "@/service/api";
/*
*code ("0003-药械专线 0004-问诊专线 0007-会员专线 0002-教培专线 0005-招募专线 0001-基础业务")
*type 1-详情,2-ID、名称
*contentId 内容ID
*contentName 内容名称
*/
const getImUrl = (data) => {
return request({
withCredentials: true,
url: `/im/call/im/link`,
method: "post",
data: data,
});
};
function nativeGo(url) {
let paramList = [
{
key: "pageUrl",
value: url,
type: 4,
seqNo: 1,
},
];
rocNative.dispatchEventByModuleCode({
modeCode: "M300",
jsonString: paramList,
});
}
export const goKfFn =(params) =>{
getImUrl(params).then((res) => {
if (res.code == '000000') {
nativeGo(res.data)
}
}).catch((err)=>{
console.log(err);
})
}
module.exports = {
transpileDependencies: [
/[/\\]node_modules[/\\][@\\]pica-cli[/\\]vue-cli-plugin-pica-cli-plugin[/\\]core/,
/[/\\]node_modules[/\\][@\\]pica-kit[/\\]page-model/
],
productionSourceMap: false,
pluginOptions: {
pica: {
jsSort: [],
cssSort: [],
skeletonRoutes: [],
enableAutoSkeletonRoutes: false,
routeMode: 'history',
dpsLimit: 5
},
tinypng: {
key: 'kYWBH2Ck5kn4BwJj8QqjcF0mZJBtZwNR'
}
},
chainWebpack: config => {
config.set('externals', {
vue: 'Vue',
vuex: 'Vuex',
'vue-router': 'VueRouter',
'vconsole': 'VConsole',
axios: 'axios',
vant: 'vant',
'crypto-js/crypto-js': 'CryptoJS',
'jsencrypt/bin/jsencrypt': 'JSEncrypt'
});
config.plugins.delete('prefetch');
config.plugins.delete('preload');
}
};
module.exports.publicPath = process.env.VUE_APP_ENV === 'development' && process.env.VUE_APP_IS_LOCAL ? process.env.BASE_URL : `${process.env.VUE_APP_OSS_URL}/static${process.env.BASE_URL}`;
因为 它太大了无法显示 源差异 。您可以改为 查看blob
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册