提交 600eb2cd 编写于 作者: haoguojing's avatar haoguojing

feat: 新增考试

上级 74286733
node_modules
dist/index.js
dist/authUseful.js
dist/stroke.js
.temp/entry.js
dist/
.temp/
\ No newline at end of file
<template>
<div>
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item><i class="el-icon-date"></i> 图表</el-breadcrumb-item>
<el-breadcrumb-item>基础图表</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="plugins-tips">
vue-schart:vue.js封装sChart.js的图表组件。
访问地址:<a href="https://github.com/lin-xin/vue-schart" target="_blank">vue-schart</a>
</div>
<div class="schart">
<div class="content-title">柱状图</div>
<schart canvasId="bar" width="500" height="400" :data="data1" type="bar" :options="options1"></schart>
</div>
<div class="schart">
<div class="content-title">折线图</div>
<schart canvasId="line" width="500" height="400" :data="data1" type="line" :options="options1"></schart>
</div>
<div class="schart">
<div class="content-title">饼状图</div>
<schart canvasId="pie" width="500" height="400" :data="data2" type="pie" :options="options2"></schart>
</div>
<div class="schart">
<div class="content-title">环形图</div>
<schart canvasId="ring" width="500" height="400" :data="data2" type="ring" :options="options2"></schart>
</div>
</div>
</template>
<script>
import Schart from 'vue-schart';
export default {
components: {
Schart
},
data: () => ({
data1:[
{name:'2012',value:1141},
{name:'2013',value:1499},
{name:'2014',value:2260},
{name:'2015',value:1170},
{name:'2016',value:970},
{name:'2017',value:1450}
],
data2 : [
{name:'短袖',value:1200},
{name:'休闲裤',value:1222},
{name:'连衣裙',value:1283},
{name:'外套',value:1314},
{name:'羽绒服',value:2314}
],
options1: {
title: '某商店近年营业总额',
bgColor: '#009688',
titleColor: '#ffffff',
fillColor: '#e0f2f1',
axisColor: '#ffffff',
contentColor: '#999'
},
options2: {
title: '某商店各商品年度销量',
bgColor: '#607d8b',
titleColor: '#ffffff',
legendColor: '#ffffff'
}
})
}
</script>
<style scoped>
.schart{
width: 600px;
display: inline-block;
}
.content-title{
clear: both;
font-weight: 400;
line-height: 50px;
margin: 10px 0;
font-size: 22px;
color: #1f2f3d;
}
</style>
\ No newline at end of file
<template>
<div>
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item><i class="el-icon-date"></i> 表单</el-breadcrumb-item>
<el-breadcrumb-item>基本表单</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="form-box">
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="表单名称">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="选择器">
<el-select v-model="form.region" placeholder="请选择">
<el-option key="bbk" label="步步高" value="bbk"></el-option>
<el-option key="xtc" label="小天才" value="xtc"></el-option>
<el-option key="imoo" label="imoo" value="imoo"></el-option>
</el-select>
</el-form-item>
<el-form-item label="日期时间">
<el-col :span="11">
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
</el-col>
<el-col class="line" :span="2">-</el-col>
<el-col :span="11">
<el-time-picker type="fixed-time" placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-time-picker>
</el-col>
</el-form-item>
<el-form-item label="选择开关">
<el-switch on-text="" off-text="" v-model="form.delivery"></el-switch>
</el-form-item>
<el-form-item label="多选框">
<el-checkbox-group v-model="form.type">
<el-checkbox label="步步高" name="type"></el-checkbox>
<el-checkbox label="小天才" name="type"></el-checkbox>
<el-checkbox label="imoo" name="type"></el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="单选框">
<el-radio-group v-model="form.resource">
<el-radio label="步步高"></el-radio>
<el-radio label="小天才"></el-radio>
<el-radio label="imoo"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="文本框">
<el-input type="textarea" v-model="form.desc"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">提交</el-button>
<el-button>取消</el-button>
</el-form-item>
</el-form>
</div>
</div>
</template>
<script>
export default {
data: function(){
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: true,
type: ['步步高'],
resource: '小天才',
desc: ''
}
}
},
methods: {
onSubmit() {
this.$message.success('提交成功!');
}
}
}
</script>
\ No newline at end of file
<template>
<div class="question-wrap">
<div class="bind-info" v-if="isUpdate">
<h4 style="padding-bottom: 15px;">已绑定培训考试</h4>
<div class="bind-items">
<div class="bind-item" v-for="(item, i) in bindItems">
{{i + 1 + '. ' + item.responsible_user}}
</div>
<div v-if="!bindItems.length" class="empty">暂无数据</div>
</div>
</div>
<el-row class="search-wrap">
<el-col :span="4" class="name-label">
题库名称
</el-col>
<el-col :span="10">
<el-input v-model="name" placeholder="请输入题库名称"></el-input>
</el-col>
</el-row>
<el-row class="search-wrap" style="padding: 25px 0px 15px 0px;">
<el-col :span="4" class="name-label">
导入题库
</el-col>
<el-col :span="20">
<vue-xlsx-table @on-select-file="handleSelectedFile">选择导入</vue-xlsx-table>
</el-col>
</el-row>
<h4 style="padding-bottom: 15px;">预览题库</h4>
<div class="preview-wrap">
<h4 class="title" v-if="data.length" style="text-align: center">
{{name}} 题库
</h4>
<div class="question-wrap" v-for="(item, index) in data">
<div class="desc">
{{index + 1}}. {{item['title']}}
</div>
<div class="option">
A. {{item['choice_d']}}
</div>
<div class="option">
B. {{item['choice_d']}}
</div>
<div class="option">
C. {{item['choice_c']}}
</div>
<div class="option">
D. {{item['choice_d']}}
</div>
</div>
<div v-if="!data.length" class="empty">暂无数据</div>
</div>
<div class="tool">
<el-button @click="submit" type="primary">确定</el-button>
<el-button @click="cancel">取消</el-button>
</div>
</div>
</template>
<style scoped>
.bind-info {
padding-bottom: 20px;
}
.bind-items {
max-height: 100px;
overflow-y: auto;
border: 1px solid rgba(85, 85, 85, .5);
padding: 20px;
max-width: 1000px;
min-width: 500px;
}
.bind-item {
font-size: 14px;
line-height: 28px;
}
.tool-wrap {
padding: 15px 0;
}
.name-label {
line-height: 2.3;
}
.search {
margin-left: 15px;
}
.search-wrap {
width: 600px;
}
.preview-wrap {
border: 1px solid rgba(85, 85, 85, .5);
padding: 20px;
max-width: 1000px;
min-width: 500px;
max-height: 500px;
overflow-y: auto;
}
.option {
padding-left: 15px;
line-height: 24px;
}
.question-wrap {
margin-top: 20px;
}
.empty {
text-align: center;
}
.desc {
padding-bottom: 10px;
}
.tool {
padding-top: 30px;
padding-left: 353px;
}
</style>
<script>
import fetch from '../../common/fetch';
export default {
data(){
return {
name: '',
data: [],
isUpdate: false,
bindItems: [],
imported: false,
submitted: false
}
},
created() {
this.getDetail()
},
methods: {
getDetail() {
let id = this.$route.query.id
if(id) {
this.isUpdate = true
let para = {
token: localStorage.getItem("token"),
id: id
}
fetch('eagleQuestionCategorys/search', para, 'GET', 'GET').then(data => {
this.bindItems = data.eagleTrainings
this.data = data.eagleSingleSelRepos
this.name = data.eagleQuestionCategoryModel.name
});
}
},
validateFile(head) {
if(head[0].indexOf('题目') == -1) {
return false
}
if(head[1].indexOf('答案') == -1 || head[2].indexOf('答案') == -1 ||head[3].indexOf('答案') == -1
||head[4].indexOf('答案') == -1 ||head[5].indexOf('答案') == -1) {
return false
}
return true
},
handleSelectedFile (convertedData) {
if(!this.validateFile(convertedData.header)) {
this.$message.error('请选择正确的EXCEL文件');
return
}
this.imported = true
let head = convertedData.header
let body = convertedData.body
let data = this.data = []
body.forEach(item => {
data.push({
title: item[head[0]],
choice_a: item[head[1]],
choice_b: item[head[2]],
choice_c: item[head[3]],
choice_d: item[head[4]],
answer: item[head[5]]
})
})
},
cancel() {
this.$router.back()
},
submit() {
if(this.submitted) {
return
} else if(!this.name) {
this.$message.error('请输入题库名称');
return
} else if(!this.data.length) {
this.$message.error('请选择文件');
return
}
let para = {
importQuestion: this.imported,
eagleQuestionCategory: {
id: this.$route.query.id,
name: this.name
},
eagleSingleSelRepos: this.data,
token: localStorage.getItem("token")
}
const loading = this.$loading({
lock: true,
target: '#bodyContent',
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.3)'
});
let self = this
fetch('eagleQuestionCategorys/insert', para, 'POST', 'POST').then(data => {
loading.close();
this.submitted = true
this.$message({
message: self.isUpdate ? '编辑成功' : '添加成功',
type: 'success',
duration: 1000,
onClose() {
self.cancel()
}
});
});
}
}
}
</script>
<template>
<section class="main">
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item><i class="el-icon-upload2"></i> 拖拽排序</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="drag-box-left">
<div class="drag-title">拖动排序</div>
<div class="drag-list" draggable="true"
v-for="list in data1"
:data-id="list.id"
@dragstart="dragstartEvent"
@dragend="dragendEvent"
@dragenter="dragenterEvent"
@dragleave="dragleaveEvent"
@dragover="dragoverEvent"
>{{list.title}}</div>
</div>
</section>
</template>
<script>
export default {
data() {
return {
dragElement: null,
lock: true,
data1: [
{id: 1, title: '这里是列表1的标题'},
{id: 2, title: '这里是列表2的标题'},
{id: 3, title: '这里是列表3的标题'},
{id: 4, title: '这里是列表4的标题'},
{id: 5, title: '这里是列表5的标题'},
{id: 6, title: '这里是列表6的标题'},
{id: 7, title: '这里是列表7的标题'}
],
data2: [
{id: 1, title: '这里是列表11的标题'},
{id: 2, title: '这里是列表12的标题'},
{id: 3, title: '这里是列表13的标题'},
{id: 4, title: '这里是列表14的标题'}
]
}
},
methods: {
dragstartEvent(ev) {
const self = this;
self.dragElement = ev.target;
ev.target.style.backgroundColor = '#f8f8f8';
},
dragendEvent(ev) {
ev.target.style.backgroundColor = '#fff';
ev.preventDefault();
},
dragenterEvent(ev) {
const self = this;
if(self.dragElement != ev.target){
ev.target.parentNode.insertBefore(self.dragElement, ev.target);
}
},
dragleaveEvent(ev) {
const self = this;
if(self.dragElement != ev.target){
if(self.lock && (ev.target == ev.target.parentNode.lastElementChild || ev.target == ev.target.parentNode.lastChild)){
ev.target.parentNode.appendChild(self.dragElement);
self.lock = false;
}else{
self.lock = true;
}
}
},
dragoverEvent(ev) {
ev.preventDefault();
}
}
}
</script>
<style scoped>
.drag-box-left{
float: left;
width: 45%;
}
.drag-box-right{
float: right;
width: 45%;
}
.drag-list{
border: 1px solid #ddd;
padding:10px;
margin-bottom: 20px;
transition: border .3s;
}
.drag-list:hover{
border: 1px solid #20a0ff;
}
.drag-title{
font-weight: 400;
line-height: 25px;
margin: 10px 0;
font-size: 22px;
color: #1f2f3d;
}
</style>
\ No newline at end of file
<template>
<div class="question-wrap">
<el-row class="search-wrap">
<el-col :span="4" class="name-label">
题库名称
</el-col>
<el-col :span="10">
<el-input v-model="searchValue" placeholder="单行输入"></el-input>
</el-col>
<el-col :span="4">
<el-button type="primary" @click="search()" class="search"><i class="el-icon-search"></i>&nbsp;搜索</el-button>
</el-col>
</el-row>
<el-row class="tool-wrap">
<el-col :span="12" style="font-size: 14px;line-height: 39px;">
<span style="margin-right: 20px;">下载题库模板</span>
<a href="javascript:" @click="download">雄鹰考试题库.excel</a>
</el-col>
<el-col :span="12" style="text-align: right;">
<el-button type="primary" @click="create">新建</el-button>
</el-col>
</el-row>
<el-table
:data="tableData"
style="width: 100%">
<el-table-column
prop="name"
label="题库名称">
</el-table-column>
<el-table-column
width="200"
prop="upload_time"
label="题库上传时间">
</el-table-column>
<el-table-column
prop="uploader"
label="上传人员">
</el-table-column>
<el-table-column
width="130"
prop="bindDisplay"
label="题库状态">
<template slot-scope="scope">
<el-tag
:type="scope.row.bindDisplay === '未绑定' ? 'primary' : 'success'"
close-transition>{{scope.row.bindDisplay}}</el-tag>
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button
size="mini"
@click="update(scope.row)">编辑</el-button>
<el-button
size="mini"
type="danger"
@click="deleteItem(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000,1500, 2000]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</div>
</template>
<style scoped>
.binded {
color: #67c23a;
}
.unBinded {
color: #e6a23c;
}
.tool-wrap {
padding: 15px 0;
}
.name-label {
line-height: 2.3;
}
.search {
margin-left: 15px;
}
.search-wrap {
width: 600px;
}
</style>
<script>
import fetch from '../../common/fetch';
export default {
data(){
return {
tableData: [],
pageNo: 1,
pageSize: 15,
totalRows: 0,
searchValue: ''
}
},
created() {
this.search()
},
methods: {
format(data) {
data.forEach( item => {
item.bindDisplay = item.binding_status == 1 ? '已绑定' : '未绑定'
})
return data
},
search(callback) {
const loading = this.$loading({
lock: true,
target: '#bodyContent',
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.3)'
});
fetch('eagleQuestionCategorys/list', {
token: localStorage.getItem("token"),
name: this.searchValue,
pageSize: this.pageSize,
pageNo: this.pageNo
}, 'GET', 'GET').then(data => {
loading.close()
this.tableData = this.format(data.pdModelList)
this.totalRows = data.totalRows
callback && callback()
});
},
handleSizeChange(size) {
this.pageSize = size
this.search()
},
handleCurrentChange(no) {
this.pageNo = no
this.search()
},
create() {
this.$router.push({
path: 'create-question'
})
},
update(row) {
this.$router.push({
path: 'create-question',
query: {
id: row.id
}
})
},
deleteItem(row) {
if(row.binding_status == 1) {
this.$message.error('已绑定人员的情况下不允许删除');
return
}
this.$confirm('确定删除此题库', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const loading = this.$loading({
lock: true,
target: '#bodyContent',
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.3)'
});
let para = {
token: localStorage.getItem("token"),
id: row.id
}
fetch('eagleQuestionCategorys/delete', para, 'DELETE', 'DELETE').then(data => {
this.search( () => {
loading.close();
this.$message({
message: '删除成功',
type: 'success',
duration: 1000
});
})
});
})
},
download() {
window.location.href = localStorage.getItem('template_url') + '/File/template/雄鹰考试题库模板.xslx'
}
}
}
</script>
<template>
<div class="table">
<el-row :gutter="10">
<el-col :span="2" class="padding-top-10"><label>活动状态</label></el-col>
<el-col :span="2" class="padding-top-10"><label>考试列表</label></el-col>
<el-col :span="4">
<div class="grid-content bg-purple">
<el-input v-model="eagleTraining.name"></el-input>
......@@ -25,25 +25,30 @@
<el-button type="primary" icon="search" @click="search">搜索</el-button>
</el-col>
<el-col :span="2">
<el-button type="primary" icon="edit" @click="addEagleTraining">新增</el-button>
<el-button type="primary" icon="edit" @click="addEagleTraining">新增考试</el-button>
</el-col>
</el-row>
<el-table :data="tableData" stripe border style="width: 100%" ref="multipleTable">
<!--<el-table-column type="selection" width="55"></el-table-column>-->
<el-table-column prop="name" label="培训名称" :show-overflow-tooltip="tooltip" width="130">
<el-table-column prop="name" label="序号" :show-overflow-tooltip="tooltip" width="130">
</el-table-column>
<el-table-column label="培训时间段" min-width="230">
<el-table-column label="考试名称" min-width="230">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.start_time | dateFormat }} ~ {{ scope.row.end_time | dateFormat }}</span>
</template>
</el-table-column>
<el-table-column prop="test_user" label="考试人员" :show-overflow-tooltip="tooltip" min-width="170">
<el-table-column prop="test_user" label="时间限制" :show-overflow-tooltip="tooltip" min-width="170">
</el-table-column>
<el-table-column prop="responsible_user" label="负责人" :show-overflow-tooltip="tooltip" min-width="100">
<el-table-column prop="responsible_user" label="通过标准" :show-overflow-tooltip="tooltip" min-width="100">
</el-table-column>
<el-table-column prop="created_time" label="生成时间" :show-overflow-tooltip="tooltip" min-width="150">
<el-table-column prop="created_time" label="字段要求" :show-overflow-tooltip="tooltip" min-width="150">
</el-table-column><el-table-column prop="created_time" label="允许考试次数" :show-overflow-tooltip="tooltip" min-width="150">
</el-table-column><el-table-column prop="created_time" label="考试开放时间" :show-overflow-tooltip="tooltip" min-width="150">
</el-table-column><el-table-column prop="created_time" label="答题规则" :show-overflow-tooltip="tooltip" min-width="150">
</el-table-column>
<el-table-column prop="status" label="发布状态" min-width="100">
<el-table-column prop="created_time" label="发布结果" :show-overflow-tooltip="tooltip" min-width="150">
</el-table-column>
<el-table-column prop="status" label="状态" min-width="100">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.status | statusFilter }}</span>
<!--<el-select v-model="scope.row.status" class="handle-select mr10">-->
......@@ -58,19 +63,11 @@
</el-table-column>
<el-table-column label="操作" min-width="200">
<template scope="scope">
<el-button size="small" @click="updateEagleTraining(scope.$index, scope.row,'form')">刷新题目</el-button>
<el-button size="small" @click="updateEagleTraining(scope.$index, scope.row,'form')">管理试卷</el-button>
<el-button size="small" @click="updateEagleTraining(scope.$index, scope.row,'form')">编辑</el-button>
<el-button size="small" v-show="scope.row.status == 1" @click="updateStatus(scope.row)">暂停/发布</el-button>
<el-button size="small" v-show="scope.row.status == 1" @click="updateStatus(scope.row)">发布</el-button>
<el-button size="small" v-show="scope.row.status == 2" @click="updateStatus(scope.row)">下架</el-button>
<el-button size="small" type="danger" @click="deleteEagleTraining(scope.row)">删除</el-button>
<!--<el-button size="small" @click="viewActivityResult(scope.row)">查看结果</el-button>-->
<!--<el-button size="small" type="danger"-->
<!--@click="handleDelete(scope.$index, scope.row)">发布</el-button>-->
<!--<el-button size="small" type="danger"-->
<!--@click="handleDelete(scope.$index, scope.row)">关闭</el-button>-->
<!--<el-button size="small" type="danger"-->
<!--<el-button size="small" type="danger" @click="editActive(scope.$index, scope.row)">配置</el-button>-->
<!--<router-link :to="{ path: 'editActive', query: { id: '11' }}">配置活动</router-link>-->
<!--@click="handleDelete(scope.$index, scope.row)">查看活动结果</el-button>-->
</template>
</el-table-column>
</el-table>
......
......@@ -2,7 +2,7 @@
<div class="table">
<el-row :gutter="10" class="row" type="flex">
<el-col :span="3">
<h3>创建培训</h3>
<h3>新增/修改考试</h3>
</el-col>
</el-row>
<hr>
......@@ -10,254 +10,54 @@
<el-col :span="14">
<el-row :gutter="0" class="row" type="flex">
<el-form ref="eagleForm" :inline="false" :model="eagle" label-width="110px" label-suffix=":" size="mini" :rules="rules">
<el-form-item label="培训名称" prop="name">
<el-input class="form-input" v-model="eagle.name" placeholder="培训名称"></el-input>
<el-form-item label="考试名称" prop="name">
<el-input class="form-input" v-model="eagle.name" placeholder="考试名称"></el-input>
</el-form-item>
<el-form-item label="培训时间" required>
<el-col :span="a">
<el-form-item prop="start_time">
<el-date-picker class="form-input" v-model="eagle.start_time" type="datetime" style="width: 100%;" placeholder="开始时间"></el-date-picker>
</el-form-item>
<div class="el-form-item__error" v-show="start_end_time_flag">培训开始时间应小于结束时间</div>
</el-col>
<el-col class="line" :span="b" style="padding-left: 8px;">~</el-col>
<el-col :span="a">
<el-form-item prop="end_time">
<el-date-picker class="form-input" v-model="eagle.end_time" type="datetime" style="width: 100%;" placeholder="结束时间"></el-date-picker>
</el-form-item>
</el-col>
<el-form-item label="通过标准" required>
<el-form-item prop="base_question">
<el-select class="form-input" v-model="base_question" filterable placeholder="请选择" @change="testChange()">
<el-option v-for="item in eagleQuestionCategories" :key="item.no" :value="item.value"></el-option>
</el-select>
</el-form-item>
</el-form-item>
<el-form-item label="参加考试人员" prop="doctors">
<el-upload class="upload-demo" action="#" accept=".xlsx" :before-upload="beforeImport" :limit="1">
<el-button size="small" type="primary">选择导入</el-button>
</el-upload>
<el-form-item label="字段要求" required>
<el-form-item prop="base_question">
<el-select class="form-input" v-model="base_question" filterable placeholder="请选择" @change="testChange()">
<el-option v-for="item in eagleQuestionCategories" :key="item.id" :label="item.name + '/' + item.question_count" :value="item"></el-option>
</el-select>
</el-form-item>
</el-form-item>
<el-form-item label="" prop="doctor">
<el-col :span="a">
<el-input class="form-input" v-model="join_doc_name" placeholder="参加考试的人员"></el-input>
</el-col>
<el-col :span="a">
<el-input class="form-input" v-model="join_doc_mobile" placeholder="参加考试的人员手机号" :maxlength = "mxalength"></el-input>
</el-col>
<el-col :span="c">
<el-button size="small" type="primary" @click="addOne(1,join_doc_mobile)">添加</el-button>
</el-col>
<el-form-item label="考试开放时间" required>
<el-form-item prop="base_question">
<el-select class="form-input" v-model="base_question" filterable placeholder="请选择" @change="testChange()">
<el-option v-for="item in testTime" :key="item.id" :value="item.value"></el-option>
</el-select>
</el-form-item>
</el-form-item>
<el-form-item label="摸底考试时间" required>
<el-row :gutter="10" type="flex">
<el-col :span="a">
<el-form-item prop="base_start_time">
<el-date-picker class="form-input" v-model="eagle.base_start_time" type="datetime" style="width: 100%;" placeholder="开始时间"></el-date-picker>
</el-form-item>
<div class="el-form-item__error" v-show="base_time_flag">摸底开始时间应小于结束时间</div>
<div class="el-form-item__error" v-show="base_start_time_flag">摸底开始、结束时间应在培训期间内</div>
</el-col>
<el-col class="line" :span="b">-</el-col>
<el-col :span="a">
<el-form-item prop="base_end_time">
<el-date-picker class="form-input" v-model="eagle.base_end_time" type="datetime" style="width: 100%;" placeholder="结束时间"></el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="允许考试次数" required>
<el-form-item prop="base_question">
<el-select class="form-input" v-model="base_question" filterable placeholder="请选择" @change="testChange()">
<el-option v-for="item in testCount" :key="item.id" :value="item.value"></el-option>
</el-select>
</el-form-item>
</el-form-item>
<el-form-item label="摸底考试题库" required>
<el-row :gutter="10" type="flex">
<el-col :span="a">
<el-form-item prop="base_question">
<el-select class="form-input" v-model="base_question" filterable placeholder="请选择" @change="testChange()">
<el-option v-for="item in eagleQuestionCategories" :key="item.id" :label="item.name + '/' + item.question_count" :value="item"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="b"></el-col>
<el-col :span="a">
<el-form-item prop="base_question_num">
<el-input class="form-input" v-model.number="eagle.base_question_num" placeholder="摸底考试题数">
<template slot="prepend">题数</template>
</el-input>
<div class="el-form-item__error" v-show="base_question_flag">摸底题数不能大于题库总数</div>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="中途退考" required>
<el-form-item prop="base_question">
<el-select class="form-input" v-model="base_question" filterable placeholder="请选择" @change="testChange()">
<el-option v-for="item in retreatMidway" :key="item.id" :label="item.name + '/' + item.question_count" :value="item"></el-option>
</el-select>
</el-form-item>
</el-form-item>
<el-form-item label="结业考试时间" required>
<el-row :gutter="10" type="flex">
<el-col :span="a">
<el-form-item prop="certification_start_time">
<el-date-picker class="form-input" v-model="eagle.certification_start_time" type="datetime" style="width: 100%;" placeholder="开始时间"></el-date-picker>
</el-form-item>
<div class="el-form-item__error" v-show="certification_time_flag">结业开始时间应小于结束时间</div>
<div class="el-form-item__error" v-show="certification_start_time_flag">结业开始、结束时间应在培训期间内</div>
<div class="el-form-item__error" v-show="certification_base_time_flag">结业开始时间应在摸底结束时间之后</div>
</el-col>
<el-col :span="b">-</el-col>
<el-col :span="a">
<el-form-item prop="certification_end_time">
<el-date-picker class="form-input" v-model="eagle.certification_end_time" type="datetime" style="width: 100%;" placeholder="结束时间"></el-date-picker>
</el-form-item>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="结业考试题库" required>
<el-row :gutter="10" type="flex">
<el-col :span="a">
<el-form-item prop="certification_question">
<el-select class="form-input" v-model="certification_question" filterable placeholder="请选择" @change="testChange()">
<el-option v-for="item in eagleQuestionCategories" :key="item.id" :label="item.name + '/' + item.question_count" :value="item"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="b">-</el-col>
<el-col :span="a">
<el-form-item prop="certification_question_num">
<el-input class="form-input" v-model.number="eagle.certification_question_num" placeholder="结业考试题数">
<template slot="prepend">题数</template>
</el-input>
<div class="el-form-item__error" v-show="certification_question_flag">结业题数不能大于题库总数</div>
</el-form-item>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="设置结业标准" required>
<el-col :span="d">
<el-form-item prop="certification_excellent_num">
<el-input v-model.number="eagle.certification_excellent_num" placeholder="">
<template slot="prepend">优秀</template>
</el-input>
<div class="el-form-item__error" v-show="certification_question_excellent_flag">优秀数不能大于结业题数总数</div>
</el-form-item>
</el-col>
<el-col :span="b">&nbsp;</el-col>
<el-col :span="d">
<el-form-item prop="certification_well_num">
<el-input v-model.number="eagle.certification_well_num" placeholder="">
<template slot="prepend">良好</template>
</el-input>
<div class="el-form-item__error" v-show="certification_excellent_well_flag">良好数小于优秀数</div>
</el-form-item>
</el-col>
<el-col :span="b">&nbsp;</el-col>
<el-col :span="d">
<el-form-item prop="certification_pass_num">
<el-input v-model.number="eagle.certification_pass_num" placeholder="">
<template slot="prepend">及格</template>
</el-input>
<div class="el-form-item__error" v-show="certification_well_pass_flag">及格数小于优秀数</div>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item label="考试的负责人" prop="charge_mobile">
<el-col :span="a">
<el-input class="form-input" v-model="charge_name" placeholder="负责人姓名"></el-input>
</el-col>
<el-col :span="a">
<el-input class="form-input" v-model="charge_mobile" placeholder="负责人手机号" :maxlength = "mxalength"></el-input>
</el-col>
<el-col :span="c">
<el-button size="small" type="primary" @click="addOne(2,charge_mobile)">添加</el-button>
</el-col>
</el-form-item>
<el-form-item label="摸底考试封面" prop="base_cover_url">
<el-upload action="#" accept="image/*"
:show-file-list="showFileList"
:limit="1"
:before-upload="beforeUpload1"
:on-remove="handleRemove">
<el-button size="small" style="border: 0;padding: 0 0;">
<img v-if="eagle.base_cover_url" :src="resource_url + eagle.base_cover_url" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-button>
</el-upload>
<div v-if="errFlg&&!eagle.base_cover_url" class="el-form-item__error">请上传摸底考试封面</div>
</el-form-item>
<el-form-item label="结业考试封面" prop="certification_cover_url">
<el-upload action="#" accept="image/*"
:show-file-list="showFileList"
:limit="1"
:before-upload="beforeUpload2"
:on-remove="handleRemove">
<el-button size="small" style="border: 0;padding: 0 0;">
<img v-if="eagle.certification_cover_url" :src="resource_url + eagle.certification_cover_url" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-button>
</el-upload>
<div v-if="errFlg&&!eagle.certification_cover_url" class="el-form-item__error">请上传结业考试封面</div>
</el-form-item>
<el-form-item label="封面" prop="cover_url">
<el-upload action="#" accept="image/*"
:show-file-list="showFileList"
:limit="1"
:before-upload="beforeUpload3"
:on-remove="handleRemove">
<el-button size="small" style="border: 0;padding: 0 0;">
<img v-if="eagle.cover_url" :src="resource_url + eagle.cover_url" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-button>
</el-upload>
<div v-if="errFlg&&!eagle.cover_url" class="el-form-item__error">请上传封面</div>
<el-form-item label="发布成绩" required>
<el-form-item prop="base_question">
<el-select class="form-input" v-model="base_question" filterable placeholder="请选择" @change="testChange()">
<el-option v-for="item in eagleQuestionCategories" :key="item.id" :label="item.name + '/' + item.question_count" :value="item"></el-option>
</el-select>
</el-form-item>
</el-form-item>
</el-form>
</el-row>
</el-col>
<el-col :span="10">
<div>
<el-row :gutter="10" class="box-title" type="flex" v-show="joinDoctorList.length > 0">
<el-col :span="24">
<label>参加考试人员</label>
</el-col>
</el-row>
<el-row :gutter="10" class="box-row" type="flex" v-show="joinDoctorList.length > 0">
<el-col :span="24" class="box">
<el-tag class="tag" v-for="tag in joinDoctorList" :key="tag.mobile_phone" :type="tagType" size="mini" closable>
{{tag.name}}&nbsp;{{tag.mobile_phone}}
</el-tag>
</el-col>
</el-row>
</div>
<div>
<el-row :gutter="10" class="box-title" type="flex" v-show="unregisteredList.length > 0">
<el-col :span="24">
<label>未注册人员</label>
</el-col>
</el-row>
<el-row :gutter="10" class="box-row" type="flex" v-show="unregisteredList.length > 0">
<el-col :span="24" class="box">
<el-tag class="tag" v-for="tag in unregisteredList" :key="tag.mobile_phone" :type="tagType" size="mini" >
{{tag.name}}&nbsp;{{tag.mobile_phone}}
</el-tag>
</el-col>
</el-row>
</div>
<div>
<el-row :gutter="10" class="box-title" type="flex" v-show="noCertifiedList.length > 0">
<el-col :span="24">
<label>未认证人员</label>
</el-col>
</el-row>
<el-row :gutter="10" class="box-row" type="flex" v-show="noCertifiedList.length > 0">
<el-col :span="24" class="box">
<el-tag class="tag" v-for="tag in noCertifiedList" :key="tag.mobile_phone" :type="tagType" size="mini" >
{{tag.name}}&nbsp;{{tag.mobile_phone}}
</el-tag>
</el-col>
</el-row>
</div>
<div>
<el-row :gutter="10" class="box-title" type="flex" v-show="chargeMobileList.length > 0">
<el-col :span="24">
<label>考试负责人</label>
</el-col>
</el-row>
<el-row :gutter="10" class="box-row" type="flex" v-show="chargeMobileList.length > 0">
<el-col :span="24" class="box">
<el-tag class="tag" v-for="tag in chargeMobileList" :key="tag.mobile_phone" :type="tagType" size="mini" closable>
{{tag.name}}&nbsp;{{tag.mobile_phone}}
</el-tag>
</el-col>
</el-row>
</div>
</el-col>
</el-row>
<el-row :gutter="10" class="" type="flex" justify="center">
<el-button type="primary" @click="save('eagleForm')">确 定</el-button>
......@@ -275,6 +75,9 @@
export default {
data() {
return {
testTime: [{no:0, value:'始终开放(默认)'}, {no:1, value:'定时开放'}],
testCount: [{no:0, value:'1(默认)'}, {no:1, value:'2'}, {no:2, value:'3'}, {no:3, value:'4'}, {no:4, value:'5'}, {no:5, value:'不限次数'}],
retreatMidway: [{no:0, value:'中途退出直接提交'}, {no:1, value:'中途退出'}],
active: this.$route.query.item//前页面参数
, mxalength: 11
, base_question_flag: false
......@@ -327,7 +130,7 @@
, certification_question: []//结业考试题库
, showFileList: false //不展示上传list
, eagleQuestionCategories: [
// {no: 1, value: '雄鹰计划初级题库'}, {no: 2, value: '雄鹰计划中级题库'}, {no: 3, value: '雄鹰计划高级题库'}
{no: 1, value: '无限制(默认)'}, {no: 2, value: '身份证'}, {no: 3, value: '身份证及学历'}
]//demo //TODO
//参加考试人员 TODO
, joinDoctorList: [
......
<template>
<div class="table">
<el-row :gutter="10" class="row" type="flex">
<el-col :span="3">
<span style="font-weight: bold;">{{active.name}}</span>
</el-col>
</el-row>
<el-row :gutter="10" class="row" type="flex">
<el-col :span="3">
<label>类型:</label>
</el-col>
<el-col :span="3">
<span>{{active.type | typeFilter}}</span>
</el-col>
<el-col :span="3">
<label>角色:</label>
</el-col>
<el-col :span="3">
<span>{{active.join_role| userRoleFilter(userRoleList)}}</span>
</el-col>
<el-col :span="3">
<label>活动开始时间:</label>
</el-col>
<el-col :span="6">
<span>{{active.start_date}}</span>
</el-col>
<el-col :span="3">
<el-button size="small" type="primary" @click="exportData()">导出</el-button>
</el-col>
</el-row>
<hr/>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="奖金情况" name="tab1">
<el-row :gutter="10" class="row" type="flex">
<el-col :span="3">
<label style="font-weight: bold;">本次奖金:</label>
</el-col>
<el-col :span="3">
<span style="font-weight: bold;">{{active.amount}}</span>
</el-col>
<el-col :span="3">
<label style="font-weight: bold;">人均最大金额:</label>
</el-col>
<el-col :span="3">
<span style="font-weight: bold;">{{active.amount}}</span>
</el-col>
<el-col :span="3">
<label style="font-weight: bold;">获得奖金人数:</label>
</el-col>
<el-col :span="3">
<span style="font-weight: bold;">{{'xxxxxx'}}</span>
</el-col>
<el-col :span="3">
<label style="font-weight: bold;">实际平分奖金:</label>
</el-col>
<el-col :span="3">
<span style="font-weight: bold;">{{'xxxxxx'}}</span>
</el-col>
</el-row>
<el-table :data="tableData" stripe border style="width: 100%" ref="multipleTable" @selection-change="handleSelectionChange('tab1')">
<el-table-column prop="index" label="序号" sortable width="100">
<template slot-scope="scope">
{{scope.$index+1}}
</template>
</el-table-column>
<el-table-column prop="doctor_name" label="姓名" sortable width="150">
</el-table-column>
<el-table-column prop="doctor_mobile" label="用户手机" sortable width="150">
</el-table-column>
<el-table-column prop="doctor_position" label="用户单位" sortable :show-overflow-tooltip="tooltip">
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000,1500, 2000]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</el-tab-pane>
<el-tab-pane label="答题详情" name="tab2">
<el-table :data="tableData" stripe border style="width: 100%" ref="multipleTable" @selection-change="handleSelectionChange('tab2')">
<el-table-column prop="index" label="序号" sortable width="100">
<template slot-scope="scope">
{{scope.$index+1}}
</template>
</el-table-column>
<el-table-column prop="doctor_name" label="姓名" sortable width="150">
</el-table-column>
<el-table-column prop="doctor_mobile" label="用户手机" sortable width="150">
</el-table-column>
<el-table-column prop="doctor_position" label="用户单位" sortable :show-overflow-tooltip="tooltip">
</el-table-column>
<el-table-column prop="resurrection_seq_no_str" label="复活题序号" sortable width="130">
</el-table-column>
<el-table-column prop="wrong_seq_no_str" label="答错题序号" sortable width="130">
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000,1500, 2000]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import {errorResponseCheck, openLoading, closeLoading} from "../../common/utils";
import fetch from '../../common/fetch';
export default {
data: function () {
return {
userRoleList: [],
active: this.$route.query.item,//前页面参数
activeName: 'tab1',//奖金情况
totalRows: 0,
pageSize: 15,
pageNo: 1,
tableData: [],
tooltip: true,//是否省略号显示
// tableDataAward: [],//奖金情况
// tableDataAnswer: [],//答题情况
// tab:'one'
}
},
created() {
let self = this;
self.search();
//获取用户角色list
self.getUserRole()
},
methods: {
handleSizeChange(val) {
this.pageSize = val;
this.search();
},
handleCurrentChange(val) {
this.pageNo = val;
this.search();
},
search() {
let self = this;
let requestUrl = '';
if (self.activeName === 'tab1') {
//奖金情况
requestUrl = 'activityResult/getActivityBonds';
} else if (self.activeName === 'tab2') {
//答题详情
requestUrl = 'activityResult/getActivityResult';
}
openLoading(self);
let promise = fetch(requestUrl, {
token: localStorage.getItem("token"),
activityId: self.active.id,
pageSize: self.pageSize,
pageNo: self.pageNo
}, 'GET', 'GET');
promise.then(function (data) {
closeLoading(self);
// if (self.activeName = 'tab1') {
// self.tableDataAward = data.list;
// } else if (self.activeName = 'tab2') {
// self.tableDataAward = data.list;
// }
self.tableData = data.list;
self.totalRows = data.totalRows;
}, function (error) {
errorResponseCheck(error, self)
});
},
getUserRole() {
//获取角色权限
let self = this;
let req = {token: localStorage.getItem("token")};
this.$axios.post(localStorage.getItem("Url") + 'activityDeploy/getUserRole'
, JSON.stringify(req)
).then(function (res) {
self.userRoleList = JSON.parse(JSON.stringify(res.data.list));//通过这个实现深拷贝
}).catch(function (error) {
errorResponseCheck(error, self)
});
},
handleSelectionChange(page) {
// let self = this;
// self.tab = page;
},
handleClick(tab, event) {
this.search();
},
exportData() {
//导出
let self = this;
openLoading(self);
let req = {token: localStorage.getItem("token"), activityId: self.active.id};
this.$axios.post(localStorage.getItem("Url") + 'activityResult/exportData'
, JSON.stringify(req)
).then(function (res) {
closeLoading(self);
let data = JSON.parse(JSON.stringify(res.data));
debugger
if (data.errFlag === 1) {
self.$message.error("导出失败");
} else {
window.location.href = data.exportUrl;
}
}).catch(function (error) {
errorResponseCheck(error, self)
});
}
},
filters: {
typeFilter: function (value) {
if (!value) return '';
if (value == 1) {
return '云鹊医典';
}
return value;
},
userRoleFilter: function (value, enumList) {
if (!value) return '';
let hash = {};
if (enumList != null && enumList.length > 0) {
for (let i = 0; i < enumList.length; i++) {
hash[enumList[i].role_code] = enumList[i].role_name;
}
}
return hash[value];
}
}
}
</script>
<style scoped>
</style>
<template>
<div class="table">
<el-row :gutter="10">
<el-col :span="2" class="padding-top-10">新建标签</el-col>
<el-col :span="4">
<el-input v-model="labelForm.label" placeholder="输入标签"></el-input>
</el-col>
<el-col :span="4">
<el-button type="primary" @click="submitForm('labelForm')">添加</el-button>
</el-col>
</el-row>
</br>
</br>
<div>
<el-tag style="width:200px;height: 40px;padding: 10px;margin: 10px;background-color: #13CE66;"
v-for="tag in tableData"
:key="tag.id"
:type="primary"
:gutter="30"
:size="medium"
:color="blue">
{{tag.label}}
</el-tag>
</div>
</div>
</template>
<script>
import fetch from '../../common/fetch';
import {isEmptyUtils} from '../../common/utils';
export default {
data: function(){
return {
labelForm: {},
tableData:[]
}
},
created() {
let self = this;
self.getData();
},
methods: {
submitForm() {
let self = this;
if(isEmptyUtils(self.labelForm) || isEmptyUtils(self.labelForm.label)) {
self.$message.error('标签为空不能添加');
return;
}
fetch('label/addActivityLabel', {
token: localStorage.getItem("token"),
data: self.labelForm
}, 'PUT', 'PUT').then(function (data) {
if(data.code =='ok') {
self.getData();
}else {
self.$message.error(data.msg);
}
});
},
getData() {
let self = this;
let promise = fetch('label/queryLabelList', {
token: localStorage.getItem("token"),
type:1
}, 'GET', 'GET')
promise.then(function (data) {
self.tableData = data.list;
}, function (error) {
});
}
}
}
</script>
<style scoped>
</style>
<template>
<div class="login-wrap">
<div class="ms-title">后台管理系统</div>
<div class="ms-login">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="0px" class="demo-ruleForm">
<el-form-item prop="username">
<el-input v-model="ruleForm.username" placeholder="username"></el-input>
</el-form-item>
<el-form-item prop="password">
<el-input type="password" placeholder="password" v-model="ruleForm.password" @keyup.enter.native="submitForm('ruleForm')"></el-input>
</el-form-item>
<div class="login-btn">
<el-button type="primary" @click="submitForm('ruleForm')">登录</el-button>
</div>
<p style="font-size:12px;line-height:30px;color:#999;">Tips : 用户名和密码随便填。</p>
</el-form>
</div>
</div>
</template>
<script>
export default {
data: function(){
return {
ruleForm: {
username: '',
password: ''
},
rules: {
username: [
{ required: true, message: '请输入用户名', trigger: 'blur' }
],
password: [
{ required: true, message: '请输入密码', trigger: 'blur' }
]
}
}
},
methods: {
submitForm(formName) {
const self = this;
self.$refs[formName].validate((valid) => {
if (valid) {
localStorage.setItem('ms_username',self.ruleForm.username);
self.$router.push('/readme');
} else {
console.log('error submit!!');
return false;
}
});
}
}
}
</script>
<style scoped>
.login-wrap{
position: relative;
width:100%;
height:100%;
}
.ms-title{
position: absolute;
top:50%;
width:100%;
margin-top: -230px;
text-align: center;
font-size:30px;
color: #fff;
}
.ms-login{
position: absolute;
left:50%;
top:50%;
width:300px;
height:160px;
margin:-150px 0 0 -190px;
padding:40px;
border-radius: 5px;
background: #fff;
}
.login-btn{
text-align: center;
}
.login-btn button{
width:100%;
height:36px;
}
</style>
\ No newline at end of file
<template>
<div>
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item><i class="el-icon-date"></i> 表单</el-breadcrumb-item>
<el-breadcrumb-item>markdown</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="plugins-tips">
Vue-SimpleMDE:Vue.js的Markdown Editor组件。
访问地址:<a href="https://github.com/F-loat/vue-simplemde" target="_blank">Vue-SimpleMDE</a>
</div>
<markdown-editor v-model="content" :configs="configs" ref="markdownEditor"></markdown-editor>
<div class="plugins-tips">
<p>既然用了markdown语法了,那么就有一个很实际的问题了。要怎么在前台展示数据呢?</p>
<br>
<p>这个时候就需要解析markdown语法了。可以使用 <a href="https://github.com/miaolz123/vue-markdown" target="_blank">vue-markdown</a>:一个基于vue.js的markdown语法解析插件。(这里不作展开,有需要自行了解)</p>
</div>
</div>
</template>
<script>
import { markdownEditor } from 'vue-simplemde';
export default {
data: function(){
return {
content:'',
configs: {
status: true,
initialValue: 'Hello BBK',
renderingConfig: {
codeSyntaxHighlighting: true,
highlightingTheme: 'atom-one-light'
}
}
}
},
components: {
markdownEditor
}
}
</script>
\ No newline at end of file
<template>
<div>
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item><i class="el-icon-date"></i> 图表</el-breadcrumb-item>
<el-breadcrumb-item>基础图表</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="plugins-tips">
vue-echarts-v3:基于vue2和eCharts.js3的图表组件。
访问地址:<a href="https://github.com/xlsdg/vue-echarts-v3" target="_blank">vue-echarts-v3</a>
</div>
<div class="content-title">基础图表</div>
<div class="echarts">
<IEcharts :option="line" ></IEcharts>
</div>
<div class="echarts">
<IEcharts :option="bar" ></IEcharts>
</div>
<div class="echarts">
<IEcharts :option="pie" ></IEcharts>
</div>
<div class="echarts">
<IEcharts :option="pie_radius" ></IEcharts>
</div>
<div class="content-title">混合图表</div>
<div class="mix-echarts">
<IEcharts :option="mix" ></IEcharts>
</div>
<v-schart canvasId="canvas" width="500" height="400" :data="data" type="bar"></v-schart>
</div>
</template>
<script>
// import IEcharts from 'vue-echarts-v3';
import vSchart from 'vue-schart';
import IEcharts from 'vue-echarts-v3/src/lite.vue';
import 'echarts/lib/chart/bar';
import 'echarts/lib/chart/line';
import 'echarts/lib/chart/pie';
import 'echarts/lib/component/legend';
import 'echarts/lib/component/tooltip';
import 'echarts/lib/component/title';
export default {
components: {
IEcharts,vSchart
},
data: () => ({
data:[
{name:'2012',value:1141},
{name:'2013',value:1499},
{name:'2014',value:2260},
{name:'2015',value:1170},
{name:'2016',value:970},
{name:'2017',value:1450}
],
line: {
color:["#20a0ff","#13CE66","#F7BA2A","#FF4949"],
title: {
text: '曲线图'
},
xAxis: {
data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
},
yAxis:{},
series: [
{
name: "销量",
type: "line",
data: [5, 20, 36, 10, 10, 20]
}
]
},
bar: {
color:["#20a0ff","#13CE66","#F7BA2A","#FF4949"],
title: {
text: '柱状图'
},
xAxis: {
data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
},
yAxis:{},
series: [
{
name: "销量",
type: "bar",
data: [5, 20, 36, 10, 10, 20]
}
]
},
pie: {
color:["#20a0ff","#13CE66","#F7BA2A","#FF4949","#61a0a8"],
title : {
text: '饼状图',
x:'center'
},
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
orient: 'vertical',
left: 'left',
data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋"]
},
series : [
{
name: '销量',
type: 'pie',
radius : '55%',
center: ['50%', '50%'],
data:[
{value:335, name:'衬衫'},
{value:310, name:'羊毛衫'},
{value:234, name:'雪纺衫'},
{value:135, name:'裤子'},
{value:548, name:'高跟鞋'}
],
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
},
pie_radius:{
color:["#20a0ff","#13CE66","#F7BA2A","#FF4949","#61a0a8"],
title : {
text: '环形图',
x:'center'
},
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
orient: 'vertical',
left: 'left',
data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋"]
},
series : [
{
name: '销量',
type: 'pie',
radius : ['40%','60%'],
data:[
{value:335, name:'衬衫'},
{value:310, name:'羊毛衫'},
{value:234, name:'雪纺衫'},
{value:135, name:'裤子'},
{value:548, name:'高跟鞋'}
],
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
},
mix:{
color:["#20a0ff","#13CE66","#F7BA2A","#FF4949","#61a0a8"],
legend: {
data:['步步高','小天才','imoo']
},
xAxis: {
data: ['周一','周二','周三','周四','周五','周末']
},
yAxis:{},
series: [
{
name: "步步高",
type: "line",
data: [15, 20, 26, 30, 40, 27]
},
{
name: "小天才",
type: "bar",
data: [5, 30, 36, 10, 34, 20]
},
{
name: "imoo",
type: "bar",
data: [35, 40, 30, 50, 60, 40]
}
]
}
})
}
</script>
<style scoped>
.echarts {
float: left;
width: 500px;
height: 400px;
}
.content-title{
clear: both;
font-weight: 400;
line-height: 50px;
margin: 10px 0;
font-size: 22px;
color: #1f2f3d;
}
.mix-echarts{
width:900px;
height:600px;
}
</style>
\ No newline at end of file
<template>
<div class="bonus-wrap">
<!--<div class="title">提现列表</div>-->
<div class="search-wrap">
<el-row class="row">
<el-col :span="3">
<label for="" class="p-label">姓名:</label>
</el-col>
<el-col :span="5">
<el-input
placeholder="请输入姓名"
v-model="doctor_name"
clearable>
</el-input>
</el-col>
<el-col :span="2">
<label for="" class="p-label" style="padding-left: 10px;">手机:</label>
</el-col>
<el-col :span="5">
<el-input
placeholder="请输入手机号"
v-model="doctor_mobile"
clearable>
</el-input>
</el-col>
</el-row>
<el-row class="row">
<el-col :span="3">
<label for="" class="p-label">地区:</label>
</el-col>
<el-col :span="21">
<el-select v-model="province_id" placeholder="省" clearable class="area-item" @change="provinceChange(province_id)">
<el-option
v-for="item in provinceList"
:key="item.province_id"
:label="item.province_name"
:value="item.province_id">
</el-option>
</el-select>
<el-select v-model="city_id" placeholder="市" clearable class="area-item" @change="cityChange(city_id)">
<el-option
v-for="item in cityList"
:key="item.city_id"
:label="item.city_name"
:value="item.city_id">
</el-option>
</el-select>
<el-select v-model="county_id" placeholder="区/县" clearable class="area-item" @change="countyChange(county_id)">
<el-option
v-for="item in countyList"
:key="item.county_id"
:label="item.county_name"
:value="item.county_id">
</el-option>
</el-select>
<el-select v-model="town_id" placeholder="乡/镇/街道" clearable class="area-item" @change="townChange(town_id)">
<el-option
v-for="item in townList"
:key="item.town_id"
:label="item.town_name"
:value="item.town_id">
</el-option>
</el-select>
<el-select v-model="hospital_id" placeholder="医院" clearable class="area-item">
<el-option
v-for="item in hospitalList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-col>
</el-row>
<!--<el-row class="row">-->
<!--<el-col :span="3">-->
<!--<label for="" class="p-label">提现时间:</label>-->
<!--</el-col>-->
<!--<el-col :span="6">-->
<!--<el-date-picker-->
<!--v-model="dateStart"-->
<!--type="date"-->
<!--placeholder="选择日期">-->
<!--</el-date-picker>-->
<!--</el-col>-->
<!--<el-col :span="6">-->
<!--<el-date-picker-->
<!--v-model="dateEnd"-->
<!--type="date"-->
<!--placeholder="选择日期">-->
<!--</el-date-picker>-->
<!--</el-col>-->
<!--</el-row>-->
</div>
<div class="search-tool">
<el-button type="primary" @click="search"><i class="el-icon-search"></i>&nbsp;搜索</el-button>
</div>
<el-table
:data="tableData"
style="width: 100%">
<el-table-column
width="110"
prop="doctor_name"
label="姓名">
</el-table-column>
<el-table-column
prop="idCard"
label="身份证">
</el-table-column>
<el-table-column
width="150"
prop="doctor_mobile"
label="手机号">
</el-table-column>
<el-table-column
prop="doctor_hospital_name"
label="医院">
</el-table-column>
<el-table-column
width="130"
prop="total_award"
label="获得总奖金">
</el-table-column>
<el-table-column
width="110"
prop="total_withdraw"
label="累计提现">
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button
size="mini"
@click="showDrawDetail(scope.$index, scope.row)">提现明细</el-button>
<el-button
size="mini"
@click="showPrizeDetail(scope.$index, scope.row)">获奖明细</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000,1500, 2000]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
<el-dialog title="提现明细" :visible.sync="detailTableVisible">
<el-table :data="detailData">
<el-table-column property="index" label="序号" width="150">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.$index+1}}</span>
</template>
</el-table-column>
<el-table-column property="created_time" label="提现日期"></el-table-column>
<el-table-column property="amount" label="提现金额"></el-table-column>
<el-table-column property="red_packet_status" label="状态领取">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.red_packet_status |packetStatusFilter }}</span>
</template>
</el-table-column>
</el-table>
</el-dialog>
<el-dialog title="获奖明细" :visible.sync="prizeTableVisible">
<el-table :data="prizeData">
<el-table-column property="index" label="序号" width="150">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.$index +1}}</span>
</template>
</el-table-column>
<el-table-column property="created_time" label="获奖日期"></el-table-column>
<el-table-column property="amount" label="获奖金额(元)"></el-table-column>
</el-table>
</el-dialog>
</div>
</template>
<style scoped>
.search-tool {
padding-left: 100px;
margin-bottom: 20px;
}
.area-item {
width: 109px;
margin-right: 5px;
}
.row {
margin-bottom: 15px;
}
.search-wrap {
width: 800px;
}
.title {
font-size:18px;
padding-bottom: 5px;
margin-bottom: 20px;
color: #303133;
}
.p-label {
color: #606266;
font-size: 14px;
line-height: 38px;
width: 100%;
display: inline-block;
}
</style>
<script>
import fetch from '../../common/fetch';
import {positionService} from '../../common/position_service'
export default {
data(){
return {
pageNo: 1,
pageSize: 15,
totalRows: 0,
doctor_name: '',
doctor_mobile: '',
province_id: '',
city_id: '',
county_id: '',
town_id: '',
hospital_id: '',
provinceList: [],
cityList: [],
countyList: [],
townList: [],
hospitalList: [],
dateStart: '',
dateEnd: '',
tableData: [],
detailTableVisible: false,
prizeTableVisible: false,
detailData: [],
prizeData: []
}
},
created() {
positionService.getProvinceList().then(res => {
this.provinceList = res.provinceList
});
this.search();
},
methods: {
search() {
let para = {
doctor_name: this.doctor_name,
doctor_mobile: this.doctor_mobile,
province_id: this.province_id,
city_id: this.city_id,
county_id: this.county_id,
town_id: this.town_id,
hospital_id: this.hospital_id,
pageSize: this.pageSize,
pageNo: this.pageNo,
token: localStorage.getItem("token")
// dateStart: this.dateStart,
// dateEnd: this.dateEnd
};
fetch('person/getPersonalBonds', para, 'GET', 'GET').then(data => {
this.tableData = data.personalBonds;
this.totalRows = data.totalRows;
});
},
handleSizeChange(size) {
this.pageSize = size
this.search()
},
handleCurrentChange(no) {
this.pageNo = no
this.search()
},
showDrawDetail(index,row) {
let self = this;
this.detailTableVisible = true
let param = {
doctor_id: row.doctor_id,
token: localStorage.getItem("token")
};
let promise = fetch('person/historyCash', param, 'POST', 'POST')
promise.then(function (data) {
self.detailData = data.withdrawCashList;
}, function (error) {
});
},
showPrizeDetail(index,row) {
let self = this;
this.prizeTableVisible = true
let param = {
doctor_id: row.doctor_id,
token: localStorage.getItem("token")
};
let promise = fetch('person/historyBonds', param, 'POST', 'POST')
promise.then(function (data) {
self.prizeData = data.withdrawRecordList;
}, function (error) {
});
},
provinceChange(id) {
if(!id) {
this.cityList = []
this.city_id = ''
return
}
positionService.getCityListData(id).then(res => {
this.cityList = res.cityList
this.city_id = ''
})
},
cityChange(id) {
if(!id) {
this.countyList = []
this.county_id = ''
return
}
positionService.getCountyListData(id).then(res => {
this.countyList = res.countyList
this.county_id = ''
})
},
countyChange(id) {
if(!id) {
this.townList = []
this.town_id = ''
this.getHospital()
return
}
positionService.getTownListData(id).then(res => {
this.townList = res.townList
if(this.town_id) {
this.town_id = ''
} else {
this.getHospital()
}
})
},
townChange() {
this.getHospital()
},
getHospital() {
if(!this.county && !this.town) {
this.hospitalList = []
this.hospital_id = ''
return
}
positionService.getHospitalListData(this.county, this.town).then(res => {
this.hospitalList = res.hospitalList
this.hospital_id = ''
})
}
},
filters: {
packetStatusFilter: function (value) {
let hash = {
0:'未获取状态',
1:'发放中',
2:'已发放待领取',
3:'发放失败',
4: '已领取',
5: '退款中',
6: '已退款'
};
return hash[value];
}
}
}
</script>
<template>
<div class="table">
<el-row :gutter="10" class="row">
<el-col :span="2" :offset="20">
<el-button type="primary" icon="search" @click="search">搜索</el-button>
</el-col>
<el-col :span="2">
<el-button type="primary" icon="edit" @click="dialogFormVisible = true;resource = Object.assign({},form)">新增</el-button>
</el-col>
</el-row>
<el-table :data="tableData" stripe border style="width: 100%" ref="multipleTable">
<el-table-column prop="name" label="音频名称" :show-overflow-tooltip="tooltip" sortable width="150">
</el-table-column>
<el-table-column label="音频大小" sortable min-width="100">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.size | sizeFilter }}</span>
</template>
</el-table-column>
<el-table-column prop="created_time" label="上传时间" sortable min-width="170">
</el-table-column>
<el-table-column label="音频状态" sortable min-width="100">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.status | statusFilter }}</span>
</template>
</el-table-column>
<el-table-column label="操作">
<template scope="scope">
<el-button size="small" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!--新增页面-->
<el-dialog title="新增音频" :visible.sync="dialogFormVisible">
<el-form :model="resource" ref="form" label-suffix=":">
<el-form-item label="上传音频">
<el-upload class="upload-demo" style="max-width: 270px;"
action="#"
accept=".mp3"
:before-upload="beforeUpload"
:on-remove="handleRemove"
:file-list="fileList"
:limit="1"
list-type="text">
<el-button size="small" type="primary">上传音频</el-button>
<!--<el-tag v-show="model.name" type="success" closable>{{model.name}}</el-tag>-->
<!--<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>-->
<!--<input type="file" id="imageUpload1" accept=".mp3" @change="handleChange" style="display: none;"/>-->
<!--<div id="preview1">-->
<!--<el-button size="small" @click="uploadClick()">添加</el-button>-->
<!--</div>-->
</el-upload>
<el-progress :text-inside="true" :stroke-width="16" :percentage="uploadProgress" status="success" v-show="uploadProgress>0&&uploadProgress<100"></el-progress>
<audio id="audio" style="max-width: 270px;" controls="" :src="resource.audioAddress" v-show="resource.audioAddress!=null"></audio>
</el-form-item>
<el-form-item label="音频名称" prop="name">
<el-input v-model="resource.name" class="form-input"></el-input>
</el-form-item>
<el-form-item label="音频大小" prop="size">
<!--< v-model="resource.name" class="form-input"></>-->
<label>{{resource.size | sizeFilter}}</label>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button type="primary" @click="save();">确 定</el-button>
<el-button @click="dialogFormVisible=false">取 消</el-button>
</div>
</el-dialog>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000,1500, 2000]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</div>
</template>
<script>
import {ossUpload, getFilePath} from '../../common/ossUtil';
import {errorResponseCheck, isEmptyUtils, isNotEmptyUtils, openLoading, closeLoading, messageBox} from "../../common/utils";
export default {
data() {
return {
tooltip: true,//是否省略号显示
form: {
name: null,
size: null,
url: null,
account_time: 0,
time: 0,
audioAddress: null,//音频全路径
},
resource: {},
dialogFormVisible: false,
tableData: [],//列表数据list
totalRows: 0,
pageSize: 15,
pageNo: 1,
fileList: [],//上传文件列表
uploadProgress: 0,//上传进度
uploadStatus: false//是否在上传
}
},
created() {
//初始化检索
this.search();
},
methods: {
handleSizeChange(val) {
this.pageSize = val;
this.search();
},
handleCurrentChange(val) {
this.pageNo = val;
this.search();
},
search() {
let self = this;
// openLoading(self);
let req = {
token: localStorage.getItem("token"),
pageSize: self.pageSize,
pageNo: self.pageNo
};
self.$axios.post(localStorage.getItem("Url") + 'AudioDeploy/getAudioDeploy'
, JSON.stringify(req)
).then(function (res) {
// closeLoading(self);
let data = JSON.parse(JSON.stringify(res.data));//通过这个实现深拷贝
self.tableData = data.list;
self.totalRows = data.totalRows;
}).catch(function (error) {
errorResponseCheck(error, self);
});
},
beforeUpload(file) {
let self = this;
//如果没有选择文件,返回
if (isEmptyUtils(file)) {
return;
}
//上传 指定文件名
ossUpload(self, file, getFilePath(file), null, null, null).then(function (path) {
//回显的上传文件列表
let list = [{}];
list[0].name = file.name;
list[0].url = localStorage.getItem("resource_url") + path;
self.fileList = list;
self.resource.audioAddress = localStorage.getItem("resource_url") + path;
self.resource.name = file.name;
self.resource.size = file.size;
self.resource.url = path;
// self.$message('上传成功!');
});
return false;
},
handleRemove(file, fileList) {
//重置resource
this.resource.audioAddress = null;
// this.resource.name = null;
this.resource.size = null;
this.resource.url = null;
this.resource.account_time = 0;
this.resource.time = 0;
},
save() {
//添加
let self = this;
if (self.uploadStatus) {
self.$message.warning('正在上传,请稍后...');
return;
}
if (isEmptyUtils(self.resource.name) || isEmptyUtils(self.resource.size)
|| isEmptyUtils(self.resource.url) || isEmptyUtils(self.resource.name)
|| isEmptyUtils(self.resource.account_time) || isEmptyUtils(self.resource.time)) {
self.$message.error('请上传文件');
return;
}
openLoading(self);
let req = {
token: localStorage.getItem("token"),
model: self.resource
};
self.$axios.post(localStorage.getItem("Url") + 'AudioDeploy/saveAudioDeploy'
, JSON.stringify(req)
).then(function (res) {
closeLoading(self);
//隐藏弹出层
self.dialogFormVisible = false;
self.fileList = [];
self.$message.success('保存成功');
self.search();
}).catch(function (error) {
errorResponseCheck(error, self);
});
},
handleDelete(index, row) {
//删除
let self = this;
if (row.status === 2) {
self.$message.warning('解绑后才可以删除');
return;
}
messageBox(self, "提示", "是否删除?", "是", function () {
let req = {
token: localStorage.getItem("token"),
model: row
};
self.$axios.post(localStorage.getItem("Url") + 'AudioDeploy/delAudioDeploy'
, JSON.stringify(req)
).then(function (res) {
let data = JSON.parse(JSON.stringify(res.data));//通过这个实现深拷贝
if (data.flag === 1) {
self.$message.warning("解绑后才可以删除");
} else {
self.$message.info("删除成功");
self.search();
}
}).catch(function (error) {
errorResponseCheck(error, self);
});
}, "否", function () {
}, "info");
},
},
computed: {
onRoutes() {
return this.$route.path.replace('/', '');
}
},
watch: {
uploadStatus: function (val) {
//在此处设置音频时长
let self = this;
//当上传完成时
if (val === false) {
let audio = document.getElementById("audio");
//当音频加载完成可以播放时,获取时长(方法2)
audio.oncanplay = function () {
self.resource.account_time = parseInt(audio.duration)
self.resource.time = parseInt(audio.duration)
};
}
}
},
filters: {
sizeFilter: function (value) {
if (!value) return '0M';
return (value / 1000 / 1000).toFixed(2) + 'M';
},
statusFilter: function (value) {
if (!value) return '';
let hash = {
1: '未绑定',
2: '已绑定'
};
return hash[value];
// let hash = {};
// if (enumList != null && enumList.length > 0) {
// for (let i = 0; i < enumList.length; i++) {
// hash[enumList[i].role_code] = enumList[i].role_name;
// }
// }
//
// return hash[value];
}
}
}
</script>
<style scoped>
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409EFF;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
.row {
margin-bottom: 20px;
}
.padding-top-10 {
padding-top: 10px;
}
</style>
<template>
<div>
<div>
<h2>欢迎来到医典系统!</h2>
</div>
</div>
</template>
<script>
export default {
data: function(){
return {}
}
}
</script>
<style scoped>
</style>
<template>
<div>
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item><i class="el-icon-date"></i> 表单</el-breadcrumb-item>
<el-breadcrumb-item>图片上传</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="content-title">支持拖拽</div>
<div class="plugins-tips">
Element UI自带上传组件。
访问地址:<a href="http://element.eleme.io/#/zh-CN/component/upload" target="_blank">Element UI Upload</a>
</div>
<el-upload
class="upload-demo"
drag
action="/api/posts/"
multiple>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件,且不超过500kb</div>
</el-upload>
<div class="content-title">支持裁剪</div>
<div class="plugins-tips">
Vue-Core-Image-Upload:一款轻量级的vue上传插件,支持裁剪。
访问地址:<a href="https://github.com/Vanthink-UED/vue-core-image-upload" target="_blank">Vue-Core-Image-Upload</a>
</div>
<img class="pre-img" :src="src" alt="">
<vue-core-image-upload :class="['pure-button','pure-button-primary','js-btn-crop']"
:crop="true"
text="上传图片"
url="/api/posts/"
extensions="png,gif,jpeg,jpg"
@:imageuploaded="imageuploaded"
@:errorhandle="handleError"></vue-core-image-upload>
</div>
</template>
<script>
import VueCoreImageUpload from 'vue-core-image-upload';
export default {
data: function(){
return {
src: './static/img/img.jpg',
fileList: []
}
},
components: {
VueCoreImageUpload
},
methods:{
imageuploaded(res) {
console.log(res)
},
handleError(){
this.$notify.error({
title: '上传失败',
message: '图片上传接口上传失败,可更改为自己的服务器接口'
});
}
}
}
</script>
<style scoped>
.content-title{
font-weight: 400;
line-height: 50px;
margin: 10px 0;
font-size: 22px;
color: #1f2f3d;
}
.pre-img{
width:250px;
height: 250px;
margin-bottom: 20px;
}
</style>
\ No newline at end of file
<template>
<div>
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item><i class="el-icon-date"></i> 表单</el-breadcrumb-item>
<el-breadcrumb-item>编辑器</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="plugins-tips">
Vue-Quill-Editor:基于Quill、适用于Vue2的富文本编辑器。
访问地址:<a href="https://github.com/surmon-china/vue-quill-editor" target="_blank">vue-quill-editor</a>
</div>
<quill-editor ref="myTextEditor" v-model="content" :config="editorOption"></quill-editor>
<el-button class="editor-btn" type="primary" @click="submit">提交</el-button>
</div>
</template>
<script>
import { quillEditor } from 'vue-quill-editor';
export default {
data: function(){
return {
content: '<p>Hello BBK</p>',
editorOption: {
// something config
}
}
},
components: {
quillEditor
},
methods: {
onEditorChange({ editor, html, text }) {
this.content = html;
},
submit(){
console.log(this.content);
this.$message.success('提交成功!');
}
},
computed: {
editor() {
return this.$refs.myTextEditor.quillEditor;
}
}
}
</script>
<style scoped>
.editor-btn{
margin-top: 20px;
}
</style>
\ No newline at end of file
<template>
<div class="table">
<div class="crumbs">
<el-breadcrumb separator="/">
<el-breadcrumb-item><i class="el-icon-menu"></i> 表格</el-breadcrumb-item>
<el-breadcrumb-item>Vue表格组件</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="plugins-tips">
vue-datasource:一个用于动态创建表格的vue.js服务端组件。
访问地址:<a href="https://github.com/coderdiaz/vue-datasource" target="_blank">vue-datasource</a>
</div>
<datasource language="en" :table-data="getData" :columns="columns" :pagination="information.pagination"
:actions="actions"
:change="changePage"
:searching="onSearch"></datasource>
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:on-success="handleSuccess"
:on-change="handleChange"
:on-error="handleError"
multiple
:limit="3"
:on-exceed="handleExceed"
:file-list="fileList">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
</el-upload>
</div>
</template>
<script>
import axios from 'axios';
import Datasource from 'vue-datasource';
export default {
data: function(){
const self = this;
return {
url: './static/datasource.json',
information: {
pagination:{},
data:[],
fileList: [{name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}]
},
columns: [
{
name: 'Id',
key: 'id',
},
{
name: 'Name',
key: 'name',
},
{
name: 'email',
key: 'email',
},
{
name: 'ip',
key: 'ip',
}
],
actions: [
{
text: 'Click',
class: 'btn-primary',
event(e, row) {
self.$message('选中的行数: ' + row.row.id);
}
}
],
query:''
}
},
components: {
Datasource
},
methods: {
changePage(values) {
this.information.pagination.per_page = values.perpage;
this.information.data = this.information.data;
},
onSearch(searchQuery) {
this.query = searchQuery;
},
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
},
handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`);
},
handleSuccess(response, file, fileList) {
debugger
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`);
},
handleChange(file, fileList) {
console.log("handleChange");
debugger;
console.log("handleChange");
},
handleError(file, fileList) {
console.log("error");
debugger;
console.log("handleChange");
},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }?`);
}
},
computed:{
getData(){
const self = this;
return self.information.data.filter(function (d) {
if(d.name.indexOf(self.query) > -1){
return d;
}
})
}
},
beforeMount(){
if(process.env.NODE_ENV === 'development'){
this.url = '/ms/table/source';
};
axios.get(this.url).then( (res) => {
this.information = res.data;
})
}
}
</script>
<style src="../../../static/css/datasource.css"></style>
<template>
<div class="table">
<!--<div class="title">提现列表</div>-->
<div class="search-wrap">
<el-row class="row">
<el-col :span="3">
<label for="" class="p-label">姓名:</label>
</el-col>
<el-col :span="5">
<el-input
placeholder="请输入姓名"
v-model="name"
clearable>
</el-input>
</el-col>
<el-col :span="2">
<label for="" class="p-label" style="padding-left: 10px;">手机:</label>
</el-col>
<el-col :span="5">
<el-input
placeholder="请输入手机号"
v-model="mobile"
clearable>
</el-input>
</el-col>
</el-row>
<el-row class="row">
<el-col :span="3">
<label for="" class="p-label">地区:</label>
</el-col>
<el-col :span="21">
<el-select v-model="province" placeholder="省" clearable class="area-item" @change="provinceChange(province)">
<el-option
v-for="item in provinceList"
:key="item.province_id"
:label="item.province_name"
:value="item.province_id">
</el-option>
</el-select>
<el-select v-model="city" placeholder="市" clearable class="area-item" @change="cityChange(city)">
<el-option
v-for="item in cityList"
:key="item.city_id"
:label="item.city_name"
:value="item.city_id">
</el-option>
</el-select>
<el-select v-model="county" placeholder="区/县" clearable class="area-item" @change="countyChange(county)">
<el-option
v-for="item in countyList"
:key="item.county_id"
:label="item.county_name"
:value="item.county_id">
</el-option>
</el-select>
<el-select v-model="town" placeholder="乡/镇/街道" clearable class="area-item" @change="townChange(town)">
<el-option
v-for="item in townList"
:key="item.town_id"
:label="item.town_name"
:value="item.town_id">
</el-option>
</el-select>
<el-select v-model="hospital" placeholder="医院" clearable class="area-item">
<el-option
v-for="item in hospitalList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-col>
</el-row>
<el-row class="row">
<el-col :span="3">
<label for="" class="p-label">发放状态:</label>
</el-col>
<el-col :span="6">
<el-select v-model="sendStatus" placeholder="发放状态" clearable class="p-label" @change="sendStatusChange(sendStatus)">
<el-option
v-for="item in sendStatusList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-col>
<el-col :span="3">
<label for="" class="p-label" style="padding-left: 10px;">领取状态:</label>
</el-col>
<el-col :span="6">
<el-select v-model="receiveStatus" placeholder="领取状态" clearable class="p-label" @change="receiveStatusChange(receiveStatus)">
<el-option
v-for="item in receiveStatusList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-col>
</el-row>
<el-row class="row">
<el-col :span="3">
<label for="" class="p-label">提现时间:</label>
</el-col>
<el-col :span="6">
<el-date-picker
v-model="dateStart"
type="date"
placeholder="选择日期">
</el-date-picker>
</el-col>
<el-col :span="6">
<el-date-picker
v-model="dateEnd"
type="date"
placeholder="选择日期">
</el-date-picker>
</el-col>
</el-row>
</div>
<div class="search-tool">
<el-button type="primary" @click="search">搜索</el-button>
</div>
<el-table :data="tableData" stripe border style="width: 100%" ref="multipleTable" @selection-change="handleSelectionChange">
<!--<el-table-column type="selection" width="55"></el-table-column>-->
<el-table-column prop="name" label="姓名" sortable width="150">
</el-table-column>
<el-table-column prop="mobile_phone" label="手机号" width="120">
</el-table-column>
<el-table-column prop="hospital" label="医院" >
</el-table-column>
<el-table-column prop="created_time" label="提现时间" >
</el-table-column>
<el-table-column prop="total_amount" label="提现金额" >
</el-table-column>
<el-table-column prop="isReceived" label="红包领取状态" >
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000,1500, 2000]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</div>
</template>
<script>
import fetch from '../../common/fetch';
import {ossUpload, getFilePath} from '../../common/ossUtil';
import {errorResponseCheck, isEmptyUtils, isNotEmptyUtils} from '../../common/utils';
import vQuestionModel from './model/QuestionModel.vue';
import {positionService} from '../../common/position_service'
export default {
data() {
return {
name: '',
mobile: '',
province: '',
city: '',
county: '',
town: '',
hospital: '',
provinceList: [],
cityList: [],
countyList: [],
townList: [],
hospitalList: [],
sendStatus: '',
receiveStatus: '',
sendStatusList: [{
id: '0',
name: '待处理'
}, {
id: '1',
name: '成功'
}, {
id: '2',
name: '失败'
}],
receiveStatusList: [{
id: '0',
name: '未获取'
}, {
id: '1',
name: '发放中'
}, {
id: '2',
name: '已发放待领取'
}, {
id: '3',
name: '发放失败'
}, {
id: '4',
name: '已领取'
}, {
id: '5',
name: '退款中'
}, {
id: '6',
name: '已退款'
}],
dateStart: '',
dateEnd: '',
tableData: [],
dialogTableVisible: false,
dialogFormVisible: false,
personAmt:0,
form:{},
formObj: {
name:'',
join_role:4,
type:1,
start_date:'',
amount:'',
avg_max_amount:'',
max_answer_num:'',
min_online_num:'',
count_c:1,
image_url:''
},
formLabelWidth: '120px',
totalRows:0,
pageSize:15,
pageNo:1,
searchParam:{status:1}
}
},
created() {
let self = this;
self.getData();
positionService.getProvinceList().then(res => {
this.provinceList = res.provinceList
});
/*positionService.getCityList().then(res => {
this.cityList = res.cityList
});
positionService.getProvinceList().then(res => {
this.provinceList = res.provinceList
});
positionService.getProvinceList().then(res => {
this.provinceList = res.provinceList
});*/
},
methods: {
handleSizeChange(val) {
this.pageSize =val;
this.search();
},
handleCurrentChange(val){
this.pageNo = val;
this.search();
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
getData(){
let self = this;
self.search();
// self.searchStatus();
},
search(){
this.is_search = true;
let self = this;
// debugger
let promise = fetch('person/cash/list',{
// token:localStorage.getItem("token"),
token:"25BC19B82ECB26075DFE786B2B84A278",
name:self.name,
mobile:self.mobile,
province:self.province,
city:self.city,
county:self.county,
town:self.town,
hospital:self.hospital,
sendStatus:self.sendStatus,
receiveStatus:self.receiveStatus,
dateStart: self.dateStart,
dateEnd: self.dateEnd,
pageSize:self.pageSize,
pageNo:self.pageNo
},'POST','POST')
promise.then(function (data) {
// alert(11)
self.tableData = data.list;
self.totalRows = data.totalRows;
},function (error) {
});
},
searchStatus(){
this.is_search = true;
let self = this;
// debugger
let promise = fetch('person/cash/status',{
// token:localStorage.getItem("token"),
token:"25BC19B82ECB26075DFE786B2B84A278",
name:self.name,
},'GET','GET')
promise.then(function (data) {
// alert(11)
self.sendStatusList = data.sendStatusList;
self.receiveStatusList = data.receiveStatusList;
},function (error) {
});
},
provinceChange(id) {
if(!id) {
this.cityList = []
this.city = ''
return
}
positionService.getCityListData(id).then(res => {
this.cityList = res.cityList
this.city = ''
})
},
cityChange(id) {
if(!id) {
this.countyList = []
this.county = ''
return
}
positionService.getCountyListData(id).then(res => {
this.countyList = res.countyList
this.county = ''
})
},
countyChange(id) {
if(!id) {
this.townList = []
this.town = ''
this.getHospital()
return
}
positionService.getTownListData(id).then(res => {
this.townList = res.townList
if(this.town) {
this.town = ''
} else {
this.getHospital()
}
})
},
townChange() {
this.getHospital()
},
getHospital() {
if(!this.county && !this.town) {
this.hospitalList = []
this.hospital = ''
return
}
positionService.getHospitalListData(this.county, this.town).then(res => {
this.hospitalList = res.hospitalList
this.hospital = ''
})
},
sendStatusChange(sendStatus){
this.sendStatus = sendStatus;
},
receiveStatusChange(receiveStatus){
this.receiveStatus = receiveStatus;
}
},
computed: {
onRoutes() {
return this.$route.path.replace('/', '');
}
}
}
</script>
<style scoped>
/*.handle-box{*/
/*margin-bottom: 20px;*/
/*}*/
/*.handle-select{*/
/*width: 120px;*/
/*}*/
/*.handle-input{*/
/*width: 300px;*/
/*display: inline-block;*/
/*}*/
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409EFF;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
.search-tool {
padding-left: 100px;
margin-bottom: 20px;
}
.area-item {
width: 109px;
margin-right: 5px;
}
.row {
margin-bottom: 15px;
}
.search-wrap {
width: 800px;
}
.title {
font-size:18px;
padding-bottom: 5px;
margin-bottom: 20px;
color: #303133;
}
.p-label {
color: #606266;
font-size: 14px;
line-height: 38px;
width: 100%;
display: inline-block;
}
</style>
......@@ -19,18 +19,15 @@ export default new Router({
path: '/',
redirect: 'eagle-training'
},
{
path: 'eagle-question',
component: resolve => require(['../components/page/EagleQuestion.vue'], resolve)
},
{
path: 'create-question',
component: resolve => require(['../components/page/CreateQuestion.vue'], resolve)
},
{
path: 'eagle-training',
component: resolve => require(['../components/page/EagleTraining.vue'], resolve)
},
{
path: 'editActive',
component: resolve => require(['../components/page/EditActive.vue'], resolve)
}
]
}
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册