no message

src/components/zj-dialog/zj-dialog-box.vue

@@ -1,112 +1,107 @@
 <template>
-	<u-popup 
-		round="10" 
-		:show="isShow" 
-		:closeOnClickOverlay="false">
-		<view class="dialog" :style="{'min-height': minHeight}">
-			<view class="dialog-header">
-				<view class="header">
-					<view class="btn" @tap="cancelDialog">取消</view>
-					<view class="title">{{title}}</view>
-					<view class="btn" @tap="confirmDialog">确定</view>
-				</view>
-				<view class="search" v-if="isSearch">
-					<u-search placeholder="请输入关键词" :showAction="false" v-model="keyword" @change="searchDialog"></u-search>
-				</view>
-			</view>
-			<view class="dialog-content">
-				<slot></slot>
-			</view>
-			<view class="dialog-footer">
-				<slot name="footer"></slot>
-			</view>
-		</view>
-	</u-popup>
+  <u-popup round="10" :show="isShow" :closeOnClickOverlay="false">
+    <view class="dialog" :style="{ 'min-height': minHeight }">
+      <view class="dialog-header">
+        <view class="header">
+          <view class="btn" @tap="cancelDialog">取消</view>
+          <view class="title">{{ title }}</view>
+          <view class="btn" @tap="confirmDialog">确定</view>
+        </view>
+        <view class="search" v-if="isSearch">
+          <u-search placeholder="请输入关键词" :showAction="false" v-model="keyword" @change="searchDialog"></u-search>
+        </view>
+      </view>
+      <view class="dialog-content">
+        <slot></slot>
+      </view>
+      <view class="dialog-footer">
+        <slot name="footer"></slot>
+      </view>
+    </view>
+  </u-popup>
 </template>
 
 <script>
-	export default {
-		props: {
-			isShow: {
-				type: Boolean,
-				default: false
-			},
-			title: {
-				type: String,
-				default: '操作弹窗'
-			},
-			minHeight: {
-				type: String,
-				default: ''
-			},
-			isSearch: {
-				type: Boolean,
-				default: false
-			},
-		},
-		
-		data() {
-			return {
-				keyword: '',
-			}
-		},
-		
-		onLoad() {
-			
-		},
-		
-		methods: {
-			cancelDialog() {
-				this.keyword = '';
-				this.$emit('cancel');
-			},
-			
-			confirmDialog() {
-				this.keyword = '';
-				this.$emit('confirm');
-			},
-			
-			searchDialog() {
-				this.$emit('search', this.keyword);
-			}
-		}
-	}
+export default {
+  props: {
+    isShow: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: '操作弹窗'
+    },
+    minHeight: {
+      type: String,
+      default: ''
+    },
+    isSearch: {
+      type: Boolean,
+      default: false
+    }
+  },
+
+  data() {
+    return {
+      keyword: ''
+    }
+  },
+
+  onLoad() {},
+
+  methods: {
+    cancelDialog() {
+      this.keyword = ''
+      this.$emit('cancel')
+    },
+
+    confirmDialog() {
+      this.keyword = ''
+      this.$emit('confirm')
+    },
+
+    searchDialog() {
+      this.$emit('search', this.keyword)
+    }
+  }
+}
 </script>
 
 <style lang="scss" scoped>
-	.dialog {
-		background: #ffffff;
-		max-height: 88vh;
-		display: flex;
-		flex-direction: column;
-		border-radius: 20rpx 20rpx 0 0;
-		.dialog-header {
-			.header {
-				flex-shrink: 0;
-				height: 120rpx;
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-				padding: 0 30rpx;
-				.btn {
-					font-size: 32rpx;
-					color: $theme-color;
-				}
-				.title {
-					font-size: 36rpx;
-					font-weight: 600;
-				}
-			}
-			.search {
-				padding: 0 30rpx 30rpx;
-			}
-		}
-		.dialog-content {
-			flex: 1;
-			overflow-y: scroll;
-		}
-		.dialog-footer {
-			padding: 0 30rpx;
-		}
-	}
+.dialog {
+  background: #ffffff;
+  max-height: 88vh;
+  display: flex;
+  flex-direction: column;
+  border-radius: 20rpx 20rpx 0 0;
+  .dialog-header {
+    .header {
+      flex-shrink: 0;
+      height: 120rpx;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 30rpx;
+      .btn {
+        font-size: 32rpx;
+        color: $theme-color;
+      }
+      .title {
+        font-size: 36rpx;
+        font-weight: 600;
+      }
+    }
+    .search {
+      padding: 0 30rpx 30rpx;
+    }
+  }
+  .dialog-content {
+    flex: 1;
+    overflow-y: scroll;
+  }
+  .dialog-footer {
+    padding: 0 30rpx;
+  }
+}
 </style>

src/components/zj-dialog/zj-dialog-picker.vue

@@ -1,217 +1,218 @@
 <template>
-	<zjDialogBox
-		:title="title"
-		:minHeight="'50vh'"
-		:isShow="isShow" 
-		:isSearch="isSearch"
-		@search="searchDialog"
-		@cancel="cancelDialog" 
-		@confirm="confirmDialog">
-		<view class="list2" v-if="styleType === 2">
-			<view 
-				class="item" 
-				v-for="(item, index) in list" 
-				:key="index" 
-				:class="activeIndex.includes(index) ? 'active':''"
-				@tap="clickItem(index)">
-				<view class="text" v-if="getType() == 'string'">{{item[keyName]}}</view>
-				<view class="text" v-else>
-					<text v-for="(it, idx) in keyName" :key="index">{{item[it]}}</text>
-				</view>
-				<text class="iconfont icon-gouxuan" v-if="activeIndex.includes(index)"></text>
-			</view>
-		</view>
-		<view class="list" v-else>
-			<view 
-				class="item" 
-				v-for="(item, index) in list" 
-				:key="index" 
-				:class="activeIndex.includes(index) ? 'active':''"
-				@tap="clickItem(index)">
-				{{item[keyName]}}
-			</view>
-		</view>
-	</zjDialogBox>
+  <zjDialogBox
+    :title="title"
+    :minHeight="'50vh'"
+    :isShow="isShow"
+    :isSearch="isSearch"
+    @search="searchDialog"
+    @cancel="cancelDialog"
+    @confirm="confirmDialog"
+  >
+    <view class="list2" v-if="styleType === 2">
+      <view
+        class="item"
+        v-for="(item, index) in list"
+        :key="index"
+        :class="activeIndex.includes(index) ? 'active' : ''"
+        @tap="clickItem(index)"
+      >
+        <view class="text" v-if="getType() == 'string'">{{ item[keyName] }}</view>
+        <view class="text" v-else>
+          <text v-for="(it, idx) in keyName" :key="index">{{ item[it] }}</text>
+        </view>
+        <text class="iconfont icon-gouxuan" v-if="activeIndex.includes(index)"></text>
+      </view>
+    </view>
+    <view class="list" v-else>
+      <view
+        class="item"
+        v-for="(item, index) in list"
+        :key="index"
+        :class="activeIndex.includes(index) ? 'active' : ''"
+        @tap="clickItem(index)"
+      >
+        {{ item[keyName] }}
+      </view>
+    </view>
+  </zjDialogBox>
 </template>
 
 <script>
-	import zjDialogBox from "@/components/zj-dialog/zj-dialog-box.vue";
+import zjDialogBox from '@/components/zj-dialog/zj-dialog-box.vue'
 
-	export default {
-		components: {
-		    zjDialogBox,
-		},
-		
-		props: {
-			isShow: {
-				type: Boolean,
-				default: false
-			},
-			title: {
-				type: String,
-				default: ''
-			},
-			list: {
-				type: Array,
-				default: []
-			},
-			multiple: {
-				type: Boolean,
-				default: false
-			},
-			keyName: {
-				type: [String, Array],
-				default: ''
-			},
-			styleType: {
-				type: Number,
-				default: 1
-			},
-			isSearch: {
-				type: Boolean,
-				default: false
-			}
-		},
-		
-		data() {
-			return {
-				activeIndex: [],
-			}
-		},
-		
-		mounted() {
-			
-		},
-		
-		methods: {
-			cancelDialog() {
-				this.$emit('cancel');
-			},
-			
-			confirmDialog() {
-				if(this.activeIndex.length < 1) return this.$toast('请选择');
-				this.$emit('confirm', this.activeIndex.sort());
-			},
-			
-			searchDialog(keyword) {
-				this.$emit('search', keyword);
-			},
-			
-			setValue(val) {
-				this.activeIndex = JSON.parse(JSON.stringify(val));
-			},
-			
-			clickItem(index) {
-				if(this.multiple) {
-					const idx = this.activeIndex.indexOf(index);
-					if (idx > -1) {
-						this.activeIndex.splice(idx, 1);
-					} else {
-						this.activeIndex.push(index);
-					}
-				}else {
-          if(this.activeIndex[0] == index) {
-            this.confirmDialog()
-          }else {
-            this.activeIndex = [index];
-          }
-				}
-			},
-			
-			findElem(array, attr, val) {
-				for (var i = 0; i < array.length; i++) {
-					if (array[i][attr] == val) {
-						return i // 返回当前索引值
-					}
-				}
-				return -1
-			},
-			
-			getType() {
-				if(typeof(this.keyName) == 'string') {
-					return 'string';
-				}else {
-					return 'other'
-				}
-			}
-		}
-	}
+export default {
+  components: {
+    zjDialogBox
+  },
+
+  props: {
+    isShow: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: ''
+    },
+    list: {
+      type: Array,
+      default: []
+    },
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    keyName: {
+      type: [String, Array],
+      default: ''
+    },
+    styleType: {
+      type: Number,
+      default: 1
+    },
+    isSearch: {
+      type: Boolean,
+      default: false
+    }
+  },
+
+  data() {
+    return {
+      activeIndex: []
+    }
+  },
+
+  mounted() {},
+
+  methods: {
+    cancelDialog() {
+      this.$emit('cancel')
+    },
+
+    confirmDialog() {
+      if (this.activeIndex.length < 1) return this.$toast('请选择')
+      this.$emit('confirm', this.activeIndex.sort())
+    },
+
+    searchDialog(keyword) {
+      this.$emit('search', keyword)
+    },
+
+    setValue(val) {
+      this.activeIndex = JSON.parse(JSON.stringify(val))
+    },
+
+    clickItem(index) {
+      if (this.multiple) {
+        const idx = this.activeIndex.indexOf(index)
+        if (idx > -1) {
+          this.activeIndex.splice(idx, 1)
+        } else {
+          this.activeIndex.push(index)
+        }
+      } else {
+        if (this.activeIndex[0] == index) {
+          this.confirmDialog()
+        } else {
+          this.activeIndex = [index]
+        }
+      }
+    },
+
+    findElem(array, attr, val) {
+      for (var i = 0; i < array.length; i++) {
+        if (array[i][attr] == val) {
+          return i // 返回当前索引值
+        }
+      }
+      return -1
+    },
+
+    getType() {
+      if (typeof this.keyName == 'string') {
+        return 'string'
+      } else {
+        return 'other'
+      }
+    }
+  }
+}
 </script>
 
 <style lang="scss" scoped>
-	.list {
-		display: flex;
-		flex-wrap: wrap;
-		padding: 10rpx 30rpx 30rpx;
-		.item {
-			width: calc((100% - 30rpx) / 2);
-			height: 76rpx;
-			text-align: center;
-			line-height: 76rpx;
-			border-radius: 76rpx;
-			background: #F4F5F9;
-			margin-right: 30rpx;
-			margin-bottom: 30rpx;
-			&:nth-child(2n) {
-				margin-right: 0;
-			}
-			&.disabled {
-				background: #eaeaea;
-				color: $sec-font;
-			}
-			&.active {
-				background: $theme-color;
-				color: #ffffff;
-			}
-		}
-	}
-	
-	.list2 {
-		background: #ffffff;
-		display: flex;
-		flex-direction: column;
-		padding: 0 30rpx;
-		overflow-y: scroll;
-		border-top: 1px solid #F3F4F8;
-		height: 70vh;
-		.item {
-			border-bottom: 1px solid #EAEAEA;
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			padding: 30rpx 0;
-			position: relative;
-			&:last-child {
-				border: none;
-			}
-			.text {
-				font-size: 32rpx;
-				margin-right: 60rpx;
-				line-height: 40rpx;
-				text {
-					&:not(:first-child) {
-						font-size: 28rpx;
-						color: $sec-font;
-						margin-left: 12rpx;
-					}
-				}
-			}
-			.iconfont {
-				color: $theme-color;
-				font-size: 32rpx;
-				position: absolute;
-				right: 0;
-				top: 50%;
-				margin-top: -16rpx;
-			}
-			&.active {
-				.text {
-					color: $theme-color;
-					text {
-						color: $theme-color;
-					}
-				}
-			}
-		}
-	}
+.list {
+  display: flex;
+  flex-wrap: wrap;
+  padding: 10rpx 30rpx 30rpx;
+  .item {
+    width: calc((100% - 30rpx) / 2);
+    height: 76rpx;
+    text-align: center;
+    line-height: 76rpx;
+    border-radius: 76rpx;
+    background: #f4f5f9;
+    margin-right: 30rpx;
+    margin-bottom: 30rpx;
+    &:nth-child(2n) {
+      margin-right: 0;
+    }
+    &.disabled {
+      background: #eaeaea;
+      color: $sec-font;
+    }
+    &.active {
+      background: $theme-color;
+      color: #ffffff;
+    }
+  }
+}
+
+.list2 {
+  background: #ffffff;
+  display: flex;
+  flex-direction: column;
+  padding: 0 30rpx;
+  overflow-y: scroll;
+  border-top: 1px solid #f3f4f8;
+  height: 70vh;
+  .item {
+    border-bottom: 1px solid #eaeaea;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 30rpx 0;
+    position: relative;
+    &:last-child {
+      border: none;
+    }
+    .text {
+      font-size: 32rpx;
+      margin-right: 60rpx;
+      line-height: 40rpx;
+      text {
+        &:not(:first-child) {
+          font-size: 28rpx;
+          color: $sec-font;
+          margin-left: 12rpx;
+        }
+      }
+    }
+    .iconfont {
+      color: $theme-color;
+      font-size: 32rpx;
+      position: absolute;
+      right: 0;
+      top: 50%;
+      margin-top: -16rpx;
+    }
+    &.active {
+      .text {
+        color: $theme-color;
+        text {
+          color: $theme-color;
+        }
+      }
+    }
+  }
+}
 </style>

src/packageWorkorder/pages/processFeedback.vue

@@ -15,66 +15,197 @@
         </view>
       </view>
 
-      <view class="date-conteiner mt30" v-if="typeVal == '2'">
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+
+      <view class="date-conteiner mt30" v-if="~['延误'].indexOf(typeVal)">
         <view class="item">
-          <view class="label"><text>*</text>预约上门开始时间</view>
-          <view class="picker" @tap="isShowDatePicker = true">
-            <text class="value" v-if="date">{{ date }}</text>
+          <view class="label"><text>*</text>延误类型</view>
+          <view class="picker" @tap="ywlxShow = true">
+            <text class="value" v-if="ywlxValue">{{ ywlxValue }}</text>
             <text class="placeholder" v-else>请选择</text>
             <text class="iconfont icon-jinru"></text>
           </view>
         </view>
       </view>
 
-      <view class="date-conteiner mt30" v-if="typeVal == '2'">
-        <view class="item">
-          <view class="label"><text>*</text>预约上门结束时间</view>
-          <view class="picker" @tap="setisShowDatePicker2">
-            <text class="value" v-if="date2">{{ date2 }}</text>
-            <text class="placeholder" v-else>请选择</text>
-            <text class="iconfont icon-jinru"></text>
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+
+      <view class="date-conteiner mt30" v-if="~['待件'].indexOf(typeVal)">
+        <view v-for="(item, index) in daijian" :key="index">
+          <view style="display: flex; justify-content: space-between; align-items: center">
+            <view class="common-title"><text>*</text>待件{{ index + 1 }}</view>
+            <view>
+              <text @tap="addDaijian" style="color: blue" v-if="index + 1 == daijian.length">添加</text>
+              <text @tap="delDaijian(index)" style="margin-left: 10px; color: red" v-if="daijian.length > 1">删除</text>
+            </view>
+          </view>
+          <view class="item">
+            <view class="label"><text>*</text>待件-申请编号</view>
+            <view class="picker">
+              <u--input placeholder="请输入" style="height: 100%" v-model="item.val1"></u--input>
+            </view>
+          </view>
+          <br />
+          <view class="item">
+            <view class="label"><text>*</text>待件-物料编号</view>
+            <view class="picker">
+              <u--input placeholder="请输入" style="height: 100%" v-model="item.val2"></u--input>
+            </view>
           </view>
+          <br />
         </view>
       </view>
 
-      <view class="over-container mt30" v-if="typeVal == '3'">
-        <view class="row">
-          <view class="label"><text>*</text>完工采集</view>
-          <view class="btn"
-            ><u-button
-              type="primary"
-              :text="orderDetail && orderDetail.isGather == 'YES' ? '查看采集' : '数据采集'"
-              @click="toCollect"
-            ></u-button>
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+
+      <block v-if="~['预约', '改约', '拉修', '不接电话', '延误'].indexOf(typeVal)">
+        <view class="date-conteiner mt30">
+          <view class="item">
+            <view class="label"
+              ><text>*</text
+              >{{ ~['改约', '拉修', '不接电话', '延误'].indexOf(typeVal) ? '改约' : '预约' }}上门开始时间</view
+            >
+            <view class="picker" @tap="isShowDatePicker = true">
+              <text class="value" v-if="date">{{ date }}</text>
+              <text class="placeholder" v-else>请选择</text>
+              <text class="iconfont icon-jinru"></text>
+            </view>
           </view>
         </view>
-        <view class="row">
-          <view class="label"
-            >收费项目<u-icon
-              name="question-circle"
-              color="#999999"
-              @click="$tips('在服务过程中消耗的产品（配件）')"
-            ></u-icon
-          ></view>
-          <view class="btn"><u-button type="primary" text="添加" @click="toCharge"></u-button></view>
+        <view class="date-conteiner mt30">
+          <view class="item">
+            <view class="label"
+              ><text>*</text
+              >{{ ~['改约', '拉修', '不接电话', '延误'].indexOf(typeVal) ? '改约' : '预约' }}上门结束时间</view
+            >
+            <view class="picker" @tap="setisShowDatePicker2">
+              <text class="value" v-if="date2">{{ date2 }}</text>
+              <text class="placeholder" v-else>请选择</text>
+              <text class="iconfont icon-jinru"></text>
+            </view>
+          </view>
         </view>
-      </view>
-
-      <view class="sign-container mt30" v-if="typeVal == '3'">
-        <view class="common-title"><text>*</text>客户签名</view>
-        <view class="empty" @tap="toSignName" v-if="!signNameUrl">点我签名</view>
-        <view class="img" v-else>
-          <image :src="signNameUrl" mode="widthFix" @tap="prevSignImg(signNameUrl)"></image>
-          <text class="iconfont icon-guanbi1" @tap="signNameUrl = ''"></text>
+      </block>
+
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+
+      <block v-if="~['异常反馈'].indexOf(typeVal)">
+        <view class="date-conteiner mt30">
+          <view class="item">
+            <view class="label"><text>*</text>异常类型</view>
+            <view class="picker" @tap="yclxShow = true">
+              <text class="value" v-if="yclxValue">{{ yclxValue }}</text>
+              <text class="placeholder" v-else>请选择</text>
+              <text class="iconfont icon-jinru"></text>
+            </view>
+          </view>
         </view>
-      </view>
+        <view class="date-conteiner mt30">
+          <view class="item">
+            <view class="label"><text>*</text>异常原因</view>
+            <view class="picker" @tap="ycyyShow = true">
+              <text class="value" v-if="ycyyValue">{{ ycyyValue }}</text>
+              <text class="placeholder" v-else>请选择</text>
+              <text class="iconfont icon-jinru"></text>
+            </view>
+          </view>
+        </view>
+      </block>
+
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+
+      <block v-if="~['完工反馈'].indexOf(typeVal)">
+        <view class="over-container mt30">
+          <view class="row">
+            <view class="label"><text>*</text>完工采集</view>
+            <view class="btn"
+              ><u-button
+                type="primary"
+                :text="orderDetail && orderDetail.isGather == 'YES' ? '查看采集' : '数据采集'"
+                @click="toCollect"
+              ></u-button>
+            </view>
+          </view>
+          <view class="row">
+            <view class="label"
+              >收费项目<u-icon
+                name="question-circle"
+                color="#999999"
+                @click="$tips('在服务过程中消耗的产品（配件）')"
+              ></u-icon
+            ></view>
+            <view class="btn"><u-button type="primary" text="添加" @click="toCharge"></u-button></view>
+          </view>
+        </view>
+        <view class="sign-container mt30">
+          <view class="common-title"><text>*</text>客户签名</view>
+          <view class="empty" @tap="toSignName" v-if="!signNameUrl">点我签名</view>
+          <view class="img" v-else>
+            <image :src="signNameUrl" mode="widthFix" @tap="prevSignImg(signNameUrl)"></image>
+            <text class="iconfont icon-guanbi1" @tap="signNameUrl = ''"></text>
+          </view>
+        </view>
+      </block>
+
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+
+      <block v-if="~['质量信息'].indexOf(typeVal)">
+        <view class="date-conteiner mt30">
+          <view class="item">
+            <view class="label"><text>*</text>质量反馈编号</view>
+            <view class="picker">
+              <u--input placeholder="请输入" style="height: 100%" v-model="zlfkbh"></u--input>
+            </view>
+          </view>
+        </view>
+        <view class="date-conteiner mt30">
+          <view class="item">
+            <view class="label"><text>*</text>反馈日期</view>
+            <view class="picker" @tap="isShowDatePicker3 = true">
+              <text class="value" v-if="date3">{{ date3 }}</text>
+              <text class="placeholder" v-else>请选择</text>
+              <text class="iconfont icon-jinru"></text>
+            </view>
+          </view>
+        </view>
+      </block>
+
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
+      <!--  -->
 
       <view class="mt30 remark-container">
-        <view class="common-title"><text v-if="typeVal == '1' || typeVal == '4'">*</text>备注信息</view>
+        <view class="common-title"><text>*</text>备注信息</view>
         <u--textarea v-model="remarkVal" placeholder="请输入备注内容" fixed border="none" height="120"></u--textarea>
       </view>
 
-      <view class="mt30 image-container" v-if="typeVal == '1' || typeVal == '4'">
+      <view class="mt30 image-container">
         <view class="common-title">上传图片(最多6张)</view>
         <view class="images">
           <block v-for="(item, index) in imageList" :key="index">
@@ -109,6 +240,7 @@
       :formatter="formatter"
       :style="{ width: '100%' }"
     />
+
     <u-datetime-picker
       :show="isShowDatePicker2"
       v-model="datePickerValue2"
@@ -121,54 +253,130 @@
       :formatter="formatter"
       :style="{ width: '100%' }"
     />
+
+    <zjDialogPicker
+      ref="yclxList"
+      :isShow="yclxShow"
+      :multiple="false"
+      :styleType="2"
+      :title="'异常类型'"
+      :list="yclxList"
+      :keyName="'label'"
+      @cancel="yclxShow = false"
+      @confirm="confirmyClx"
+    />
+
+    <zjDialogPicker
+      ref="ycyyList"
+      :isShow="ycyyShow"
+      :multiple="false"
+      :styleType="2"
+      :title="'异常原因'"
+      :list="ycyyList"
+      :keyName="'label'"
+      @cancel="ycyyShow = false"
+      @confirm="confirmYcyy"
+    />
+
+    <zjDialogPicker
+      ref="ywlxList"
+      :isShow="ywlxShow"
+      :multiple="false"
+      :styleType="2"
+      :title="'延误类型'"
+      :list="ywlxList"
+      :keyName="'label'"
+      @cancel="ywlxShow = false"
+      @confirm="confirmYwlx"
+    />
+
+    <u-datetime-picker
+      :show="isShowDatePicker3"
+      v-model="datePickerValue3"
+      type="datetime"
+      placeholder="选择日期和时间"
+      @confirm="confirmDate3"
+      @cancel="isShowDatePicker3 = false"
+      @close="isShowDatePicker3 = false"
+      :formatter="formatter"
+      :style="{ width: '100%' }"
+    />
   </zj-page-layout>
 </template>
 
 <script>
 import { uploadImgFull } from '@/common/utils/util.js'
-
+import zjDialogPicker from '@/components/zj-dialog/zj-dialog-picker.vue'
 export default {
+  components: {
+    zjDialogPicker
+  },
   data() {
     return {
-      datetime: null,
-      limitDateTime: new Date('2024-07-19 12:23:36'),
-
-      id: '',
-      orderDetail: {},
+      typeVal: '备注',
       typeList: [
-        { name: '其他', value: '1' },
-        { name: '改约', value: '2' },
-        { name: '完工反馈', value: '3' },
-        { name: '异常反馈', value: '4' }
+        { name: '备注', value: '备注' },
+        { name: '预约', value: '预约' },
+        { name: '改约', value: '改约' },
+        { name: '异常反馈', value: '异常反馈' },
+        { name: '完工反馈', value: '完工反馈' },
+        { name: '待件', value: '待件' },
+        { name: '拉修', value: '拉修' },
+        { name: '不接电话', value: '不接电话' },
+        { name: '延误', value: '延误' },
+        { name: '质量信息', value: '质量信息' }
       ],
-      typeVal: '1',
+      ywlxList: [
+        { label: '无人接听', value: '无人接听' },
+        { label: '天气原因', value: '天气原因' },
+        { label: '配件未到货', value: '配件未到货' },
+        { label: '异常工单', value: '异常工单' }
+      ],
+      yclxShow: false,
+      ycyyShow: false,
+      ywlxShow: false,
+      abnormalList: [],
+      isShowDatePicker3: false,
+      datePickerValue3: new Date().getTime(),
       minDate: new Date().getTime(),
       minDate2: null,
-      date: '',
       datePickerValue: new Date().getTime(),
       isShowDatePicker: false,
-      date2: '',
       datePickerValue2: new Date().getTime(),
       isShowDatePicker2: false,
+      canClickBtn: true,
+      //
+      id: '',
+      yclxValue: '', //异常类型
+      ycyyValue: '', //异常原因
+      ywlxValue: '', //延误类型
+      zlfkbh: '', //质量反馈编号
+      date3: '', // 反馈日期时间
+      date: '', //预约改约上门开始时间
+      date2: '', //预约改约上门结束时间
       remarkVal: '', // 备注值
-      imageList: [],
-      signNameUrl: '',
-      canClickBtn: true
+      imageList: [], //上传的文件数据
+      signNameUrl: '', //签名
+      daijian: [{ val1: '', val2: '' }], // 待件信息
+      orderDetail: {}
     }
   },
 
   async onLoad({ id }) {
     this.id = id
     this.getOrderDetail()
-
     this.crossPage.$on('finishSign', async data => {
-      // this.$showLoading();
       this.signNameUrl = data
     })
-
     this.crossPage.$on('refreshFeedbackForm', () => {
       this.getOrderDetail()
     })
+    this.$api
+      .post('/pg/order/base/abnormalList', { exType: '' })
+      .then(res => {
+        this.abnormalList = res.data
+      })
+      .catch(res => {})
   },
 
   onUnload() {
@@ -176,7 +384,45 @@ export default {
     this.crossPage.$off('refreshFeedbackForm')
   },
 
+  computed: {
+    yclxList() {
+      return [...new Set(this.abnormalList.map(item => item.exType))]?.map(v => ({ label: v, value: v })) || []
+    },
+    ycyyList() {
+      return this.yclxValue
+        ? this.abnormalList
+            ?.filter(item => item.exType === this.yclxValue)
+            ?.map(v => ({ label: v.exNote, value: v.exNote }))
+        : []
+    }
+  },
+
   methods: {
+    // 添加待件
+    addDaijian() {
+      this.daijian.push({ val1: '', val2: '' })
+    },
+    // 删除待件
+    delDaijian(index) {
+      this.daijian.splice(index, 1)
+    },
+    // 异常类型
+    confirmyClx([index]) {
+      this.yclxValue = this.yclxList?.[index]?.label || ''
+      this.ycyyValue = ''
+      this.yclxShow = false
+    },
+    // 异常原因
+    confirmYcyy([index]) {
+      this.ycyyValue = this.ycyyList?.[index]?.label || ''
+      this.ycyyShow = false
+    },
+    // 延误类型
+    confirmYwlx([index]) {
+      this.ywlxValue = this.ywlxList?.[index]?.label || ''
+      this.ywlxShow = false
+    },
+    // 赋值预约改约开始时间
     confirmDate(e) {
       this.isShowDatePicker = false
       this.date = ''
@@ -186,21 +432,26 @@ export default {
         this.datePickerValue2 = new Date(e.value).getTime()
       })
     },
-
-    confirmDate2(e) {
-      this.isShowDatePicker2 = false
-      this.date2 = this.formatTimestamp(e.value)
-    },
-
+    // 校验预约改约开始时间是否已选择
     setisShowDatePicker2() {
       if (!this.date) {
-        return this.$tips('请先选择预约开始时间')
+        return this.$tips(`请先选择${this.typeVal}开始时间`)
       }
       this.minDate2 = Number(new Date(this.date))
       this.$nextTick(() => {
         this.isShowDatePicker2 = true
       })
     },
+    // 赋值预约改约结束时间
+    confirmDate2(e) {
+      this.isShowDatePicker2 = false
+      this.date2 = this.formatTimestamp(e.value)
+    },
+    // 赋值反馈日期
+    confirmDate3(e) {
+      this.isShowDatePicker3 = false
+      this.date3 = this.formatTimestamp(e.value)
+    },
 
     formatter(type, value) {
       if (type === 'year') {
@@ -230,11 +481,6 @@ export default {
           })
           .then(res => {
             this.orderDetail = res.data
-            if (res.data.appointmentTime) {
-              this.typeList[1].name = '改约'
-            } else {
-              this.typeList[1].name = '预约'
-            }
             resolve(1)
           })
           .catch(res => {
@@ -244,7 +490,7 @@ export default {
     },
 
     changeType(val) {
-      if (!this.orderDetail.appointmentTime && val == 3) {
+      if (!this.orderDetail.appointmentTime && val == '完工反馈') {
         return this.$tips('请先预约工单再完工反馈')
       }
       this.typeVal = val
@@ -257,21 +503,6 @@ export default {
       })
     },
 
-    confirmDate(e) {
-      this.isShowDatePicker = false
-      this.date = ''
-      this.$nextTick(() => {
-        this.date = this.formatTimestamp(e.value)
-        this.date2 = ''
-        this.datePickerValue2 = new Date(e.value).getTime()
-      })
-    },
-
-    confirmDate2(e) {
-      this.isShowDatePicker2 = false
-      this.date2 = this.formatTimestamp(e.value)
-    },
-
     formatTimestamp(timestamp) {
       const date = new Date(timestamp)
       const year = date.getFullYear()
@@ -344,6 +575,8 @@ export default {
       })
     },
 
+    // ----------------------------------------------------------------------
+
     // 提交
     async submitData() {
       if (!this.canClickBtn) return this.$toast('请勿频繁操作')
@@ -352,60 +585,92 @@ export default {
         this.canClickBtn = true
       }, 3000)
 
-      if (this.typeVal == '2' && !this.date) return this.$toast('请选择改约时间')
-      if (this.typeVal == '2' && !this.date2) return this.$toast('请选择改约时间')
-      if (this.typeVal == '3' && !this.signNameUrl) return this.$toast('请签名')
-      if ((this.typeVal == '1' || this.typeVal == '4') && !this.remarkVal) return this.$toast('请填写备注信息')
+      let params = {
+        id: this.id,
+        orderBaseId: this.id,
+        type: this.typeVal,
+        typeText: this.typeVal,
+        imgSrc: this.imageList
+          .map(item => {
+            return item.url
+          })
+          .join(',')
+      }
+
+      if (~['延误'].indexOf(this.typeVal)) {
+        if (!this.ywlxValue) {
+          return this.$toast('请选择延误类型')
+        }
+        params.ywType = this.ywlxValue
+      }
 
-      let params = {}
+      if (~['待件'].indexOf(this.typeVal)) {
+        if (!this.daijian.length) {
+          return this.$toast('请填写待件信息')
+        }
+        for (item of this.daijian) {
+          if (!item.val1 || !item.val2) {
+            return this.$toast('请填写完整待件信息')
+          }
+        }
+        params.applyNum = this.daijian.map(item => `${item.val1}|${item.val2}`).join(',')
+      }
 
-      if (this.typeVal == '2') {
-        params.id = this.id
+      if (~['预约', '改约', '拉修', '不接电话', '延误'].indexOf(this.typeVal)) {
+        if (!this.date) {
+          return this.$toast('请选择开始时间')
+        }
+        if (!this.date2) {
+          return this.$toast('请选择结束时间')
+        }
         params.appointmentTime = this.date
         params.appointmentEndTime = this.date2
-        params.remark = this.remarkVal
-      } else {
-        params.orderBaseId = this.id
-        params.content = this.remarkVal
       }
 
-      if (this.typeVal == '1') {
-        params.type = '其他'
-        params.typeText = '其他'
-      }
-      if (this.typeVal == '4') {
-        params.type = '异常反馈'
-        params.typeText = '异常反馈'
-      }
-      if (this.typeVal == '1' || this.typeVal == '4') {
-        params.imgSrc = this.imageList
-          .map(item => {
-            return item.url
-          })
-          .join(',')
+      if (~['异常反馈'].indexOf(this.typeVal)) {
+        if (!this.yclxValue) {
+          return this.$toast('请选择异常类型')
+        }
+        if (!this.ycyyValue) {
+          return this.$toast('请选择异常原因')
+        }
+        params.exType = this.yclxValue
+        params.exNote = this.ycyyValue
       }
 
-      if (this.typeVal == '3') {
+      if (~['完工反馈'].indexOf(this.typeVal)) {
+        if (!this.signNameUrl) {
+          return this.$toast('请签名')
+        }
         const lo = await this.$getAddress()
 
-        params.orderBaseId = this.id
-        params.overRemark = this.remarkVal
         params.userSign = this.signNameUrl
         params.address = lo.address || ''
       }
 
-      // 其他/异常反馈
-      if (this.typeVal == '1' || this.typeVal == '4') {
-        this.$api
-          .postJson('/pg/order/base/operator/add', {
-            ...params
-          })
-          .then(res => {
-            this.submitSuccess()
-          })
+      if (~['质量信息'].indexOf(this.typeVal)) {
+        if (!this.zlfkbh) {
+          return this.$toast('请输入质量反馈编号')
+        }
+        if (!this.date3) {
+          return this.$toast('请选择反馈日期')
+        }
+        params.zlNumber = this.zlfkbh
+        params.fkTime = this.date3
+      }
+
+      if (!this.remarkVal) {
+        return this.$toast('请填写备注信息')
+      } else {
+        params.remark = this.remarkVal
+        params.content = this.remarkVal
+        params.overRemark = this.remarkVal
       }
+
+      // ------------------------------------------------------------------
+
       // 改约
-      else if (this.typeVal == '2') {
+      if (~['预约', '改约'].indexOf(this.typeVal)) {
         this.$api
           .post('/changeOrder/changeAppointmentTime', {
             ...params
@@ -415,7 +680,7 @@ export default {
           })
       }
       // 完工反馈
-      else if (this.typeVal == '3') {
+      else if (~['完工反馈'].indexOf(this.typeVal)) {
         this.$api
           .post('/changeOrder/submitAll', {
             ...params
@@ -423,6 +688,14 @@ export default {
           .then(res => {
             this.submitSuccess('YWG')
           })
+      } else {
+        this.$api
+          .postJson('/pg/order/base/operator/add', {
+            ...params
+          })
+          .then(res => {
+            this.submitSuccess()
+          })
       }
     },
 
@@ -465,9 +738,10 @@ export default {
   .list {
     display: flex;
     flex-wrap: wrap;
+    justify-content: space-between;
 
     .item {
-      width: calc((100% - 30rpx) / 2);
+      width: calc((100% - 30rpx) / 3);
       height: 80rpx;
       line-height: 80rpx;
       text-align: center;
@@ -475,10 +749,6 @@ export default {
       background: #f4f5f9;
       margin-bottom: 30rpx;
 
-      &:nth-child(2n) {
-        margin-left: 30rpx;
-      }
-
       &.active {
         background: $theme-color;
         color: #ffffff;