OA/pages/addworkrecord/index.vue

808 lines
19 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<!-- 新建任务 -->
<view>
<view class="task_box">
<!-- 主题 -->
<!-- 信息填写表单 -->
<view class="u-page">
<view class="u-demo-block">
<view class="u-demo-block__content">
<u--form labelPosition="left" :model="model1" ref="form1">
<!-- <u-cell-group>
<view class="cell" v-for="(item, index) in list" :key="index">
<u-cell @click="showPicker(index)" :title="item.title" isLink :value="item.value"
:label="item.value?'':'请选择'">
</u-cell>
</view>
</u-cell-group> -->
<!-- 指派给 -->
<u-picker :show="flag1" :columns="columns3" ref="uPicker4" @cancel="cancel"
closeOnClickOverlay @close="flag1 = false" @change="columnCode" @confirm="confirm"
keyName="name" :defaultIndex='defaultIndex'>
</u-picker>
<!-- 协作人 -->
<u-picker :show="flag2" :columns="columns3" ref="uPicker5" @cancel="cancel"
@close="flag2 = false" @confirm="confirm1" @change="columnCode1" keyName="name"
closeOnClickOverlay :defaultIndex='defaultIndex1'>
</u-picker>
<!-- 验收人 -->
<u-picker :show="flag3" :columns="columns3" ref="uPicker6" @cancel="cancel"
@close="flag3 = false" @confirm="confirm" @change="columnCode2" keyName="name"
closeOnClickOverlay :defaultIndex='defaultIndex2'>
</u-picker>
<!-- 任务性质 -->
<u-form-item label="工作类型:" prop="userInfo.labor_type" borderBottom
@click="show3 = true; hideKeyboard()" ref="item3">
<u--input v-model="labor_type" disabled disabledColor="#ffffff" placeholder="请选择"
border="none"></u--input>
</u-form-item>
<!-- 开始时间 -->
<u-form-item label="开始时间:" prop="userInfo.start_time" borderBottom
@click="starttime = true; hideKeyboard()" ref="item8">
<u--input v-model="start_time" disabled disabledColor="#ffffff" placeholder="请选择"
border="none"></u--input>
</u-form-item>
<!-- 预计结束日期 -->
<u-form-item label="结束时间:" prop="userInfo.end_time" borderBottom
@click="endtime = true; hideKeyboard()" ref="item4">
<u--input v-model="end_time" disabled disabledColor="#ffffff" placeholder="请选择"
border="none"></u--input>
</u-form-item>
<!-- 月份 -->
<!-- 关联项目 -->
<u-form-item label="关联任务:" prop="userInfo.project" borderBottom
@click="show4 = true; hideKeyboard()" ref="item6">
<u--input v-model="project" disabled disabledColor="#ffffff" placeholder="请选择"
border="none"></u--input>
</u-form-item>
<!-- 优先级 -->
<u-form-item label="工作类别:" prop="userInfo.priority_status" borderBottom
@click="show5 = true; hideKeyboard()" ref="item7">
<u--input v-model="priority_status" disabled disabledColor="#ffffff" placeholder="请选择"
border="none"></u--input>
</u-form-item>
<view class="gray"></view>
<!-- 任务内容 -->
<view class="elaborate_box">
<view class="elaborate">任务内容:</view>
<u-form-item prop="userInfo.title" ref="item8">
<u--textarea v-model="model1.userInfo.title" count autoHeight maxlength='200'>
</u--textarea>
</u-form-item>
</view>
</u--form>
</u-action-sheet>
<!-- 任务性质 -->
<u-action-sheet :show="show3" :actions="actions3" title="请选择任务性质" @close="show3 = false"
@select="Select3">
</u-action-sheet>
<!-- 关联项目 -->
<u-action-sheet :show="show4" :actions="actions4" title="请选择关联任务" @close="show4 = false"
@select="Select4">
</u-action-sheet>
<!-- 流转状态 -->
<!-- <u-action-sheet :show="show6" :actions="actions6" title="请选择流转状态" @close="show6 = false"
@select="Select6">
</u-action-sheet> -->
<!-- 工作类别 -->
<u-action-sheet :show="show5" :actions="actions5" title="请选择工作类别" @close="show5 = false"
@select="Select5">
</u-action-sheet>
<!-- 开始时间 -->
<u-datetime-picker :show="starttime" :value="start_time" mode="datetime" closeOnClickOverlay
@confirm="start_timeConfirm" @cancel="start_timeClose"
@close="start_timeClose"></u-datetime-picker>
<!-- 结束日期 -->
<u-datetime-picker :show="endtime" :value="end_time" mode="datetime" closeOnClickOverlay
@confirm="end_timeConfirm" @cancel="end_timeClose"
@close="end_timeClose"></u-datetime-picker>
</view>
</view>
</view>
<!-- 信息填写表单 end-->
<!-- 提交按钮 -->
<view class="btn_box">
<u-button type="error" class="btn reset" text="重置" @click="reset"></u-button>
<u-button type="primary" class="btn sub" text="立即提交" @click="submit"></u-button>
</view>
</view>
</view>
</template>
<script>
import {
addschedule,
projecttasklist,
getemployee,
userdepartment,
} from '@/api/oa.js'
import {
Toast
} from '@/libs/uniApi'
// import { data } from '../../../uni_modules/uview-ui/libs/mixin/mixin'
export default {
data() {
return {
index: 0,
loading: false,
columnData: [
],
defaultIndex: [0, 0, 0],
defaultIndex1: [0, 0, 0],
defaultIndex2: [0, 0, 0],
columns3: [],
director_name: '', //指派给
assist_admin_names: '', //协作人
priority_status: '', //优先级,
flow_status: '',
labor_type: '',
project: '', //关联项目
start_time: '',
end_time: '',
model1: {
userInfo: {
title: '', //任务主题
},
},
flag1: false, //指派给
flag2: false, //协作人
flag3: false, //验收人
show3: false, //
show4: false, //
show5: false, //
show6: false, //
list: [{
title: '关联员工:',
value: '',
},
// {
// title: '协作人:',
// value: ''
// }
//,
// {
// title: '验收人:',
// value: ''
// },
],
starttime: false, //开始时间
endtime: false, //结束日期
endmonth: false, //结束月份
actions3: [{
name: '案头',
id: '1'
}, {
name: '外勤',
id: '2'
}],
actions4: [{
name: '项目1',
id: '78'
}, ],
actions5: [{
name: '其他',
index: '1'
}, {
name: '方案策划',
index: '2'
},
{
name: '撰写',
index: '3'
}, {
name: '需求调研 ',
index: '4'
}, {
name: '需求沟通',
index: '5'
}, {
name: '参加会议',
index: '6'
}, {
name: '拜访客户',
index: '7'
}, {
name: '接待客户',
index: '8'
}
],
actions6: [{
name: '进行中',
id: '2',
}, {
name: '已完成',
id: '3'
}, {
name: '已拒绝',
id: '4'
}, {
name: '已关闭',
id: '5'
}],
rules: {
},
type: 0
}
},
onLoad(option) {
this.type = option.type
if (this.type == 1) {
uni.setNavigationBarTitle({
title: '编辑任务工时'
})
// this.buname=
// console.log(this.columns3[0])
let data = JSON.parse(decodeURIComponent(option.data));
console.log(data)
this.model1.userInfo.id = data.id
this.start_time=data.start_time_a+'-'+data.start_time_b
this.end_time=data.end_time_a+'-'+data.end_time_b
this.model1.userInfo.start_time_a=data.start_time_a
this.model1.userInfo.start_time_a=data.start_time_a
this.model1.userInfo.end_time_a=data.end_time_a
this.model1.userInfo.end_time_b=data.end_time_b
this.model1.userInfo.cid=data.cid
this.model1.userInfo.tid=data.tid
this.model1.userInfo.labor_type=data.labor_type
this.labor_type=data.labor_type_string
this.project=data.project
this.model1.userInfo.title=data.title
this.priority_status=data.work_cate
}
this.getDocumentList()
this.getDocumentList1()
},
onShow() {},
methods: {
//获取任务详情
async getDeatil(id) {
let res = await scheduleview({
id: id
})
this.list[0].value = res.data.detail.director_name
this.model1.userInfo.id = res.data.detail.id
this.model1.userInfo.title = res.data.detail.title
this.list[1].value = res.data.detail.assist_admin_names
this.model1.userInfo.end_time = res.data.detail.end_time
this.labor_type = res.data.detail.labor_type_name
this.model1.userInfo.labor_type = res.data.detail.labor_type
this.model1.userInfo.plan_hours = res.data.detail.plan_hours
this.model1.userInfo.flow_status == res.data.detail.flow_status
this.flow_status = res.data.detail.flow_name
this.model1.userInfo.priority_status == res.data.detail.priority_status
this.priority_status = res.data.detail.priority_name
this.model1.userInfo.content = res.data.detail.content
this.project = res.data.detail.project_name
this.model1.userInfo.project_id = res.data.detail.project_id
if (res.data.detail.assist_admin_ids.length > 1) {
this.model1.userInfo.assist_admin_ids = res.data.detail.assist_admin_ids.split(',')
} else {
this.model1.userInfo.assist_admin_ids.push(res.data.detail.assist_admin_ids)
}
},
async getDocumentList1() {
let res = await projecttasklist({
page: 1,
limit: 10000,
})
this.actions4 = res.data.data.map((step, index) => {
return {
name: step.title,
id: step.id,
};
});
},
//获取部门
async getDocumentList() {
const res = await userdepartment()
const deArr = res.data
let codelist = [
[], //顶级部门
[], //次级部门
[] // 负责人
]
codelist[0] = res.data.map((item) => { // 赋值
return {
id: item.id,
name: item.title
}
})
codelist[1] = res.data[0].children.map((item) => { // 赋值
return {
id: item.id,
name: item.title
}
})
let dat = await getemployee({
did: codelist[1][0].id
})
codelist[2] = dat.data.map((item) => {
return {
id: item.id,
name: item.name
}
})
this.$forceUpdate()
this.$nextTick(() => {
this.columns3 = codelist
})
},
//监听人员加载数据
async columnCode(e) {
if (e.columnIndex == 1) {
let arr1 = []
let dat = await getemployee({
did: this.columns3[e.columnIndex][e.index].id
})
if (dat.data.length > 0) {
const newColumn = dat.data.map((item) => {
return {
id: item.id,
name: item.name
}
})
// 使用 Vue.set 或 this.$set 方法将新数组赋值给 columns3 数组对应位置
this.$set(this.columns3, 2, newColumn);
}
}
},
async columnCode1(e) {
if (e.columnIndex == 1) {
let arr1 = []
let dat = await getemployee({
did: this.columns3[e.columnIndex][e.index].id
})
if (dat.data.length > 0) {
const newColumn = dat.data.map((item) => {
return {
id: item.id,
name: item.name
}
})
// 使用 Vue.set 或 this.$set 方法将新数组赋值给 columns3 数组对应位置
this.$set(this.columns4, 2, newColumn);
}
}
},
async columnCode2(e) {
if (e.columnIndex == 1) {
let arr1 = []
let dat = await getemployee({
did: this.columns3[e.columnIndex][e.index].id
})
if (dat.data.length > 0) {
const newColumn = dat.data.map((item) => {
return {
id: item.id,
name: item.name
}
})
// 使用 Vue.set 或 this.$set 方法将新数组赋值给 columns3 数组对应位置
this.$set(this.columns5, 2, newColumn);
}
}
},
groupChange(n) {
// console.log('groupChange', n);
},
navigateBack() {
uni.navigateBack()
},
Select3(e) {
this.labor_type = e.name
this.model1.userInfo.labor_type = e.id //工作类型id
this.$refs.form1.validateField('userInfo.labor_type')
},
Select4(e) {
this.project = e.name
this.model1.userInfo.tid = e.id.toString() //关联任务id
this.$refs.form1.validateField('userInfo.project')
},
Select5(e) {
this.priority_status = e.name
this.model1.userInfo.cid = e.index //优先级id
this.$refs.form1.validateField('userInfo.cid')
},
Select6(e) {
this.flow_status = e.name
this.model1.userInfo.flow_status = e.id //优先级id
this.$refs.form1.validateField('userInfo.flow_status')
},
change(e) {
// console.log(e);
},
//开始日期
start_timeClose() {
this.starttime = false
this.$refs.form1.validateField('userInfo.start_time')
},
start_timeConfirm(e) {
this.starttime = false
this.start_time = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
this.model1.userInfo.start_time_a = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss').split(' ')[0]
this.model1.userInfo.start_time_b = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss').split(' ')[1]
this.$refs.form1.validateField('userInfo.start_time')
},
//结束日期
end_timeClose() {
this.endtime = false
this.$refs.form1.validateField('userInfo.end_time')
},
end_timeConfirm(e) {
this.endtime = false
this.end_time = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
this.model1.userInfo.end_time_a = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss').split(' ')[0]
this.model1.userInfo.end_time_b = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss').split(' ')[1]
this.$refs.form1.validateField('userInfo.end_time')
},
//结束月份
end_monthClose() {
this.endmonth = false
this.$refs.form1.validateField('userInfo.plan_hours')
},
end_monthConfirm(e) {
this.endmonth = false
this.model1.userInfo.plan_hours = uni.$u.timeFormat(e.value, 'yyyy-mm')
this.$refs.form1.validateField('userInfo.plan_hours')
},
//新建任务
async addNewTask(data) {
const res = await addNewTaskApi(data)
Toast('slkdff')
},
//获取部门列表
async getDepartment() {
const res = await getDepartmentApi()
const deArr = res[0].children
this.columns3.push(deArr)
let id = deArr[0].id
this.getDepartmentPerson(id)
},
//获取部门对应的人员列表
async getDepartmentPerson(id) {
const data = {
did: id
}
const res = await getDepartmentPersonApi(data)
const nameArr = []
res.forEach(item => {
let obj = {}
obj.name = item.name
obj.id = item.id
nameArr.push(obj)
})
this.columnData = []
this.columnData = nameArr
// this.columnData = res
if (this.columns3[1]) {
return
} else {
this.columns3.push(nameArr)
// this.columns3.push(res)
}
},
async submit() {
//结束时间不能低于开始时间
// var d1 = new Date(this.model1.userInfo.start_time)
// const date1 = d1.getTime()
var d2 = new Date(this.model1.userInfo.end_time)
const date2 = d2.getTime()
if (date2.length > 0) {
Toast('结束时间不存在')
this.model1.userInfo.end_time = ''
return
}
let userInfo = this.model1.userInfo
const arr = Object.values(userInfo)
const bool = arr.every(item => item)
console.log(bool, this.model1.userInfo)
if (bool) {
console.log(this.model1.userInfo);
const res = await addschedule(this.model1.userInfo)
if (res.code == 0) {
uni.showToast({
title: '已提交',
});
setTimeout(function() {
uni.navigateBack({
delta: 1
});
}, 1000)
return
} else {
// 新建任务成功跳转回上一页
uni.$u.toast(res.msg)
}
} else {
uni.$u.toast('请填写所有信息')
return
}
},
reset() {
this.list.forEach(item => {
item.value = ''
})
this.project = ''
this.flow_status = ''
this.priority_status = ''
this.labor_type = ''
for (let i in this.model1.userInfo) {
this.model1.userInfo[i] = ''
}
},
hideKeyboard() {
uni.hideKeyboard()
},
//picker选择器
showPicker(index) {
console.log(index);
this.index = index + 1
this[`show${index + 1}`] = true
},
change(e) {
// console.log('change', e);
},
showPicker(index) {
this.index = index + 1
this[`flag${index + 1}`] = true
},
close() {
// console.log('close');
this[`flag${this.index}`] = false
},
confirm(e) {
const num = this.index - 1
const name = e.value[2]
if (name == undefined) {
this.list[num].value = '暂无'
} else {
this.list[0].value = name.name
this.model1.userInfo.admin_id = name.id
}
this[`flag${this.index}`] = false
},
confirm1(e) {
const num = this.index - 1
const name = e.value[2]
if (name == undefined) {
this.list[num].value = '暂无'
} else {
this.list[1].value += name.name + ','
this.model1.userInfo.assist_admin_ids.push(name.id)
}
this[`flag${this.index}`] = false
},
cancel() {
// console.log('cancel');
this[`flag${this.index}`] = false
},
},
onReady() {
// 如果需要兼容微信小程序并且校验规则中含有方法等只能通过setRules方法设置规则
this.$refs.form1.setRules(this.rules)
},
}
</script>
<style lang="scss" scoped>
/deep/.u-form {
background-color: #fff;
}
/deep/.uicon-arrow-right {
display: none;
}
/deep/.u-cell__right-icon-wrap {
display: none !important;
}
/deep/.u-form-item {
padding: 0 28rpx;
}
/deep/.u-form-item__body__left {
width: 220rpx !important;
// background-color: pink;
}
/deep/.input-placeholder,
/deep/.u-input__content,
/deep/.uni-input-wrapper {
font-size: 28rpx !important;
}
/deep/.u-textarea {
padding: 0 !important;
}
/deep/.u-form-item__body__right__message {
margin-left: 220rpx !important;
}
/deep/.u-cell__title {
display: inline-block !important;
flex: none;
}
/deep/.u-cell__body {
padding: 21rpx 0 !important;
}
/deep/.u-line:first-child {
border-bottom: none !important;
}
/deep/.u-cell__value {
color: black !important;
}
/deep/.u-cell__title-text {
display: inline-block !important;
width: 220rpx !important;
}
/deep/.u-cell__label {
font-size: 28rpx !important;
color: #CCCCCC !important;
}
/deep/.u-cell__body__content {
flex: none !important;
}
.cell {
margin: 0 auto;
width: 694rpx;
// background-color: pink;
}
.row {
margin: 0 auto;
margin-top: 21rpx;
width: 694rpx;
height: 0rpx;
border-bottom: 1rpx solid #CCCCCC;
}
.de {
font-size: 28rpx;
.miaoshu {
font-size: 28rpx;
color: #CCCCCC;
}
}
.ch {
color: rgb(192, 196, 204);
}
.gray {
// width: 750rpx;
height: 35rpx;
background-color: #F5F5F5;
}
.elaborate_box {
background-color: #fff;
padding: 35.5rpx 28rpx;
margin-bottom: 200rpx;
overflow: hidden;
.elaborate {
color: #666666;
font-size: 32rpx;
}
.elaborate_info {
width: 100%;
// height: 350rpx;
font-size: 28rpx;
}
}
.btn_box {
z-index: 9999;
position: fixed;
bottom: 0;
width: 750rpx;
background: #FFFFFF;
display: flex;
.btn {
text-align: center;
line-height: 88rpx;
// width: 375rpx;
height: 88rpx;
}
.reset {
border: none;
background-color: #fff;
color: #999999;
}
.sub {
color: #fff;
background-color: $theme-oa-color;
}
}
</style>