|
@@ -0,0 +1,224 @@
|
|
|
+<template>
|
|
|
+ <div class="form">
|
|
|
+ <van-nav-bar
|
|
|
+ title="售后管理"
|
|
|
+ left-text="返回"
|
|
|
+ left-arrow
|
|
|
+ @click-left="onClickLeft"
|
|
|
+ @click-right="onClickRight"
|
|
|
+ >
|
|
|
+ <template #right>
|
|
|
+ <div v-show="isShowVideo">关闭摄像头</div>
|
|
|
+ </template>
|
|
|
+ </van-nav-bar>
|
|
|
+ <testForm
|
|
|
+ v-model="formData.data"
|
|
|
+ :formOption="formOption"
|
|
|
+ :formConfig="formConfig"
|
|
|
+ :rules="rules"
|
|
|
+ @onSubmit="onSubmit"
|
|
|
+ ref="formDom"
|
|
|
+ ></testForm>
|
|
|
+ <video
|
|
|
+ ref="video"
|
|
|
+ id="video"
|
|
|
+ class="scan-video"
|
|
|
+ autoplay
|
|
|
+ v-show="isShowVideo"
|
|
|
+ ></video>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, reactive, getCurrentInstance, onMounted } from "vue";
|
|
|
+import { showSuccessToast, showFailToast } from "vant";
|
|
|
+import { useRoute } from "vue-router";
|
|
|
+import testForm from "@/components/testForm/index.vue";
|
|
|
+import { getUserInfo } from "@/utils/auth";
|
|
|
+import { BrowserMultiFormatReader } from "@zxing/library";
|
|
|
+const codeReader = new BrowserMultiFormatReader();
|
|
|
+const isShowVideo = ref(false);
|
|
|
+
|
|
|
+const proxy = getCurrentInstance().proxy;
|
|
|
+const route = useRoute();
|
|
|
+const formDom = ref(null);
|
|
|
+const formData = reactive({
|
|
|
+ data: {},
|
|
|
+});
|
|
|
+const rules = {
|
|
|
+ productSn: [{ required: true, message: "请输入设备SN" }],
|
|
|
+ afterSalesPersonId: [{ required: true, message: "请选择售后人员" }],
|
|
|
+ remark: [{ required: true, message: "请输入售后原因" }],
|
|
|
+};
|
|
|
+const formOption = reactive({
|
|
|
+ readonly: false, //用于控制整个表单是否只读
|
|
|
+ disabled: false,
|
|
|
+ labelAlign: "top",
|
|
|
+ scroll: true,
|
|
|
+ labelWidth: "62pk",
|
|
|
+ hiddenSubmitBtn: false,
|
|
|
+});
|
|
|
+const formConfig = reactive([
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: "设备SN",
|
|
|
+ prop: "productSn",
|
|
|
+ isNeedBlurMethon: true,
|
|
|
+ blurMethon: (val) => {
|
|
|
+ showScanData(val);
|
|
|
+ },
|
|
|
+ isNeedRightBtn: true,
|
|
|
+ rightIcon: "scan",
|
|
|
+ rightIconClick: () => {
|
|
|
+ handleScanCode();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: "合同编码",
|
|
|
+ prop: "code",
|
|
|
+ readonly: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: "产品名称",
|
|
|
+ prop: "productName",
|
|
|
+ readonly: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: "售后人员",
|
|
|
+ prop: "afterSalesPersonId",
|
|
|
+ itemType: "onePicker",
|
|
|
+ showPicker: false,
|
|
|
+ fieldNames: {
|
|
|
+ text: "label",
|
|
|
+ value: "value",
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ itemType: "textarea",
|
|
|
+ label: "售后原因",
|
|
|
+ prop: "remark",
|
|
|
+ },
|
|
|
+]);
|
|
|
+const onClickLeft = () => history.back();
|
|
|
+
|
|
|
+const getDict = () => {
|
|
|
+ proxy.get("/system/user/list?pageNum=1&pageSize=9999").then((res) => {
|
|
|
+ formConfig[3].data = res.rows.map((item) => {
|
|
|
+ return {
|
|
|
+ label: item.userName,
|
|
|
+ value: item.userId,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const getDetails = (id) => {
|
|
|
+ proxy.post("/salesContract/detail", { id }).then((res) => {
|
|
|
+ if (res.data && res.data.contractDetailsList.length > 0) {
|
|
|
+ res.data.salesContractDetailsList = res.data.contractDetailsList;
|
|
|
+ } else {
|
|
|
+ res.data.salesContractDetailsList = [];
|
|
|
+ }
|
|
|
+ formData.data = res.data;
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ formData.data.afterSalesPersonId = getUserInfo().userId;
|
|
|
+ getDict();
|
|
|
+ if (route.query.id) {
|
|
|
+ getDetails(route.query.id);
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+const onSubmit = () => {
|
|
|
+ proxy.post("/afterSalesRecord/add", formData.data).then(
|
|
|
+ () => {
|
|
|
+ showSuccessToast("操作成功");
|
|
|
+ setTimeout(() => {
|
|
|
+ onClickLeft();
|
|
|
+ }, 500);
|
|
|
+ },
|
|
|
+ (err) => {
|
|
|
+ return showFailToast(err.message);
|
|
|
+ }
|
|
|
+ );
|
|
|
+};
|
|
|
+
|
|
|
+const showScanData = (val) => {
|
|
|
+ proxy.post("/productionTaskDetail/snInfo", { productSn: val }).then((res) => {
|
|
|
+ if (res.data && res.data.productId) {
|
|
|
+ formData.data.productId = res.data.productId;
|
|
|
+ formData.data.code = res.data.code;
|
|
|
+ formData.data.productName = res.data.productName;
|
|
|
+ }
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const decodeFromInputVideoFunc = (firstDeviceId) => {
|
|
|
+ codeReader.reset(); // 重置
|
|
|
+ isShowVideo.value = true;
|
|
|
+ codeReader.decodeFromInputVideoDeviceContinuously(
|
|
|
+ firstDeviceId,
|
|
|
+ "video",
|
|
|
+ (result, err) => {
|
|
|
+ if (result) {
|
|
|
+ codeReader.reset();
|
|
|
+ showSuccessToast("扫描成功");
|
|
|
+ isShowVideo.value = false;
|
|
|
+ showScanData(result.text);
|
|
|
+ }
|
|
|
+ if (err && !err) {
|
|
|
+ console.error(err);
|
|
|
+ isShowVideo.value = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ );
|
|
|
+};
|
|
|
+
|
|
|
+const handleScanCode = () => {
|
|
|
+ codeReader
|
|
|
+ .getVideoInputDevices()
|
|
|
+ .then((videoInputDevices) => {
|
|
|
+ // 默认获取第一个摄像头设备id
|
|
|
+ let firstDeviceId = videoInputDevices[0].deviceId;
|
|
|
+ // 获取第一个摄像头设备的名称
|
|
|
+ const videoInputDeviceslablestr = JSON.stringify(
|
|
|
+ videoInputDevices[0].label
|
|
|
+ );
|
|
|
+ if (videoInputDevices.length > 1) {
|
|
|
+ // 判断是否后置摄像头
|
|
|
+ if (videoInputDeviceslablestr.indexOf("back") > -1) {
|
|
|
+ firstDeviceId = videoInputDevices[0].deviceId;
|
|
|
+ } else {
|
|
|
+ firstDeviceId = videoInputDevices[1].deviceId;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ decodeFromInputVideoFunc(firstDeviceId);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err, "错误");
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const onClickRight = () => {
|
|
|
+ codeReader.reset();
|
|
|
+ isShowVideo.value = false;
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.form {
|
|
|
+ margin-bottom: 60px;
|
|
|
+}
|
|
|
+.scan-video {
|
|
|
+ width: 100vw;
|
|
|
+ position: absolute;
|
|
|
+ z-index: 1000;
|
|
|
+ top: 60px;
|
|
|
+}
|
|
|
+</style>
|