123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517 |
- <template>
- <view class="buildIncident">
- <scroll-view scroll-y class="body">
- <view class="form_item">
- <view class="title select"><text class="required newicon newicon-bitian"></text>院区:</view>
- <uni-data-select class="value" v-model="incidentData.branch" :localdata="dataInfo.branchList" :clear="false" placeholder="请选择院区" :class="{formRed: isSubmit && !incidentData.branch}" @change="changeBranch"></uni-data-select>
- </view>
- <view class="form_item">
- <view class="title"><text class="required newicon newicon-bitian"></text>报修科室:</view>
- <view class="value category" @click="selectDepartment">
- <text class="categoryName ellipsis-multiline">{{incidentData.department ? incidentData.department.dept : ''}}</text>
- <text class="newicon newicon-weibiaoti2010104"></text>
- </view>
- </view>
- <view class="form_item">
- <view class="title select"><text class="required newicon newicon-bitian transparent"></text>报修人:</view>
- <uni-data-select readonly class="value" v-model="incidentData.requester" :localdata="dataInfo.requesterList" placeholder="请选择报修人"></uni-data-select>
- </view>
- <view class="form_item">
- <view class="title select"><text class="required newicon newicon-bitian transparent"></text>联系人:</view>
- <uni-easyinput class="value" v-model="incidentData.contacts" placeholder="请输入联系人" />
- </view>
- <view class="form_item">
- <view class="title select"><text class="required newicon newicon-bitian"></text>联系电话:</view>
- <uni-easyinput class="value" v-model="incidentData.contactsInformation" placeholder="请输入联系电话" :class="{formRed: isSubmit && !incidentData.contactsInformation.trim()}" />
- </view>
- <view class="form_item">
- <view class="title"><text class="required newicon newicon-bitian transparent"></text>楼栋楼层:</view>
- <view class="value category" @click="selectAreaPlace">
- <text class="categoryName ellipsis-multiline">{{incidentData.place ? incidentData.place.area.area + ' ' + incidentData.place.place : ''}}</text>
- <text class="newicon newicon-weibiaoti2010104"></text>
- </view>
- </view>
- <view class="form_item">
- <view class="title select"><text class="required newicon newicon-bitian transparent"></text>详细地址:</view>
- <uni-easyinput class="value" v-model="incidentData.houseNumber" placeholder="请输入详细地址" />
- </view>
- <view class="form_item">
- <view class="title"><text class="required newicon newicon-bitian"></text>故障现象:</view>
- <view class="value category" @click="selectCategory">
- <text class="categoryName ellipsis-multiline">{{incidentData.category ? incidentData.category.mutiCategory : ''}}</text>
- <text class="newicon newicon-weibiaoti2010104"></text>
- </view>
- </view>
- <view class="form_item">
- <view class="title select"><text class="required newicon newicon-bitian transparent"></text>故障来源:</view>
- <uni-data-select readonly class="value" v-model="incidentData.source" :localdata="dataInfo.sourceList" placeholder="请选择故障来源"></uni-data-select>
- </view>
- <view class="form_item">
- <view class="title select"><text class="required newicon newicon-bitian transparent"></text>优先级:</view>
- <uni-data-select placement="top" readonly class="value" v-model="incidentData.priority" :localdata="dataInfo.priorityList" placeholder="请选择优先级"></uni-data-select>
- </view>
- <view class="form_item column">
- <view class="title select"><text class="required newicon newicon-bitian"></text>故障描述:</view>
- <uni-easyinput class="value" type="textarea" v-model="incidentData.description" placeholder="请输入故障描述" :class="{formRed: isSubmit && !incidentData.description.trim()}" />
- </view>
- <view class="form_item_column">
- <view class="form_item">
- <view class="title"><text class="required newicon newicon-bitian transparent"></text>处理图片:</view>
- <view class="value">
- <uni-file-picker ref="handlerImgRef" v-model="incidentData.handlerImgList" limit="3" @success="handlerImgSuccess" @fail="handlerImgFail" @select="handlerImgSelect" @delete="handlerImgDelete"></uni-file-picker>
- </view>
- </view>
- <view class="form_item">
- <view class="title transparent"><text class="required newicon newicon-bitian transparent"></text>处理图片:</view>
- <view class="value">
- <text class="imgTips ellipsis">(支持JPG/PNG格式图片,单张大小10M以内)</text>
- </view>
- </view>
- </view>
-
- </scroll-view>
- <view class="foot_common_btns">
- <button @click="goBack" type="default" class="cancelButton btn">返回</button>
- <button @click="submit" type="default" class="primaryButton btn">下一步</button>
- </view>
- </view>
- </template>
- <script setup>
- import { ref, reactive } from 'vue'
- import { onLoad } from '@dcloudio/uni-app'
- import { api_user, api_branch, api_getDictionary, api_incidentTask } from "@/http/api.js"
- import { defaultColor } from '@/static/js/theme.js'
- import { useSetTitle } from '@/share/useSetTitle.js'
- import { useGoBack } from '@/share/useGoBack.js'
- import { useLoginUserStore } from '@/stores/loginUser'
- import { useIncidentBuildStore } from '@/stores/incidentBuild'
- import { useUploadFile } from '@/share/useUploadFile.js'
-
- useSetTitle();
- const loginUserStore = useLoginUserStore();
- const incidentBuildStore = useIncidentBuildStore();
- const { uploadFile } = useUploadFile();
- const { goBack } = useGoBack();
-
- // 主题颜色
- const primaryColor = ref(defaultColor)
-
- // 工单对象
- const incidentData = reactive({
- "deleteFlag": 0,
- "duty": undefined,
- "department": undefined,
- "contactsInformation": '',
- "contacts": '',
- "branch": undefined,
- "area": undefined,
- "place": undefined,
- "houseNumber": '',
- "category": undefined,
- "priority": undefined,
- "source": undefined,
- "title": '',
- "description": '',
- "repairType": undefined,
- "requester":undefined,
- "acceptUser": loginUserStore.loginUser.user,
- handlerImgList: [],//处理图片列表
- })
-
- // 处理图片
- const handlerImgRef = ref(null)
-
- // 数据
- const dataInfo = reactive({
- branchList: [], //院区列表
- requesterList: [], //报修人列表
- sourceList: [], //故障来源列表
- priorityList: [], //优先级列表
- })
-
- // 是否提交
- const isSubmit = ref(false)
-
- // 上传处理图片成功
- function handlerImgSuccess(e){
- dataInfo.handlerImgList.forEach(v => {
- v.url = v.path;
- })
- console.log(dataInfo.handlerImgList);
- // let handlerOrder$ = handlerOrder();
- // let requestList = [handlerOrder$];
- // dataInfo.handlerImgList.forEach(v => {
- // let handlerOrderImg$ = handlerOrderImg(v);
- // requestList.push(handlerOrderImg$);
- // })
-
- // Promise.all(requestList).then(resList => {
- // uni.hideLoading();
- // console.log(resList);
- // if(resList[0].state == 200){
- // uni.showToast({
- // icon: 'none',
- // title: '处理成功',
- // mask: true,
- // });
- // setTimeout(() => {
- // uni.reLaunch({
- // url: '/pages/incidentList/incidentList',
- // })
- // }, 1500)
- // }else{
- // uni.showToast({
- // icon: 'none',
- // title: resList[0].msg || '请求数据失败!'
- // });
- // }
- // })
- }
-
- // 上传处理图片失败
- function handlerImgFail(e){
- dataInfo.handlerImgList.forEach(v => {
- v.url = v.path;
- })
- console.log(dataInfo.handlerImgList);
- }
-
- // 选择上传图片
- function handlerImgSelect(e){
- dataInfo.handlerImgList = dataInfo.handlerImgList.concat(e.tempFiles);
- console.log(dataInfo.handlerImgList);
- }
-
- // 删除上传图片
- function handlerImgDelete(e){
- dataInfo.handlerImgList = dataInfo.handlerImgList.filter(v => e.tempFile.uuid != v.uuid);
- console.log(dataInfo.handlerImgList);
- }
-
- // 选择故障现象
- function selectCategory(){
- incidentBuildStore.setIncidentBuildData(incidentData, 'buildIncident');
- uni.navigateTo({
- url: `/pages/categoryOne/categoryOne`
- })
- }
-
- // 选择楼栋楼层
- function selectAreaPlace(){
- incidentBuildStore.setIncidentBuildData(incidentData, 'buildIncident');
- uni.navigateTo({
- url: `/pages/searchArea/searchArea`
- })
- }
-
- // 跳转到搜索报修科室
- function selectDepartment(){
- incidentBuildStore.setIncidentBuildData(incidentData, 'buildIncident');
- uni.navigateTo({
- url: `/pages/searchDept/searchDept`
- })
- }
-
- // 获取院区列表
- function getBranchs(){
- uni.showLoading({
- title: "加载中",
- mask: true,
- });
- let postData = {
- "idx": 0,
- "sum": 9999,
- };
- api_branch(postData).then(res => {
- uni.hideLoading();
- if(res.status == 200){
- res.list = res.list || [];
- dataInfo.branchList = res.list.map(v => ({
- text: v.hosName,
- value: v.id,
- }));
-
- if(loginUserStore.loginUser.user.duty){
- // 当前的所属责任科室
- incidentData.branch = loginUserStore.loginUser.user.duty.branch;
- }else if(loginUserStore.loginUser.user.branch){
- // 当前的所属院区
- incidentData.branch = loginUserStore.loginUser.user.branch.id;
- }
-
- }else{
- uni.showToast({
- icon: 'none',
- title: res.msg || '请求数据失败!'
- });
- }
- })
- }
-
- // 获取报修人列表
- function getRequesters(){
- uni.showLoading({
- title: "加载中",
- mask: true,
- });
- let postData = {
- "idx": 0,
- "sum": 9999,
- "user": {
- "engineer": undefined,
- }
- };
- api_user(postData).then(res => {
- uni.hideLoading();
- if(res.status == 200){
- res.list = res.list || [];
- dataInfo.requesterList = res.list.map(v => ({
- text: v.name,
- value: v.id,
- }));
-
- }else{
- uni.showToast({
- icon: 'none',
- title: res.msg || '请求数据失败!'
- });
- }
- })
- }
-
- // 获取故障来源列表
- function getSources(){
- uni.showLoading({
- title: "加载中",
- mask: true,
- });
- let postData = {
- "key": 'incident_source',
- "type": "list",
- };
- api_getDictionary(postData).then(res => {
- uni.hideLoading();
- res = res || [];
- dataInfo.sourceList = res.map(v => ({
- text: v.name,
- value: v.id,
- }));
- })
- }
-
- // 获取优先级列表
- function getPrioritys(){
- uni.showLoading({
- title: "加载中",
- mask: true,
- });
- let postData = {
- "key": 'incident_priority',
- "type": "list",
- };
- api_getDictionary(postData).then(res => {
- uni.hideLoading();
- res = res || [];
- dataInfo.priorityList = res.map(v => ({
- text: v.name,
- value: v.id,
- }));
- })
- }
-
- // 选择院区
- function changeBranch(){}
-
- // 处理提交事件
- function handlerOrder(){
- let postData = {
- incident: dataInfo.incidentData,
- }
-
- postData.incident.handleDescription = dataInfo.handleDescription;
- postData.incident.handleCategory = {id: dataInfo.handleCategory};
- postData.incident.closecode = {id: dataInfo.closecode};
- postData.incident.category = dataInfo.category;
- postData.incident.synergetic = dataInfo.synergetic;
-
- return api_incidentTask('accept', postData);
- }
-
- // 处理图片
- function handlerOrderImg(imgObj){
- return uploadFile(imgObj, 'incident', dataInfo.incidentId)
- }
-
- // 提交
- function submit(){
- isSubmit.value = true;
- console.log(dataInfo);
- if(!dataInfo.branch){
- uni.showToast({
- icon: 'none',
- title: '请选择院区'
- });
- return;
- }
-
- if(!dataInfo.department){
- uni.showToast({
- icon: 'none',
- title: '请选择报修科室'
- });
- return;
- }
-
- if(!dataInfo.contactsInformation.trim()){
- uni.showToast({
- icon: 'none',
- title: '请填写联系电话'
- });
- return;
- }
-
- if(!dataInfo.category){
- uni.showToast({
- icon: 'none',
- title: '请选择故障现象'
- });
- return;
- }
-
- if(!dataInfo.handleDescription.trim()){
- uni.showToast({
- icon: 'none',
- title: '请填写故障描述'
- });
- return;
- }
- console.log(dataInfo.handlerImgList)
- incidentBuildStore.setIncidentBuildData(dataInfo, 'buildIncident');
-
- // uni.showLoading({
- // title: "加载中",
- // mask: true,
- // });
- // if(dataInfo.handlerImgList.length){
- // // 有图片
- // handlerImgRef.value.upload();
- // }else{
- // // 没有图片
- // let handlerOrder$ = handlerOrder();
- // let requestList = [handlerOrder$];
- // Promise.all(requestList).then(resList => {
- // uni.hideLoading();
- // console.log(resList);
- // if(resList[0].state == 200){
- // uni.showToast({
- // icon: 'none',
- // title: '处理成功',
- // mask: true,
- // });
- // setTimeout(() => {
- // uni.reLaunch({
- // url: '/pages/incidentList/incidentList',
- // })
- // }, 1500)
- // }else{
- // uni.showToast({
- // icon: 'none',
- // title: resList[0].msg || '请求数据失败!'
- // });
- // }
- // })
- // }
- }
-
- onLoad((option) => {
- if(incidentBuildStore.incidentBuild.data){
- Object.assign(incidentData, incidentBuildStore.incidentBuild.data);
- incidentBuildStore.clearIncidentBuildData();
-
- // 修改报修科室,则回显楼栋,楼层,详细地址,联系电话
- incidentData.place = incidentData.department.place || undefined;
- incidentData.houseNumber = incidentData.department.address || '';
- incidentData.contactsInformation = incidentData.department.phone || '';
- }
- getBranchs();
- getRequesters();
- getSources();
- getPrioritys();
- })
- </script>
- <style lang="scss" scoped>
- .buildIncident{
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- .body{
- padding: 0 24rpx;
- box-sizing: border-box;
- flex: 1;
- min-height: 0;
- .form_item{
- display: flex;
- align-items: center;
- padding-top: 24rpx;
- min-height: 86rpx;
- &.column{
- height: auto;
- flex-direction: column;
- align-items: flex-start;
- .title{
- margin-right: 0;
- }
- .value{
- margin-top: 10rpx;
- padding-left: 20rpx;
- box-sizing: border-box;
- }
- .tips{
- padding: 24rpx;
- text-align: center;
- font-size: 22rpx;
- color: #909399;
- width: 100%;
- box-sizing: border-box;
- }
- }
- .title{
- font-size: 26rpx;
- display: flex;
- align-items: center;
- margin-right: 12rpx;
- flex-shrink: 0;
- &.select{
- width: calc(5em + 20rpx);
- }
- }
- .value{
- width: 100%;
- &.category{
- width: 100%;
- display: flex;
- justify-content: space-between;
- align-items: center;
- .categoryName{
- font-size: 26rpx;
- color: #555;
- flex: 1;
- }
- .newicon-weibiaoti2010104{
- color: $uni-primary;
- margin-left: 24rpx;
- }
- }
- .imgTips{
- color: #909399;
- font-size: 22rpx;
- }
- }
- }
- }
- }
- </style>
|