parent
dd874abd10
commit
34985bb95b
@ -1,29 +1,117 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<div class="statistics">
|
||||
<div>
|
||||
<el-card>
|
||||
<div>营业统计</div>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
<div>
|
||||
<el-card>
|
||||
<div>人效统计</div>
|
||||
</el-card>
|
||||
</div>
|
||||
<div>
|
||||
<el-card>
|
||||
<div>客户统计</div>
|
||||
</el-card>
|
||||
</div>
|
||||
<div>
|
||||
<el-card>
|
||||
<div>订单统计</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chart">
|
||||
<div id="col-chart"></div>
|
||||
<div id="line-chart"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
created: function() {
|
||||
},
|
||||
methods: {
|
||||
import echarts from "echarts"
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
let col = echarts.init(document.getElementById('col-chart'))
|
||||
col.setOption({
|
||||
title: {
|
||||
text: '营业与收入'
|
||||
},
|
||||
tooltip: {},
|
||||
xAxis: {
|
||||
data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
|
||||
},
|
||||
yAxis: {},
|
||||
series: [{
|
||||
name: '销量',
|
||||
type: 'bar',
|
||||
data: [5, 20, 36, 10, 10, 20]
|
||||
}]
|
||||
})
|
||||
|
||||
let line = echarts.init(document.getElementById('line-chart'))
|
||||
line.setOption({
|
||||
title: {
|
||||
text: '客户与订单'
|
||||
},
|
||||
tooltip: {},
|
||||
xAxis: {
|
||||
data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
|
||||
},
|
||||
yAxis: {},
|
||||
series: [{
|
||||
name: '销量',
|
||||
type: 'bar',
|
||||
data: [5, 20, 36, 10, 10, 20]
|
||||
}]
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.statistics{
|
||||
display: flex;
|
||||
|
||||
&>div{
|
||||
height: 100px;
|
||||
flex: 1;
|
||||
margin-right: 20px;
|
||||
|
||||
&:last-child{
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.chart{
|
||||
display: flex;
|
||||
#col-chart {
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
flex: 1;
|
||||
height: 300px;
|
||||
margin-right: 30px;
|
||||
}
|
||||
#line-chart {
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
flex: 1;
|
||||
height: 300px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -0,0 +1,144 @@
|
||||
<template>
|
||||
<div>
|
||||
<Modal :value="isShow" title="排班" width="48" @on-visible-change="e => $emit('update:isShow',e)">
|
||||
<template v-slot:default>
|
||||
<el-form ref="elForm" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="时间选择" prop="end_time">
|
||||
<div style="font-weight: 600">{{ date }}</div>
|
||||
<el-time-picker
|
||||
v-model="time"
|
||||
arrow-control
|
||||
end-placeholder="结束时间"
|
||||
is-range
|
||||
placeholder="选择时间范围"
|
||||
range-separator="-"
|
||||
start-placeholder="开始时间"
|
||||
style="width: 300px;"
|
||||
value-format="hh:mm:ss"
|
||||
@change="timePick">
|
||||
</el-time-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="护工选择" prop="nurse_id">
|
||||
<el-select v-model="form.nurse_id" placeholder="请选择护工" style="width: 300px;">
|
||||
<el-option v-for="(item,index) in nurses" :key="item.index" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="服务项目" prop="schedule_list_skus">
|
||||
<el-checkbox-group v-model="form.schedule_list_skus">
|
||||
<template v-for="(item) in skus">
|
||||
<el-checkbox :label="item.id">{{ item.name }}</el-checkbox>
|
||||
</template>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<template v-slot:footer>
|
||||
<Button @click="$emit('update:isShow',false)">取消</Button>
|
||||
<Button type="primary" @click="submit">确认</Button>
|
||||
</template>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {parseTime} from '@/utils'
|
||||
import {scheduleSave} from '@/api/schedule'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
customerId: [Number, String],
|
||||
orderId: [Number, String],
|
||||
productId: [Number, String],
|
||||
date: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
skus: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
nurses: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
customer_id: '',
|
||||
product_id: '',
|
||||
order_id: '',
|
||||
nurse_id: '',
|
||||
start_time:'',
|
||||
end_time: '',
|
||||
schedule_list_skus: []
|
||||
},
|
||||
time: [new Date(),new Date()],
|
||||
rules: {
|
||||
nurse_id: [
|
||||
{required: true, message: '请选择护工'}
|
||||
],
|
||||
start_time: [
|
||||
{required: true, message: '请选择开始时间'}
|
||||
],
|
||||
end_time: [
|
||||
{required: true, message: '请选择结束时间'}
|
||||
],
|
||||
schedule_list_skus: [
|
||||
{required: true, message: '请选择护理项目'}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
timePick(e) {
|
||||
this.form.start_time = `${this.date} ${e[0]}`
|
||||
this.form.end_time = `${this.date} ${e[1]}`
|
||||
},
|
||||
submit() {
|
||||
this.form.customer_id = this.customerId
|
||||
this.form.product_id = this.productId
|
||||
this.form.order_id = this.orderId
|
||||
let temp = this.form.schedule_list_skus.map(item => {
|
||||
return {sku_id: item}
|
||||
})
|
||||
this.form.schedule_list_skus = temp
|
||||
this.$refs['elForm'].validate().then(valid => {
|
||||
console.log(valid)
|
||||
if (valid) {
|
||||
scheduleSave(this.form).then(res => {
|
||||
this.$successMessage('add', '排班')
|
||||
this.$emit('update:isShow', false)
|
||||
}).catch(err => {
|
||||
this.$emit('update:isShow', false)
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
isShow(val) {
|
||||
if(val){
|
||||
this.form.start_time = `${this.date} ${parseTime(new Date(),'{h}:{i}:{s}')}`
|
||||
this.form.end_time = `${this.date} ${parseTime(new Date(),'{h}:{i}:{s}')}`
|
||||
}else{
|
||||
this.$refs['elForm'].resetFields()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
::v-deep .el-form-item__error {
|
||||
transform: none !important;
|
||||
left: 0 !important;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue