Skip to content

P
pica-learning-report
提交 c4229b4c 编写于 作者: guangjun.yang's avatar guangjun.yang
浏览文件
操作

区域与机构选择

上级 6fc62990
展开全部 隐藏空白字符变更
内嵌 并排
正在显示 包含 1538 行增加 和 211 行删除
components/bussiness/charts/chart-column.vue
浏览文件 @ c4229b4c
...@@ -35,11 +35,10 @@ export default { ...@@ -35,11 +35,10 @@ export default {
// 绘制图表 // 绘制图表
let options = { let options = {
color: [ color: [
"#6ab58f", "#FFB01B",
"#80c5d8", "#39AF9A",
"#c8abda", "#5D7092",
"#dcdb5e", "#FF9A4B",
"#e89b84",
"#abb7bb", "#abb7bb",
"#76d2d2" "#76d2d2"
], ],
......
components/bussiness/charts/chart-pie.vue
浏览文件 @ c4229b4c
...@@ -47,10 +47,10 @@ export default { ...@@ -47,10 +47,10 @@ export default {
// 绘制图表 // 绘制图表
let options = { let options = {
color: [ color: [
"#6ab58f", "#FF9A4B",
"#80c5d8", "#FFB01B",
"#c8abda", "#39AF9A",
"#dcdb5e", "#5D7092",
"#e89b84", "#e89b84",
"#abb7bb", "#abb7bb",
"#76d2d2" "#76d2d2"
......
components/common/common-area-select copy.vue 0 → 100644
浏览文件 @ c4229b4c
<!-- Tabs组件 -->
<template>
<div class="common-as-wrapper">
<ul>
<li>
<span>全部区域</span>
<!-- <img src="../../assets/images/left-array-black.png" /> -->
</li>
<li>
<span>全部机构</span>
<!-- <img src="../../assets/images/left-array-black.png" /> -->
</li>
</ul>
</div>
</template>
<script>
export default {
props: {
tapList: {
type: Array,
default: () => []
}
},
methods: {}
};
</script>
<style lang="scss" scoped>
.common-as-wrapper {
padding: 0 55px;
// height: 35px;
// line-height: 35px;
ul {
display: flex;
flex-direction: row;
justify-content: space-between;
align-content: center;
align-items: center;
li {
align-content: center;
align-items: center;
height: 35px;
line-height: 35px;
}
span {
display: inline-block;
height: 15px;
line-height: 15px;
font-size: 15px;
color: #676869;
}
img {
display: inline-block;
height: 15px;
line-height: 15px;
width: 12px;
height: 12px;
}
}
}
</style>
components/common/common-area-select.vue 0 → 100644
浏览文件 @ c4229b4c
<!-- Tabs组件 -->
<template>
<ul class="common-header">
<li class="center" @click="areaClick">
{{areaName}}<img src="../../assets/images/left-array-black.png"/>
</li>
<li class="center" @click="orgClick">
{{orgName}}<img src="../../assets/images/left-array-black.png"/>
</li>
</ul>
</template>
<script>
export default {
props: {
areaName: {
type: String,
default: "全部区域"
},
orgName: {
type: String,
default: "全部区域"
}
},
methods: {
areaClick() {
this.$emit("areaClick");
},
orgClick() {
this.$emit("orgClick");
}
}
};
</script>
<style lang="scss" scoped>
.common-header {
// padding-top: 50px;
display: flex;
width: 100%;
height: 35px;
line-height: 35px;
flex-direction: row nowrap;
align-content: center;
align-items: center;
text-align: center;
justify-content: center; /* 水平居中 */
.center {
flex: 1;
font-size: 15px;
font-weight: 400;
color: #676869;
}
img {
// padding-top: 10px;
position: relative;
left: 3px;
top: 3px;
width: 16px;
height: 16px;
}
}
</style>
components/common/common-tabs.vue
浏览文件 @ c4229b4c
<!-- Tabs组件 --> <!-- Tabs组件 -->
<template> <template>
<div class="common-tabs-wrapper"> <div class="common-tabs-wrapper">
<section class="common-tabs"> <ul class="common-tabs">
<span <li
v-for="(item, index) in tapList" v-for="(item, index) in tapList"
:class="{'active': index === cIndex}" :class="{'active': index === cIndex}"
:key="index" :key="index"
@click="clickTab(index)" @click="clickTab(index)"
>{{item}}</span> >{{item}}</li>
</section> </ul>
<span class="over"></span> <span class="over"></span>
<span class="border"></span> <span class="border"></span>
</div> </div>
...@@ -80,10 +80,10 @@ export default { ...@@ -80,10 +80,10 @@ export default {
overflow-x: auto; overflow-x: auto;
// height: 30px; // height: 30px;
padding-bottom: 6px; padding-bottom: 6px;
span { li {
display: inline-block; display: inline-block;
height: 31px; height: 30px;
line-height: 31px; line-height: 30px;
font-size: 13px; font-size: 13px;
font-weight: 700; font-weight: 700;
margin: 0 6px; margin: 0 6px;
......
components/common/pica-area.vue 0 → 100644
浏览文件 @ c4229b4c
此差异已折叠。
components/common/pica-org copy.vue 0 → 100644
浏览文件 @ c4229b4c
此差异已折叠。
components/common/pica-org.vue 0 → 100644
浏览文件 @ c4229b4c
<template>
<div class="select-wrapper" >
<div class="mask" @click="cancel" @touchmove.prevent>
<div class="address-wrap" @click.stop>
<div class="tip-header">
<span class="cancel-btn" @click="cancel">取消</span>
<h3>选择机构</h3>
<span class="submit-btn" @click="confirm">确定</span>
<!-- <button :disabled="isDisabled" class="submit-btn" @click="confirm">确定</button> -->
</div>
<div class="address-select">
<ul class="show-address-header">
<!-- <li :class="{ active: isShowProvince }" class="item" @click="tabAddressClick(1)"> -->
<li :class="{ active: isShowProvince }" class="item">
{{
value.provinceName
? value.provinceName
: '请选择'
}}
</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="orgSelect(provinceItem, index)"
>
<span>{{ provinceItem.provinceName }}</span>
<span v-show="provinceItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import {
getProvinceList
} from "../../service";
export default {
name: "PicaOrg",
data() {
return {
areaList: {
provinceList: [],
},
value: {
provinceId: "",
provinceName: "",
},
isDisabled: true,
isShowProvince: true,
};
},
props: {
baseUrl: {
type: String,
default: ""
},
rank: {
type: Number | String,
default: 4
}
},
created() {
// localStorage.setItem('baseUrl',this.baseUrl);
this.getProvinceData();
},
methods: {
async getProvinceData() {
await getProvinceList().then(res => {
if (res.code === "000000") {
this.areaList.provinceList = res.data.provinceList;
this.areaList.provinceList.map(a => {
if (a.provinceId == this.value.provinceId) {
a.selected = true;
}
});
}
});
},
orgSelect(item, idx) {
this.value.provinceId = item.provinceId;
this.value.provinceName = item.provinceName;
this.areaList.provinceList.map(a => (a.selected = false));
this.areaList.provinceList[idx].selected = true;
},
confirm() {
this.$emit("confirm", this.value);
},
cancel() {
this.$emit("cancel", false);
}
}
};
</script>
<style lang="less" scoped>
.select-wrapper {
font-family: PingFangSC-Regular;
.mask {
position: fixed;
z-index: 1000;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(55, 56, 57, 0.6);
}
.address-wrap {
position: absolute;
width: 100%;
height: 293px;
background-color: #ffffff;
box-sizing: border-box;
bottom: 0;
left: 0;
right: 0;
.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;
&: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 15px;
box-sizing: border-box;
max-width: 25%;
text-align: left;
color: #676869;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
&: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;
}
}
}
}
}
}
}
</style>
\ No newline at end of file
pages/README.md 已删除 100644 → 0
浏览文件 @ 6fc62990
# PAGES
This directory contains your Application Views and Routes.
The framework reads all the `*.vue` files inside this directory and creates the router of your application.
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing).
pages/index copy.vue 已删除 100644 → 0
浏览文件 @ 6fc62990
<template>
<div class="container">
<CommonHeader></CommonHeader>
<!-- <CommonTitle></CommonTitle> -->
<!-- <CommonLoading></CommonLoading> -->
<!-- <CommonTaps></CommonTaps>
<CommonSwiperItem></CommonSwiperItem>
<CommonTitle></CommonTitle> -->
<!-- <div style="height: 340px; border: 1px solid red; margin: 15px; padding-top: 15px;position: relative; top: -10px;">
<ve-pie
ref="runTimes_creditChart"
:data="readAbilityIntervalData.pieData"
:tooltip-visible="false"
:settings="readAbilityIntervalData.settings"
:colors="options.colors"
></ve-pie>
</div> -->
<!-- <no-ssr>
<ChartPie></ChartPie>
</no-ssr> -->
<!-- <CommonTitle title="证书级别按学历分布情况"></CommonTitle> -->
<!-- <div style="padding: 0 15px;">
<ve-line :data="chartData1"></ve-line>
</div> -->
<!-- <CommonSplitLine></CommonSplitLine>
<CommonTitle title="培训情况排名"></CommonTitle>
<CommonSplitLine></CommonSplitLine>
<CommonTitle title="完成天数排名"></CommonTitle> -->
<CommonTitle title="培训情况排名"></CommonTitle>
<RankingList></RankingList>
<ShowAll></ShowAll>
<CommonSplitLine></CommonSplitLine>
<CommonTitle title="完成天数排名"></CommonTitle>
<RankingItemDays></RankingItemDays>
<ShowAll></ShowAll>
<!-- <CommonSplitLine></CommonSplitLine> -->
<CommonBottomInfo></CommonBottomInfo>
</div>
</template>
<script>
import VePie from "v-charts/lib/pie";
import VeLine from "v-charts/lib/line";
import CommonHeader from "../components/common/common-header";
import CommonTitle from "../components/common/common-title";
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 ChartPie from "../components/bussiness/charts/chart-pie";
import ShowAll from "../components/common/common-show-all";
import CommonBottomInfo from "../components/common/common-bottom-info";
import RankingItemDays from "../components/bussiness/ranking-item-days";
export default {
components: {
CommonHeader,
CommonTitle,
VePie,
VeLine,
CommonLoading,
CommonTaps,
CommonSwiperItem,
CommonSplitLine,
RankingList,
ChartPie,
ShowAll,
CommonBottomInfo,
RankingItemDays
},
data() {
// this.chartSetting = {
// width: "1000px",
// height: "800px"
// };
return {
chartData1: {
columns: ["date", "PV"],
rows: [
{ date: "01-01", PV: 1231 },
{ date: "01-02", PV: 1223 },
{ date: "01-03", PV: 2123 },
{ date: "01-04", PV: 4123 },
]
},
echartsSettings: {
height: '500px'
},
chartWidth: "1000px",
chartHeight: "1000px",
readAbilityIntervalData: {
pieData: {
columns: ["distributionName", "ratio"],
rows: [
// 数据
{
distributionName: "落后",
ratio: "17" // 8% X 只能传入number 8% 不识别
},
{
distributionName: "不足",
ratio: "13"
},
{
distributionName: "良好",
ratio: "30"
}
]
},
msg: "",
settings: {
dataType: "percent",
label: {
show: true,
position: "outside",
formatter: "{c}%" // 展示如果需要％
}
}
},
// 重置颜色，图标如果需要颜色，优先从用户提供的colors中依次提取，用户不提供，则根据默认的颜色进行选取
options: {
colors: [
"#6ab58f",
"#80c5d8",
"#c8abda",
"#dcdb5e",
"#e89b84",
"#abb7bb",
"#76d2d2"
]
}
};
},
async asyncData() {
return {};
},
created() {
// this.$store.dispatch('searchHospital', { name: '测试' });
},
mounted() {
// window.addEventListener("resize", this.resizeTheChart);
},
methods: {
resizeTheChart() {
if (this.$refs.runTimes_creditChart) {
this.$refs.runTimes_creditChart.resize();
}
}
}
};
</script>
<style lang="less">
.container {
margin: 0 auto;
min-height: 100vh;
h1 {
font-size: 36px;
text-align: center;
}
.m1 {
width: 100%;
> div {
width: 100%;
}
img {
width: 100%;
}
}
}
</style>
pages/index.vue
浏览文件 @ c4229b4c
<template> <template>
<div class="container"> <div class="container">
<CommonHeader></CommonHeader> <CommonHeader></CommonHeader>
<CommonAreaSelect @areaClick="areaTabClick" @orgClick="orgTabClick"></CommonAreaSelect>
<CommonTaps></CommonTaps> <CommonTaps></CommonTaps>
<CommonSwiperItem></CommonSwiperItem> <CommonSwiperItem></CommonSwiperItem>
<CommonTitle title="证书分布情况"></CommonTitle> <CommonTitle title="证书分布情况"></CommonTitle>
...@@ -34,7 +35,8 @@ ...@@ -34,7 +35,8 @@
<ShowAll></ShowAll> <ShowAll></ShowAll>
<!-- <CommonSplitLine></CommonSplitLine> --> <!-- <CommonSplitLine></CommonSplitLine> -->
<CommonBottomInfo></CommonBottomInfo> <CommonBottomInfo></CommonBottomInfo>
<PicaArea v-show="isShowArea" @confirm="areaConfirm" @cancel="areaCancel"></PicaArea>
<PicaOrg v-show="isShowOrg" @confirm="orgConfirm" @cancel="orgCancel"></PicaOrg>
</div> </div>
</template> </template>
...@@ -53,6 +55,9 @@ import CommonBottomInfo from "../components/common/common-bottom-info"; ...@@ -53,6 +55,9 @@ import CommonBottomInfo from "../components/common/common-bottom-info";
import RankingItemDays from "../components/bussiness/ranking-item-days"; import RankingItemDays from "../components/bussiness/ranking-item-days";
import ChartPie from "../components/bussiness/charts/chart-pie"; import ChartPie from "../components/bussiness/charts/chart-pie";
import ChartColumn from "../components/bussiness/charts/chart-column"; import ChartColumn from "../components/bussiness/charts/chart-column";
import PicaArea from "../components/common/pica-area";
import PicaOrg from "../components/common/pica-org";
import CommonAreaSelect from "../components/common/common-area-select";
export default { export default {
components: { components: {
...@@ -69,7 +74,10 @@ export default { ...@@ -69,7 +74,10 @@ export default {
ShowAll, ShowAll,
CommonBottomInfo, CommonBottomInfo,
RankingItemDays, RankingItemDays,
ChartColumn ChartColumn,
PicaArea,
PicaOrg,
CommonAreaSelect
}, },
data() { data() {
// this.chartSetting = { // this.chartSetting = {
...@@ -101,7 +109,9 @@ export default { ...@@ -101,7 +109,9 @@ export default {
"#abb7bb", "#abb7bb",
"#76d2d2" "#76d2d2"
] ]
} },
isShowArea: false,
isShowOrg: false
}; };
}, },
async asyncData() { async asyncData() {
...@@ -114,6 +124,25 @@ export default { ...@@ -114,6 +124,25 @@ export default {
// window.addEventListener("resize", this.resizeTheChart); // window.addEventListener("resize", this.resizeTheChart);
}, },
methods: { methods: {
areaConfirm(selData) {
console.log(selData)
this.isShowArea = false
},
areaCancel() {
this.isShowArea = false
},
orgConfirm(selData) {
this.isShowOrg = false
},
orgCancel() {
this.isShowOrg = false
},
areaTabClick() {
this.isShowArea = true
},
orgTabClick() {
this.isShowOrg = true
},
resizeTheChart() { resizeTheChart() {
if (this.$refs.runTimes_creditChart) { if (this.$refs.runTimes_creditChart) {
this.$refs.runTimes_creditChart.resize(); this.$refs.runTimes_creditChart.resize();
......
plugins/README.md 已删除 100644 → 0
浏览文件 @ 6fc62990
# PLUGINS
**This directory is not required, you can delete it if you don't want to use it.**
This directory contains Javascript plugins that you want to run before mounting the root Vue.js application.
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/plugins).
plugins/vue-inject.js
浏览文件 @ c4229b4c
...@@ -2,5 +2,8 @@ import Vue from 'vue' ...@@ -2,5 +2,8 @@ import Vue from 'vue'
import rocNative from '@/utils/jsbridge' import rocNative from '@/utils/jsbridge'
import echarts from 'echarts' import echarts from 'echarts'
// import picaArea from 'pica-area'
// Vue.use(picaArea)
Vue.prototype.$echarts = echarts Vue.prototype.$echarts = echarts
Vue.prototype.$rocNative = new rocNative(); Vue.prototype.$rocNative = new rocNative();
\ No newline at end of file
service/api.js
浏览文件 @ c4229b4c
...@@ -5,6 +5,12 @@ import { API_CONFIG, REPONSE_CODE } from '@/utils/enumerate'; ...@@ -5,6 +5,12 @@ import { API_CONFIG, REPONSE_CODE } from '@/utils/enumerate';
const { VUE_ENV } = process.env; // server or client const { VUE_ENV } = process.env; // server or client
const cookies = require('cookie-universal')(); const cookies = require('cookie-universal')();
// const baseUrl = localStorage.getItem('baseUrl');
// const instance = axios.create({
// baseURL: baseUrl,
// timeout: 30000,
// });
Axios.interceptors.request.use( Axios.interceptors.request.use(
config => { config => {
// 0. Do something before request is sent // 0. Do something before request is sent
......
service/index.js
浏览文件 @ c4229b4c
...@@ -6,4 +6,52 @@ export const getHospital = async (params) => { ...@@ -6,4 +6,52 @@ export const getHospital = async (params) => {
const str = qs.stringify(query); const str = qs.stringify(query);
return request({ url: `/api-ws/hospitals/?${str}` }); return request({ url: `/api-ws/hospitals/?${str}` });
}; };
\ No newline at end of file
/**
* 获取省列表
*/
export const getProvinceList = async params => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: `/basic-data/position/provinces`
});
};
/**
* 获取市列表
*/
export const getCityList = async params => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: `/basic-data/position/cities`
});
};
/**
* 获取县/区列表
*/
export const getCountyList = async params => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: `/basic-data/position/counties`
});
};
/**
* 获取乡镇列表
*/
export const getTownList = async params => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: `/basic-data/position/towns`
});
};
utils/enumerate.js
浏览文件 @ c4229b4c
...@@ -3,7 +3,7 @@ const { NUXT_ENV_APP } = process.env; ...@@ -3,7 +3,7 @@ const { NUXT_ENV_APP } = process.env;
export const BASE_URL = { export const BASE_URL = {
dev: 'https://dev-sc.yunqueyi.com', dev: 'https://dev-sc.yunqueyi.com',
test: 'https://test1-sc.yunqueyi.com', test: 'https://test1-sc.yunqueyi.com',
prod: 'https://sc.yunqueyi.com' prod: 'https://sc.yunqueyi.com'
}; };
export const API_CONFIG = { export const API_CONFIG = {
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或