OA/pages/addquest/index.vue

829 lines
20 KiB
Vue
Raw Normal View History

2023-11-05 00:10:05 +08:00
<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-form-item label="任务主题:" prop="userInfo.title" borderBottom ref="item">
<u--input v-model="model1.userInfo.title" border="none" placeholder="请输入"></u--input>
</u-form-item>
<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>
2023-11-20 18:25:05 +08:00
2023-11-05 00:10:05 +08:00
<!-- 协作人 -->
2023-11-09 09:44:44 +08:00
<u-picker :show="flag2" :columns="columns4" ref="uPicker5" @cancel="cancel"
2023-11-05 00:10:05 +08:00
@close="flag2 = false" @confirm="confirm1" @change="columnCode1" keyName="name"
closeOnClickOverlay :defaultIndex='defaultIndex1'>
</u-picker>
<!-- 验收人 -->
2023-11-09 09:44:44 +08:00
<u-picker :show="flag3" :columns="columns5" ref="uPicker6" @cancel="cancel"
2023-11-05 00:10:05 +08:00
@close="flag3 = false" @confirm="confirm" @change="columnCode2" keyName="name"
closeOnClickOverlay :defaultIndex='defaultIndex2'>
</u-picker>
<!-- 任务性质 -->
<u-form-item label="工作类型:" prop="userInfo.cate" borderBottom
@click="show3 = true; hideKeyboard()" ref="item3">
<u--input v-model="cate" 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="model1.userInfo.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="model1.userInfo.end_time" disabled disabledColor="#ffffff"
placeholder="请选择" border="none"></u--input>
</u-form-item>
<!-- 月份 -->
2023-11-20 18:25:05 +08:00
<u-form-item label="预估工时:" prop="userInfo.plan_hours" borderBottom ref="item5">
<u--input v-model="model1.userInfo.plan_hours" disabledColor="#ffffff" placeholder="请选择"
border="none"></u--input>
2023-11-05 00:10:05 +08:00
</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>
<u-form-item label="流转状态:" prop="userInfo.flow_status" borderBottom
@click="show6 = true; hideKeyboard()" ref="item7">
<u--input v-model="flow_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.content" ref="item8">
<u--textarea v-model="model1.userInfo.content" 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> -->
<!-- 结束日期 -->
2023-11-09 09:44:44 +08:00
<!-- <u-datetime-picker :show="endtime" :value="end_time" mode="datetime" closeOnClickOverlay
2023-11-05 00:10:05 +08:00
@confirm="end_timeConfirm" @cancel="end_timeClose"
2023-11-09 09:44:44 +08:00
@close="end_timeClose"></u-datetime-picker> -->
2023-11-20 18:25:05 +08:00
<u-calendar :show="endtime" color="#f56c6c" mode='single' @close="end_timeClose"
@confirm="end_timeConfirm" @cancel="end_timeClose"></u-calendar>
2023-11-05 00:10:05 +08:00
<!-- 结束月份 -->
<u-datetime-picker :show="endmonth" :value="plan_hours" mode="date" closeOnClickOverlay
@confirm="end_monthConfirm" @cancel="end_monthClose"
@close="end_monthClose"></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 {
addprojecttask,
projectlist,
getemployee,
userdepartment,
projecttaskview
} 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: [],
2023-11-20 18:25:05 +08:00
columns4: [],
columns5: [],
2023-11-05 00:10:05 +08:00
director_name: '', //指派给
assist_admin_names: '', //协作人
priority_status: '', //优先级,
flow_status: '',
cate: '',
project: '', //关联项目
model1: {
userInfo: {
title: '', //任务主题
// start_time: '', //开始时间
end_time: '', //结束日期
plan_hours: '', //结束月份
// assist_check_names: '', //验收人
content: '', //详细内容
assist_admin_ids: []
},
},
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, //结束月份
start_time: Number(new Date()), //开始时间
end_time: Number(new Date()),
plan_hours: Number(new Date()),
actions3: [{
name: '其他',
index: '1'
}, {
name: '方案策划',
index: '2'
},
{
name: '撰写',
index: '3'
}, {
name: '需求调研 ',
index: '4'
}, {
name: '需求沟通',
index: '5'
}, {
name: '参加会议',
index: '6'
}, {
name: '拜访客户',
index: '7'
}, {
name: '接待客户',
index: '8'
}
],
actions4: [{
name: '项目1',
id: '78'
}, ],
actions5: [{
name: '低',
id: '1',
}, {
name: '中',
id: '2'
}, {
name: '高',
id: '3'
}, {
name: '紧急',
id: '4'
}],
rules: {
},
actions6: [{
2023-11-20 18:25:05 +08:00
name: '待办的',
id: '1',
},{
2023-11-05 00:10:05 +08:00
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=
2023-11-20 18:25:05 +08:00
// //console.log(this.columns3[0])
2023-11-05 00:10:05 +08:00
this.getDeatil(option.data)
}
this.getDocumentList()
this.getDocumentList1()
},
onShow() {},
methods: {
//获取任务详情
async getDeatil(id) {
let res = await projecttaskview({
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.cate = res.data.detail.cate_name
this.model1.userInfo.cate = res.data.detail.cate
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 projectlist({
page: 1,
limit: 10000,
})
this.actions4 = res.data.data.map((step, index) => {
return {
name: step.name,
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
2023-11-20 18:25:05 +08:00
this.columns4 = codelist
2023-11-05 00:10:05 +08:00
})
},
//监听人员加载数据
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) {
2023-11-20 18:25:05 +08:00
// //console.log('groupChange', n);
2023-11-05 00:10:05 +08:00
},
navigateBack() {
uni.navigateBack()
},
Select3(e) {
2023-11-20 18:25:05 +08:00
//console.log(e)
2023-11-05 00:10:05 +08:00
this.cate = e.name
this.model1.userInfo.cate = e.index //任务性质id
this.$refs.form1.validateField('userInfo.cate')
},
Select4(e) {
this.project = e.name
this.model1.userInfo.project_id = e.id //关联项目id
this.$refs.form1.validateField('userInfo.project')
},
Select5(e) {
this.priority_status = e.name
this.model1.userInfo.priority = e.id //优先级id
this.$refs.form1.validateField('userInfo.priority')
},
Select6(e) {
this.flow_status = e.name
this.model1.userInfo.flow_status = e.id //优先级id
this.$refs.form1.validateField('userInfo.flow_status')
},
change(e) {
2023-11-20 18:25:05 +08:00
// //console.log(e);
2023-11-05 00:10:05 +08:00
},
//开始日期
start_timeClose() {
this.starttime = false
this.$refs.form1.validateField('userInfo.start_time')
},
start_timeConfirm(e) {
this.starttime = false
this.model1.userInfo.start_time = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
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
2023-11-20 18:25:05 +08:00
//console.log(e)
2023-11-09 09:44:44 +08:00
this.model1.userInfo.end_time = e[0]
// this.$refs.form1.validateField('userInfo.end_time')
2023-11-05 00:10:05 +08:00
},
//结束月份
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)
2023-11-20 18:25:05 +08:00
//console.log(bool, this.model1.userInfo)
2023-11-05 00:10:05 +08:00
if (bool) {
// this.model1.userInfo.director_uid = this.list[0].id + ''
// this.model1.userInfo.assist_admin_ids = this.list[1].id + ''
// this.model1.userInfo.assist_check_ids = this.list[2].id + ''
// this.model1.userInfo.ueditorcontent = this.model1.userInfo.content
// const { msg } = await this.addNewTask(this.model1.userInfo)
2023-11-20 18:25:05 +08:00
//console.log(this.model1.userInfo);
2023-11-05 00:10:05 +08:00
this.model1.userInfo.assist_admin_ids = this.model1.userInfo.assist_admin_ids.toString()
const res = await addprojecttask(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.cate = ''
for (let i in this.model1.userInfo) {
this.model1.userInfo[i] = ''
}
},
hideKeyboard() {
uni.hideKeyboard()
},
//picker选择器
showPicker(index) {
2023-11-20 18:25:05 +08:00
//console.log(index);
2023-11-05 00:10:05 +08:00
this.index = index + 1
this[`show${index + 1}`] = true
},
change(e) {
2023-11-20 18:25:05 +08:00
// //console.log('change', e);
2023-11-05 00:10:05 +08:00
},
showPicker(index) {
this.index = index + 1
this[`flag${index + 1}`] = true
},
close() {
2023-11-20 18:25:05 +08:00
// //console.log('close');
2023-11-05 00:10:05 +08:00
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.director_uid = 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() {
2023-11-20 18:25:05 +08:00
// //console.log('cancel');
2023-11-05 00:10:05 +08:00
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>