|
@@ -0,0 +1,281 @@
|
|
|
+<template>
|
|
|
+ <view class="content"><!-- labelAlign="right" -->
|
|
|
+ <up-form :model="form" labelWidth="70" ref="uFormRef">
|
|
|
+ <view class="title" style="margin-top: 0;">
|
|
|
+ 服务信息
|
|
|
+ </view>
|
|
|
+ <up-form-item label="产品品类" prop="class1">
|
|
|
+ <up-radio-group v-model="form.class1">
|
|
|
+ <up-radio :customStyle="{ marginLeft: '12px' }" v-for="(item) in class1" :key="item.value"
|
|
|
+ :label="item.value" :name="item.value">
|
|
|
+ </up-radio>
|
|
|
+ </up-radio-group>
|
|
|
+ </up-form-item>
|
|
|
+
|
|
|
+ <up-form-item label="服务类型" prop="servicetype">
|
|
|
+ <up-radio-group v-model="form.servicetype">
|
|
|
+ <up-radio :customStyle="{ marginLeft: '12px' }" v-for="(item) in ['安装', '维修', '清洗']" :key="item"
|
|
|
+ :label="item" :name="item">
|
|
|
+ </up-radio>
|
|
|
+ </up-radio-group>
|
|
|
+ </up-form-item>
|
|
|
+
|
|
|
+ <up-form-item label="服务地址" prop="province">
|
|
|
+ <picker class="picker" mode="region" :value="[form.province, form.city, form.county]"
|
|
|
+ @change="changeRegion">
|
|
|
+ {{ [form.province, form.city, form.county].join("-") || '选择省市县' }}
|
|
|
+ </picker>
|
|
|
+ </up-form-item>
|
|
|
+
|
|
|
+ <view style="margin-top: -30rpx;">
|
|
|
+ <up-form-item label="" prop="address">
|
|
|
+ <up-textarea v-model="form.address" placeholder="详细地址" autoHeight height="20" />
|
|
|
+ </up-form-item>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <up-form-item label="联系人" prop="scenecontact">
|
|
|
+ <up-input v-model="form.scenecontact" placeholder="联系人" clearable />
|
|
|
+ </up-form-item>
|
|
|
+
|
|
|
+ <up-form-item label="联系人电话" prop="scenecontactphonenumber">
|
|
|
+ <up-input type="number" v-model="form.scenecontactphonenumber" placeholder="联系人电话" clearable />
|
|
|
+ </up-form-item>
|
|
|
+
|
|
|
+ <view class="title">
|
|
|
+ 产品信息
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <up-form-item label="序列号" prop="sku">
|
|
|
+ <up-input v-model="form.sku" :disabled="disabled" placeholder="序列号" clearable @blur="skuConfirm">
|
|
|
+ <template #suffix>
|
|
|
+ <up-icon v-if="!disabled" name="scan" color="#2979ff" size="28" @click="openScan" />
|
|
|
+ </template>
|
|
|
+ </up-input>
|
|
|
+ </up-form-item>
|
|
|
+ <up-form-item label="产品名称" prop="itemname">
|
|
|
+ <up-input v-model="form.itemname" disabled placeholder="选择产品">
|
|
|
+ <template #suffix>
|
|
|
+ <up-button v-if="!disabled" type="success" size="mini" text="选择产品" @click="toSelectProduct" />
|
|
|
+ </template>
|
|
|
+ </up-input>
|
|
|
+ </up-form-item>
|
|
|
+
|
|
|
+ <up-form-item label="产品型号" prop="model">
|
|
|
+ <up-input v-model="form.model" disabled placeholder="型号" />
|
|
|
+ </up-form-item>
|
|
|
+
|
|
|
+ <up-form-item label="经销商" prop="serviceenterprisename">
|
|
|
+ <up-input v-model="form.serviceenterprisename" disabled placeholder="经销商" />
|
|
|
+ </up-form-item>
|
|
|
+ <up-form-item label="客户名称" prop="contact">
|
|
|
+ <up-input v-model="form.contact" disabled placeholder="客户名称" />
|
|
|
+ </up-form-item>
|
|
|
+ <up-form-item label="客户电话" prop="phonenumber">
|
|
|
+ <up-input v-model="form.phonenumber" disabled placeholder="客户电话" />
|
|
|
+ </up-form-item>
|
|
|
+ <up-form-item label="保修卡号" prop="cardno">
|
|
|
+ <up-input v-model="form.cardno" disabled placeholder="保修卡号" />
|
|
|
+ </up-form-item>
|
|
|
+ </up-form>
|
|
|
+ <view style="padding-bottom: 50px;width: 350rpx;margin: 40rpx auto 0;" @click="save">
|
|
|
+ <My-button text="保存" :loading="loading" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, reactive, getCurrentInstance } from 'vue';
|
|
|
+const { $Http } = getCurrentInstance().proxy;
|
|
|
+import { onLoad } from '@dcloudio/uni-app';
|
|
|
+
|
|
|
+const uFormRef = ref(null);
|
|
|
+const form = reactive({
|
|
|
+ class1: '', // 产品品类
|
|
|
+ servicetype: '', // 服务类型
|
|
|
+ address: "", // 详细地址
|
|
|
+ province: '', // 省份
|
|
|
+ city: '', // 城市
|
|
|
+ county: '', // 区县
|
|
|
+ scenecontact: '', // 联系人
|
|
|
+ scenecontactphonenumber: '', // 联系人电话
|
|
|
+ sku: '', // 序列号
|
|
|
+ 'contact': "", // 客户名称
|
|
|
+ 'itemid': "", // 产品ID
|
|
|
+ 'itemname': "", // 产品名称
|
|
|
+ 'itemno': "", // 产品编号
|
|
|
+ 'model': "", // 型号
|
|
|
+ 'phonenumber': "", // 客户电话
|
|
|
+ 'unitname': "", // 计量单位
|
|
|
+ 'spec': "", // 规格
|
|
|
+ serviceenterprisename: "", // 经销商
|
|
|
+ cardno: "" // 保修卡号
|
|
|
+});
|
|
|
+const rules = reactive({
|
|
|
+ class1: [{ required: true, message: '请选择产品品类', trigger: 'change' }],
|
|
|
+ servicetype: [{ required: true, message: '请选择服务类型', trigger: 'change' }],
|
|
|
+ province: [{ required: true, message: '请选择省市县', trigger: 'change' }],
|
|
|
+ address: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
|
|
|
+ scenecontact: [{ required: true, message: '请输入联系人', trigger: 'blur' }],
|
|
|
+ sku: [{ required: form.servicetype == '安装', message: '请输入序列号', trigger: 'blur' }],
|
|
|
+ scenecontactphonenumber: [{ required: true, message: '请输入联系人电话', trigger: 'blur', pattern: /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/, message: '请输入正确的手机号码' }],
|
|
|
+});
|
|
|
+
|
|
|
+const class1 = ref(''); // 产品品类
|
|
|
+
|
|
|
+let sa_workorderid = 0;
|
|
|
+
|
|
|
+onLoad((options) => {
|
|
|
+ sa_workorderid = options.id;
|
|
|
+ getDetail()
|
|
|
+ $Http.getClass('prodclass1').then(res => {
|
|
|
+ uFormRef.value.setRules(rules);
|
|
|
+ class1.value = res.data;
|
|
|
+ if (res.code !== 1) return uni.showToast({ title: res.msg, icon: 'none' });
|
|
|
+ });
|
|
|
+});
|
|
|
+
|
|
|
+let detail = reactive({});
|
|
|
+
|
|
|
+// 保存
|
|
|
+let loading = ref(false);
|
|
|
+
|
|
|
+function save() {
|
|
|
+ if (loading.value) return;
|
|
|
+ console.log("form", form);
|
|
|
+ uFormRef.value.validate().then(valid => {
|
|
|
+ if (valid) {
|
|
|
+ let content = {
|
|
|
+ "sa_workorderid": sa_workorderid,
|
|
|
+ ...form
|
|
|
+ };
|
|
|
+ loading.value = true;
|
|
|
+ $Http.basic({
|
|
|
+ "id": "20230208140003",
|
|
|
+ content
|
|
|
+ }).then(res => {
|
|
|
+ loading.value = false;
|
|
|
+ console.log("保存工单", res);
|
|
|
+ uni.showToast({ title: res.code !== 1 ? res.msg : "保存成功", icon: 'none', mask: res.code == 1 });
|
|
|
+ if (res.code == 1) setTimeout(() => {
|
|
|
+ uni.navigateBack();
|
|
|
+ }, 500);
|
|
|
+ }).catch(err => {
|
|
|
+ loading.value = false;
|
|
|
+ console.error("保存工单失败", err);
|
|
|
+ uni.showToast({ title: '保存失败,请稍后重试', icon: 'none' });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+let disabled = ref(false);
|
|
|
+function getDetail() {
|
|
|
+ $Http.basic({ "id": "20230208140103", "content": { "nocache": true, sa_workorderid } }).then(res => {
|
|
|
+ console.log("工单详情", res)
|
|
|
+ if (res.code !== 1) return uni.showToast({ title: res.msg, icon: 'none' });
|
|
|
+ detail = reactive(res.data);
|
|
|
+ for (const key in form) {
|
|
|
+ if (detail[key] !== undefined) {
|
|
|
+ form[key] = detail[key];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ disabled.value = form.sku || form.itemid ? true : false
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function changeRegion(e) {
|
|
|
+ form.province = e.detail.value[0];
|
|
|
+ form.city = e.detail.value[1];
|
|
|
+ form.county = e.detail.value[2];
|
|
|
+}
|
|
|
+
|
|
|
+function skuConfirm() {
|
|
|
+ ['contact', 'serviceenterprisename', 'cardno', 'itemid', 'itemname', 'itemno', 'model', 'phonenumber', 'unitname', 'spec'].forEach(key => {
|
|
|
+ form[key] = '';
|
|
|
+ });
|
|
|
+ if (form.sku) {
|
|
|
+ $Http.basic({
|
|
|
+ "id": 20230105110003,
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 1,
|
|
|
+ "where": {
|
|
|
+ condition: form.sku,
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ if (res.code !== 1) return uni.showToast({ title: res.msg, icon: 'none' });
|
|
|
+ if (res.data.length === 0 || res.data[0].sku !== form.sku) {
|
|
|
+ uni.showToast({ title: '未找到对应的产品信息', icon: 'none' });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ ['contact', 'serviceenterprisename', 'cardno', 'itemid', 'itemname', 'itemno', 'model', 'phonenumber', 'unitname', 'spec'].forEach(key => {
|
|
|
+ form[key] = res.data[0][key] || '';
|
|
|
+ });
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ form.sku = '';
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function openScan() {
|
|
|
+ uni.scanCode({
|
|
|
+ onlyFromCamera: true,
|
|
|
+ scanType: ['qrCode', 'barCode'],
|
|
|
+ success: (res) => {
|
|
|
+ console.log("扫码结果", res);
|
|
|
+ if (res.result) {
|
|
|
+ form.sku = res.result;
|
|
|
+ skuConfirm();
|
|
|
+ } else {
|
|
|
+ uni.showToast({ title: '扫码失败,请重试', icon: 'none' });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: (err) => {
|
|
|
+ console.error("扫码失败", err);
|
|
|
+ uni.showToast({ title: '扫码失败,请重试', icon: 'none' });
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+//去选择产品
|
|
|
+function toSelectProduct() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/select/product'
|
|
|
+ });
|
|
|
+ $Http.onSelected = (item) => {
|
|
|
+ ['contact', 'serviceenterprisename', 'sku', 'cardno', 'itemid', 'itemname', 'itemno', 'model', 'phonenumber', 'unitname', 'spec'].forEach(key => {
|
|
|
+ form[key] = item[key] || '';
|
|
|
+ });
|
|
|
+ wx.navigateBack()
|
|
|
+ delete $Http.onSelected
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.content {
|
|
|
+ width: 100vw;
|
|
|
+ padding: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ min-height: 100vh;
|
|
|
+ background: #fff;
|
|
|
+
|
|
|
+
|
|
|
+ .picker {
|
|
|
+ width: 100%;
|
|
|
+ // border-bottom: 1px solid #dadbde;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #606266;
|
|
|
+ padding: 9px;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ font-size: 34rpx;
|
|
|
+ color: #4773EE;
|
|
|
+ margin: 20rpx 0;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|