|
@@ -0,0 +1,841 @@
|
|
|
+<template>
|
|
|
+ <!-- 加班申请单 发起付款申请(不要调用接口的)-->
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :close-on-press-escape="false"
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ title="发起付款申请"
|
|
|
+ top="50px"
|
|
|
+ width="75%"
|
|
|
+ :append-to-body="true"
|
|
|
+ :before-close="beforeClose"
|
|
|
+ >
|
|
|
+ <div class="tabsdom">
|
|
|
+ <el-tabs v-model="activeName" @tab-click="handleClick">
|
|
|
+ <el-tab-pane label="付款申请" name="first">
|
|
|
+ <el-card shadow="always" style="padding: 15px 5px 5px 15px">
|
|
|
+ <el-row :gutter="15">
|
|
|
+ <el-form ref="elForm" :model="formData" :rules="rules" label-width="100px">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="姓名">
|
|
|
+ <el-input v-model="userinfo.truename" placeholder="请输入加班申请" readonly>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="所在部门">
|
|
|
+ <el-input v-model="userinfo.deptName" placeholder="请输入所在部门" readonly>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="岗位">
|
|
|
+ <el-input v-model="userinfo.postName" placeholder="请输入岗位" readonly>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="关联项目" prop="proId">
|
|
|
+ <el-select v-model="formData.proId" filterable placeholder="关联项目名称">
|
|
|
+ <el-option
|
|
|
+ v-for="item in ProjectData"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ <span style="float: left">{{ item.label }}</span>
|
|
|
+ <span style="float: right; color: #8492a6; font-size: 13px">{{
|
|
|
+ item.custname
|
|
|
+ }}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="加班事由" prop="applyReasons">
|
|
|
+ <el-input v-model="formData.applyReasons" :autosize="{minRows: 4, maxRows: 4}"
|
|
|
+ placeholder="请输入加班事由"
|
|
|
+ type="textarea"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="加班位置" prop="position">
|
|
|
+ <el-radio-group v-model="formData.position" size="medium">
|
|
|
+ <el-radio
|
|
|
+ v-for="(item, index) in positionOptions"
|
|
|
+ :key="index" :disabled="item.disabled"
|
|
|
+ :label="item.value"
|
|
|
+ >
|
|
|
+ {{ item.label }}
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+
|
|
|
+ <el-form-item label="加班时间">
|
|
|
+ <el-row v-for="(item,index) in applyAddWorkTime">
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="item.startDay"
|
|
|
+ class="pdr10px mgb10px"
|
|
|
+ placeholder="选择日期"
|
|
|
+ type="date"
|
|
|
+
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="10">
|
|
|
+ <div style="display: flex;align-items: center">
|
|
|
+ <el-time-picker
|
|
|
+ :disabled="!item.startDay"
|
|
|
+ @change="getStartTime($event,index)"
|
|
|
+ value-format="HH:mm"
|
|
|
+ format="HH:mm"
|
|
|
+ v-model="item.startTime"
|
|
|
+ placeholder="开始时间"
|
|
|
+ >
|
|
|
+ </el-time-picker>
|
|
|
+ <div class="zhi">至</div>
|
|
|
+ <el-time-picker
|
|
|
+ :disabled="!(item.startDay&&item.startTime)"
|
|
|
+ @input="getEndTime($event,index)"
|
|
|
+ value-format="HH:mm"
|
|
|
+ format="HH:mm"
|
|
|
+ v-model="item.endTime"
|
|
|
+ placeholder="结束时间"
|
|
|
+ >
|
|
|
+ </el-time-picker>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <!-- <el-col :span="10">-->
|
|
|
+ <!-- <el-time-picker-->
|
|
|
+ <!-- v-model="item.timeRange"-->
|
|
|
+ <!-- :disabled="!item.startDay"-->
|
|
|
+ <!-- class="el-input pdr10px mgb10px"-->
|
|
|
+ <!-- clearable-->
|
|
|
+ <!-- end-placeholder="结束时间"-->
|
|
|
+ <!-- format="HH:mm"-->
|
|
|
+ <!-- is-range-->
|
|
|
+ <!-- range-separator="至"-->
|
|
|
+ <!-- start-placeholder="开始时间"-->
|
|
|
+ <!-- value-format="HH:mm"-->
|
|
|
+ <!-- @change="getTimeRange($event,index)"-->
|
|
|
+ <!-- />-->
|
|
|
+ <!-- </el-col>-->
|
|
|
+ <el-col :span="2">
|
|
|
+ <div style="text-align: center">小计{{ item.useTime }}(h)</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1" class="col-txt" style="text-align: center">
|
|
|
+
|
|
|
+ <el-button
|
|
|
+ v-if="index!=0"
|
|
|
+ circle
|
|
|
+ icon="el-icon-minus"
|
|
|
+ @click="spliceListRow(index)"
|
|
|
+ />
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1" class="col-txt" style="text-align: center">
|
|
|
+ <el-button
|
|
|
+ circle
|
|
|
+ icon="el-icon-plus"
|
|
|
+ type="primary"
|
|
|
+ @click="addListRow()"
|
|
|
+ />
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <div class="totalApplyTime">共计加班时长{{ formData.totalAddTime }}(h)</div>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="备注">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.remark"
|
|
|
+ :autosize="{minRows: 4, maxRows: 4}"
|
|
|
+ :style="{width: '100%'}"
|
|
|
+ placeholder="请输入备注"
|
|
|
+ type="textarea"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-form>
|
|
|
+ </el-row>
|
|
|
+ </el-card>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="流程图 " name="second">
|
|
|
+ <div style="width: 100%">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <div class="node_info">
|
|
|
+ <div>节点说明:</div>
|
|
|
+ <div class="dis_flex" v-for="item in nodeColor">
|
|
|
+ <div class="node_class" :style="{backgroundColor: item.nodeback}"></div>
|
|
|
+ {{ item.name }}
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div id="containeraddwork" style="width: 100%" v-show="true"></div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button @click="dialogVisible=false">取消</el-button>
|
|
|
+
|
|
|
+ <el-button :loading="loading" type="primary" @click="handelConfirm">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { upload } from '@/static/utils/channel'
|
|
|
+import Base from '@/views/base/base'
|
|
|
+import BaseData from '@/views/base/baseData'
|
|
|
+import UserSelect from '@/views/components/UserSelect'
|
|
|
+import * as echarts from 'echarts'
|
|
|
+
|
|
|
+const lineStyle = {
|
|
|
+ color: '#00116a',
|
|
|
+ width: 2
|
|
|
+
|
|
|
+}
|
|
|
+const redLinestyle = {
|
|
|
+ color: 'red',
|
|
|
+ width: 2
|
|
|
+}
|
|
|
+const applyAddWorkTime = { useTime: 0 }
|
|
|
+export default {
|
|
|
+ name: 'ApplyPay',
|
|
|
+ mixins: [Base, BaseData],
|
|
|
+ components: {
|
|
|
+ upload, UserSelect
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ nodeColor: [
|
|
|
+ { name: '审核通过', nodeback: '#2A3980' },
|
|
|
+ { name: '未经过', nodeback: '#999999' },
|
|
|
+ { name: '退回', nodeback: '#E04242' },
|
|
|
+ { name: '审核中', nodeback: '#E08E42' },
|
|
|
+ { name: '撤回', nodeback: '#4294E0' }
|
|
|
+ ],
|
|
|
+ dc_key: ['ORDER_STATUS', 'PAY_TYPE', 'BUDGET_FY'],
|
|
|
+ ProjectData: [],
|
|
|
+ dialogVisible: false,
|
|
|
+ applyAddWorkTime: [{ ...applyAddWorkTime }],
|
|
|
+ formData: {
|
|
|
+ proId: '',
|
|
|
+ totalAddTime: 0,
|
|
|
+ applyReasons: '',
|
|
|
+ position: '',
|
|
|
+ applyAddWorkTime: [
|
|
|
+ {
|
|
|
+ useTime: 0
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ userinfo: {},
|
|
|
+ activeName: 'first',
|
|
|
+ rules: {
|
|
|
+
|
|
|
+ proId: [{
|
|
|
+ required: true,
|
|
|
+ message: '请选择关联项目',
|
|
|
+ trigger: 'change'
|
|
|
+ }],
|
|
|
+ applyReasons: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入加班事由',
|
|
|
+ trigger: 'change'
|
|
|
+ }],
|
|
|
+ position: [{
|
|
|
+ required: true,
|
|
|
+ message: '加班位置不能为空',
|
|
|
+ trigger: 'change'
|
|
|
+ }]
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ positionOptions: [
|
|
|
+ {
|
|
|
+ 'label': '公司',
|
|
|
+ 'value': 1
|
|
|
+ },
|
|
|
+ {
|
|
|
+ 'label': '客户处',
|
|
|
+ 'value': 2
|
|
|
+ }, {
|
|
|
+ 'label': '居家',
|
|
|
+ 'value': 3
|
|
|
+ }],
|
|
|
+ nodes: [ // 节点
|
|
|
+ {
|
|
|
+ name: '申请人发起',
|
|
|
+ value: [45, 100],
|
|
|
+ symbol: 'image://' + require('../asste/huifangkuai.png'),
|
|
|
+ symbolSize: [110, 60]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '直接上级审核',
|
|
|
+ value: [125, 100],
|
|
|
+ symbol: 'image://' + require('../asste/huifangkuai.png'),
|
|
|
+ symbolSize: [110, 60]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '部门负责人审核',
|
|
|
+ value: [205, 100],
|
|
|
+ symbol: 'image://' + require('../asste/huifangkuai.png'),
|
|
|
+ symbolSize: [110, 60]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '分管领导审核',
|
|
|
+ value: [285, 100],
|
|
|
+ symbol: 'image://' + require('../asste/huifangkuai.png'),
|
|
|
+ symbolSize: [110, 60]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '上级分管领导\n审核',
|
|
|
+ value: [365, 100],
|
|
|
+ symbol: 'image://' + require('../asste/huifangkuai.png'),
|
|
|
+ symbolSize: [110, 60]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '主要领导\n审核',
|
|
|
+ value: [445, 100],
|
|
|
+ symbol: 'image://' + require('../asste/huifangkuai.png'),
|
|
|
+ symbolSize: [110, 60]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '结束',
|
|
|
+ value: [525, 100],
|
|
|
+ symbol: 'image://' + require('../asste/huifangkuai.png'),
|
|
|
+ symbolSize: [110, 60]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'red', // 节点文字颜色
|
|
|
+ backgroundColor: '#f5f5f5'
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#f5f5f5'
|
|
|
+ },
|
|
|
+ name: '退回发起人',
|
|
|
+ value: [350, 400],
|
|
|
+ symbolSize: [70, 20]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'red', // 节点文字颜色
|
|
|
+ backgroundColor: '#f5f5f5'
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#f5f5f5'
|
|
|
+ },
|
|
|
+ name: ' 退回发起人 ',
|
|
|
+ value: [300, 350],
|
|
|
+ symbolSize: [20, 20]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'red', // 节点文字颜色
|
|
|
+ backgroundColor: '#f5f5f5'
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#f5f5f5'
|
|
|
+ },
|
|
|
+ name: ' 退回发起人 ',
|
|
|
+ value: [250, 300],
|
|
|
+ symbolSize: [20, 20]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'red', // 节点文字颜色
|
|
|
+ backgroundColor: '#f5f5f5'
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#f5f5f5'
|
|
|
+ },
|
|
|
+ name: ' 退回发起人 ',
|
|
|
+ value: [250, 300],
|
|
|
+ symbolSize: [20, 20]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'red', // 节点文字颜色
|
|
|
+ backgroundColor: '#f5f5f5'
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#f5f5f5'
|
|
|
+ },
|
|
|
+ name: ' 退回发起人 ',
|
|
|
+ value: [175, 250],
|
|
|
+ symbolSize: [20, 20]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'red', // 节点文字颜色
|
|
|
+ backgroundColor: '#f5f5f5'
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ color: '#f5f5f5'
|
|
|
+ },
|
|
|
+ name: ' 退回发起人 ',
|
|
|
+ value: [100, 200],
|
|
|
+ symbolSize: [20, 20]
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ linesData: [ // 连线
|
|
|
+
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[45, 100], [105, 100]]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[125, 100], [185, 100]]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[205, 100], [265, 100]]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[285, 100], [345, 100]]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[365, 100], [425, 100]]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[445, 100], [505, 100]]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[450, 100], [450, 400]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[370, 100], [370, 350]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[290, 100], [290, 300]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[210, 100], [210, 250]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[130, 100], [130, 200]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[50, 100], [50, 400]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[450, 400], [50, 400]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[370, 350], [50, 350]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[290, 300], [50, 300]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[210, 250], [50, 250]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[130, 200], [50, 200]],
|
|
|
+ symbol: 'none'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ lineStyle: lineStyle,
|
|
|
+ coords: [[50, 150], [50, 150]],
|
|
|
+ symbol: 'none'
|
|
|
+ }
|
|
|
+
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ watch: {
|
|
|
+ 'applyAddWorkTime': {
|
|
|
+ deep: true,
|
|
|
+ handler(newValue, oldValue) {
|
|
|
+ let totalAddTime = 0
|
|
|
+ console.log(this.applyAddWorkTime)
|
|
|
+ try {
|
|
|
+
|
|
|
+ for (let i = 0; i < this.applyAddWorkTime.length; i++) {
|
|
|
+ if (this.applyAddWorkTime[i].useTime === 0 || this.applyAddWorkTime[i].useTime) {
|
|
|
+ totalAddTime = totalAddTime + Number(this.applyAddWorkTime[i].useTime)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ console.log(totalAddTime)
|
|
|
+ this.changeAddWorkTime(totalAddTime.toFixed(1))
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+
|
|
|
+ this.initDict(this.dc_key).then((res) => {
|
|
|
+ })
|
|
|
+ // this.initProject({ /* signstatus: '2,3'*/ })
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ beforeClose() {
|
|
|
+
|
|
|
+ this.applyAddWorkTime = [{ ...applyAddWorkTime }],
|
|
|
+ this.formData = {
|
|
|
+ proId: '',
|
|
|
+ totalAddTime: 0,
|
|
|
+ applyReasons: '',
|
|
|
+ position: '',
|
|
|
+ applyAddWorkTime: [
|
|
|
+ {
|
|
|
+ useTime: 0
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ this.dialogVisible = false
|
|
|
+ this.activeName = 'first'
|
|
|
+ this.$forceUpdate()
|
|
|
+ },
|
|
|
+ handleClick(tab, event) {
|
|
|
+ if (this.activeName == 'second') this.createNodeCanvas()
|
|
|
+ },
|
|
|
+ createNodeCanvas() {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ let chartDom = document.getElementById('containeraddwork')
|
|
|
+ var myCharts = echarts.init(chartDom)
|
|
|
+ let charts = {
|
|
|
+ nodes: this.nodes,
|
|
|
+ linesData: this.linesData
|
|
|
+ }
|
|
|
+ let option = {
|
|
|
+ xAxis: {
|
|
|
+ min: 0,
|
|
|
+ max: 600,
|
|
|
+ padding: [0, 50, 0, 50],
|
|
|
+ show: false,
|
|
|
+ type: 'value'
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ min: 0,
|
|
|
+ max: 450,
|
|
|
+ show: false,
|
|
|
+ type: 'value'
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: 50,
|
|
|
+ right: 0,
|
|
|
+ bottom: 0,
|
|
|
+ top: 0
|
|
|
+ },
|
|
|
+
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ type: 'graph',
|
|
|
+ coordinateSystem: 'cartesian2d',
|
|
|
+ symbol: 'rect',
|
|
|
+ symbolSize: [80, 40],
|
|
|
+ itemStyle: {
|
|
|
+ color: 'rgb(225,7,7)'
|
|
|
+ },
|
|
|
+ symbolOffset: [10, 0],
|
|
|
+ // force: {
|
|
|
+ // edgeLength: 100,//连线的长度
|
|
|
+ // repulsion: 200 //子节点之间的间距
|
|
|
+ // },
|
|
|
+
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ color: 'white' // 节点文字颜色
|
|
|
+ },
|
|
|
+
|
|
|
+ data: charts.nodes
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ type: 'lines',
|
|
|
+ polyline: false,
|
|
|
+ coordinateSystem: 'cartesian2d',
|
|
|
+ symbol: ['', 'arrow'],
|
|
|
+ symbolSize: 10,
|
|
|
+ data: charts.linesData
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ ]
|
|
|
+
|
|
|
+ }
|
|
|
+ myCharts.clear()
|
|
|
+
|
|
|
+ myCharts.setOption(option)
|
|
|
+ window.addEventListener('resize', () => {
|
|
|
+ myCharts.resize()
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ changeAddWorkTime(totalAddTime) {
|
|
|
+ this.formData.totalAddTime = totalAddTime
|
|
|
+ },
|
|
|
+ getHour(s1, s2) {
|
|
|
+ var reDate = /\d{4}-\d{1,2}-\d{1,2} /
|
|
|
+
|
|
|
+ s1 = new Date((reDate.test(s1) ? s1 : '2018-1-1 ' + s1).replace(/-/g, '/'))
|
|
|
+ s2 = new Date((reDate.test(s2) ? s2 : '2018-1-1 ' + s2).replace(/-/g, '/'))
|
|
|
+ var ms = s2.getTime() - s1.getTime()
|
|
|
+ if (ms < 0) return 0
|
|
|
+ console.log(ms)
|
|
|
+
|
|
|
+ return (ms / 1000 / 60 / 60).toFixed(1) //小时
|
|
|
+ },
|
|
|
+ getEndTime(event, index) {
|
|
|
+ console.log(event)
|
|
|
+ this.$nextTick(() => {
|
|
|
+ if (event) {
|
|
|
+ this.applyAddWorkTime[index].endTime = this.applyAddWorkTime[index].startDay + ' ' + this.applyAddWorkTime[index].endTime + ':00'
|
|
|
+ this.applyAddWorkTime[index].useTime = this.getHour(this.applyAddWorkTime[index].startTime, this.applyAddWorkTime[index].endTime)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getStartTime(event, index) {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.applyAddWorkTime[index].startTime = this.applyAddWorkTime[index].startDay + ' ' + this.applyAddWorkTime[index].startTime + ':00'
|
|
|
+ this.applyAddWorkTime[index].endTime = null
|
|
|
+ this.applyAddWorkTime[index].useTime = 0
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getTimeRange(event, index) {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ console.log(event)
|
|
|
+ if (event) {
|
|
|
+ this.applyAddWorkTime[index].startTime = this.applyAddWorkTime[index].startDay + ' ' + event[0] + ':00'
|
|
|
+ this.applyAddWorkTime[index].endTime = this.applyAddWorkTime[index].startDay + ' ' + event[1] + ':00'
|
|
|
+ this.applyAddWorkTime[index].useTime = this.getHour(event[0], event[1])
|
|
|
+ } else {
|
|
|
+ this.applyAddWorkTime[index].useTime = 0
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async getUserInfo() {
|
|
|
+ let { data: userinfo } = await this.baseRequest1('ApplyAddWorkController', 'getUserInfoByUserId', { userId: '' })
|
|
|
+ this.userinfo = userinfo
|
|
|
+ console.log(this.userinfo)
|
|
|
+ },
|
|
|
+ baseRequest1(prefix, opUrl, postData) {
|
|
|
+ return this.$channel.globleRequest(prefix, opUrl, postData, 'project task')
|
|
|
+ },
|
|
|
+ addListRow() {
|
|
|
+ this.applyAddWorkTime.push({ ...applyAddWorkTime })
|
|
|
+ },
|
|
|
+ spliceListRow(index) {
|
|
|
+ this.applyAddWorkTime.splice(index, 1)
|
|
|
+ },
|
|
|
+ setVisible(status) {
|
|
|
+
|
|
|
+ this.getUserInfo()
|
|
|
+ this.dialogVisible = status
|
|
|
+ },
|
|
|
+ onOpen() {
|
|
|
+ },
|
|
|
+ onClose() {
|
|
|
+ this.$refs['elForm'].resetFields()
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.$emit('update:visible', false)
|
|
|
+ },
|
|
|
+ async handelConfirm() {
|
|
|
+ this.$refs['elForm'].validate(async valid => {
|
|
|
+ if (!valid) return
|
|
|
+ let formData = {
|
|
|
+ ...this.formData,
|
|
|
+ applyAddWorkTimeString: JSON.stringify(this.applyAddWorkTime)
|
|
|
+ }
|
|
|
+ delete formData.applyAddWorkTime
|
|
|
+ this.loading = true
|
|
|
+ let { data } = await this.baseRequest1('ApplyAddWorkController', 'addApplyAddWork', { ...formData })
|
|
|
+ if (data.code == 200) {
|
|
|
+ this.loading = false
|
|
|
+ this.$message.success('加班申请发起成功')
|
|
|
+ this.dialogVisible = false
|
|
|
+ this.$emit('getData')
|
|
|
+ }
|
|
|
+ this.close()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+.cclist {
|
|
|
+ .col-input {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+#containeraddwork {
|
|
|
+ height: 600px;
|
|
|
+ width: 100%;
|
|
|
+ background: #F5F5F5;
|
|
|
+}
|
|
|
+
|
|
|
+.pdr10px {
|
|
|
+ padding-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.mgb10px {
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.mb25 {
|
|
|
+ margin-bottom: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+.pdtopbottom16 {
|
|
|
+ padding: 0px 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.pdtop16px {
|
|
|
+ padding-top: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.totalApplyTime {
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: 微软雅黑;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #1890FF;
|
|
|
+ text-align: right;
|
|
|
+ margin: 15px 0 15px 0;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.cost_form {
|
|
|
+ .col-input {
|
|
|
+ font-weight: 400;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-form-item__label .moneydetails {
|
|
|
+ text-align: right;
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: 微软雅黑;
|
|
|
+ padding-right: 10px;
|
|
|
+ line-height: 40px;
|
|
|
+ word-break: keep-all;
|
|
|
+ white-space: nowrap;
|
|
|
+ color: #606266;
|
|
|
+ text-rendering: optimizeLegibility;
|
|
|
+ font-weight: 400;
|
|
|
+ }
|
|
|
+
|
|
|
+ .moneydetails {
|
|
|
+ text-align: right;
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: 微软雅黑;
|
|
|
+ padding-right: 10px;
|
|
|
+ word-break: keep-all;
|
|
|
+ white-space: nowrap;
|
|
|
+ color: #606266;
|
|
|
+ text-rendering: optimizeLegibility;
|
|
|
+ font-weight: 400;
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .moneydetails:before {
|
|
|
+ content: "*";
|
|
|
+ color: #ff4949;
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.txtc {
|
|
|
+ text-align: center
|
|
|
+}
|
|
|
+
|
|
|
+.ml5 {
|
|
|
+ margin-left: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.eltype {
|
|
|
+ margin-bottom: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.tabsdom {
|
|
|
+ .el-input {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tabs__header {
|
|
|
+ text-align: center !important;
|
|
|
+ width: 139px !important;
|
|
|
+ text-align: center !important;
|
|
|
+ display: block !important;
|
|
|
+ margin: auto !important;
|
|
|
+ margin-bottom: 15px !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tabs__nav-wrap::after {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.feeMoneyTotal {
|
|
|
+ width: 100%;
|
|
|
+ height: 14px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #1890FF;
|
|
|
+ margin-top: 31px;
|
|
|
+ margin-bottom: 13px;
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+
|