|
@@ -2,22 +2,21 @@
|
|
import { dayjs, ElForm, ElInput, ElMessage, UploadProps } from "element-plus";
|
|
import { dayjs, ElForm, ElInput, ElMessage, UploadProps } from "element-plus";
|
|
import { ticketFormItems, ticketAddRules } from "../../config/configs";
|
|
import { ticketFormItems, ticketAddRules } from "../../config/configs";
|
|
import { computed, ref, watch } from "vue";
|
|
import { computed, ref, watch } from "vue";
|
|
-import { httpAdd } from "/@/api/purchase/ticketReturn";
|
|
|
|
-import PaymentTable from "./payment-table.vue";
|
|
|
|
|
|
+// import { httpAdd } from "/@/api/purchase/ticketReturn";
|
|
import { useResponseHandle } from "/@/hooks";
|
|
import { useResponseHandle } from "/@/hooks";
|
|
-import OrderRecordDetail from "/@/components/OrderRecordDetail";
|
|
|
|
import { httpImageUpload, baseUrl } from "/@/api/other";
|
|
import { httpImageUpload, baseUrl } from "/@/api/other";
|
|
import { useUserStore } from "/@/store/modules/user";
|
|
import { useUserStore } from "/@/store/modules/user";
|
|
import { inv_type_list } from "/@/utils/status";
|
|
import { inv_type_list } from "/@/utils/status";
|
|
import { INPUT_MAX_LENGTH } from "/@/utils/global";
|
|
import { INPUT_MAX_LENGTH } from "/@/utils/global";
|
|
-import { useRouter } from "vue-router";
|
|
|
|
|
|
+
|
|
|
|
+const emit = defineEmits(["change"]);
|
|
|
|
|
|
const visible = ref(false);
|
|
const visible = ref(false);
|
|
|
|
+const fileList = ref([]);
|
|
|
|
|
|
//支持的图片格式
|
|
//支持的图片格式
|
|
const types = ["png", "jpg", "bmp", "jpeg"].map(format => "image/" + format);
|
|
const types = ["png", "jpg", "bmp", "jpeg"].map(format => "image/" + format);
|
|
-const paymentTableRef = ref<InstanceType<typeof PaymentTable>>(null);
|
|
|
|
-const { push } = useRouter();
|
|
|
|
|
|
+const imgs = ref([]);
|
|
const invType = ref("");
|
|
const invType = ref("");
|
|
const loading = ref(false);
|
|
const loading = ref(false);
|
|
const formData = ref<Record<string, string>>({
|
|
const formData = ref<Record<string, string>>({
|
|
@@ -48,25 +47,35 @@ const onBeforeReturnImageUpload: UploadProps["beforeUpload"] = ({
|
|
}
|
|
}
|
|
};
|
|
};
|
|
|
|
|
|
|
|
+function handleClose() {
|
|
|
|
+ imgs.value = [];
|
|
|
|
+ fileList.value = [];
|
|
|
|
+ formData.value = {};
|
|
|
|
+}
|
|
|
|
+
|
|
//保存采购回票
|
|
//保存采购回票
|
|
function handleSave() {
|
|
function handleSave() {
|
|
formRef.value.validate(async isValid => {
|
|
formRef.value.validate(async isValid => {
|
|
if (!isValid) return;
|
|
if (!isValid) return;
|
|
if (!invType.value) return ElMessage.error("请选择申请类型");
|
|
if (!invType.value) return ElMessage.error("请选择申请类型");
|
|
- loading.value = true;
|
|
|
|
-
|
|
|
|
- const { code, message } = await httpAdd({
|
|
|
|
- invType: invType.value,
|
|
|
|
- ...formData.value
|
|
|
|
- });
|
|
|
|
|
|
|
|
- responseHandle({
|
|
|
|
- code,
|
|
|
|
- message,
|
|
|
|
- handler: () => push("/purchase/ticketReturn")
|
|
|
|
- });
|
|
|
|
|
|
+ if (invType.value === "2") {
|
|
|
|
+ if (!imgs.value.length) return ElMessage.error("请选择上传的图片");
|
|
|
|
+ if (imgs.value.length > 100)
|
|
|
|
+ return ElMessage.error("上传图片不能超过100张");
|
|
|
|
+ }
|
|
|
|
|
|
- loading.value = false;
|
|
|
|
|
|
+ emit(
|
|
|
|
+ "change",
|
|
|
|
+ invType.value === "2"
|
|
|
|
+ ? imgs.value
|
|
|
|
+ : {
|
|
|
|
+ ...formData.value,
|
|
|
|
+ invType: invType.value
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+
|
|
|
|
+ visible.value = false;
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
|
|
@@ -111,13 +120,25 @@ const handleRequeset: UploadProps["httpRequest"] = async ({ file }) => {
|
|
message,
|
|
message,
|
|
code,
|
|
code,
|
|
handler: () => {
|
|
handler: () => {
|
|
- const { url, name } = data[0];
|
|
|
|
- formData.value.inv_img = baseUrl + "/" + url;
|
|
|
|
- formData.value.invName = name;
|
|
|
|
|
|
+ data.forEach(({ url, name }) => {
|
|
|
|
+ imgs.value.push({
|
|
|
|
+ inv_img: baseUrl + "/" + url,
|
|
|
|
+ invName: name,
|
|
|
|
+ invType: "2"
|
|
|
|
+ });
|
|
|
|
+ });
|
|
}
|
|
}
|
|
});
|
|
});
|
|
};
|
|
};
|
|
|
|
|
|
|
|
+const handleRemove = uploadFile => {
|
|
|
|
+ const delIndex = fileList.value.findIndex(
|
|
|
|
+ ({ uid }) => uid === uploadFile.uid
|
|
|
|
+ );
|
|
|
|
+ imgs.value.splice(delIndex, 1);
|
|
|
|
+ return true;
|
|
|
|
+};
|
|
|
|
+
|
|
watch(
|
|
watch(
|
|
() => formItems.value,
|
|
() => formItems.value,
|
|
newVal => {
|
|
newVal => {
|
|
@@ -144,111 +165,91 @@ defineExpose({
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<template>
|
|
<template>
|
|
- <el-form
|
|
|
|
- label-width="100px"
|
|
|
|
- :model="formData"
|
|
|
|
- :rules="rules"
|
|
|
|
- ref="formRef"
|
|
|
|
- size="small"
|
|
|
|
- >
|
|
|
|
- <el-form-item label="订单对账" prop="payNo">
|
|
|
|
- <div flex w-full justify-end>
|
|
|
|
- <el-button
|
|
|
|
- type="primary"
|
|
|
|
- link
|
|
|
|
- @click="() => paymentTableRef && paymentTableRef.onDisplay()"
|
|
|
|
- >选择</el-button
|
|
|
|
- >
|
|
|
|
- </div>
|
|
|
|
-
|
|
|
|
- <div w-full mt-5>
|
|
|
|
- <OrderRecordDetail
|
|
|
|
- :pay-no="formData.payNo"
|
|
|
|
- ref="orderRecordDetailRef"
|
|
|
|
- v-if="formData.payNo"
|
|
|
|
- />
|
|
|
|
- </div>
|
|
|
|
- </el-form-item>
|
|
|
|
-
|
|
|
|
- <el-form-item label="申请类型">
|
|
|
|
- <el-select v-model="invType">
|
|
|
|
- <el-option label="手工添加" value="1" />
|
|
|
|
- <el-option label="ocr识别" value="2" />
|
|
|
|
- </el-select>
|
|
|
|
- </el-form-item>
|
|
|
|
-
|
|
|
|
- <!-- 扫码枪识别 -->
|
|
|
|
- <el-form-item label="扫码枪" v-if="showScanInput">
|
|
|
|
- <el-input
|
|
|
|
- type="textarea"
|
|
|
|
- placeholder="请在扫码完成后手动回车"
|
|
|
|
- @keydown="handleScanKeydown"
|
|
|
|
- v-model="scanInputValue"
|
|
|
|
- v-bind="INPUT_MAX_LENGTH"
|
|
|
|
- />
|
|
|
|
- </el-form-item>
|
|
|
|
-
|
|
|
|
- <el-form-item
|
|
|
|
- v-for="(item, index) in formItems"
|
|
|
|
- :label="item.label"
|
|
|
|
- :prop="item.prop"
|
|
|
|
- :key="index"
|
|
|
|
|
|
+ <el-dialog v-model="visible" @close="handleClose">
|
|
|
|
+ <el-form
|
|
|
|
+ label-width="100px"
|
|
|
|
+ :model="formData"
|
|
|
|
+ :rules="rules"
|
|
|
|
+ ref="formRef"
|
|
|
|
+ size="small"
|
|
>
|
|
>
|
|
- <template v-if="item.prop === 'invName'">
|
|
|
|
- <el-select v-model="formData[item.prop]" placeholder="请选择发票名称">
|
|
|
|
- <el-option
|
|
|
|
- v-for="(type, index) in inv_type_list"
|
|
|
|
- :label="type.label"
|
|
|
|
- :value="type.hwy_value"
|
|
|
|
- :key="index"
|
|
|
|
- />
|
|
|
|
|
|
+ <el-form-item label="申请方式">
|
|
|
|
+ <el-select v-model="invType">
|
|
|
|
+ <el-option label="手工添加" value="1" />
|
|
|
|
+ <el-option label="ocr识别" value="2" />
|
|
</el-select>
|
|
</el-select>
|
|
- </template>
|
|
|
|
-
|
|
|
|
- <template v-else-if="item.prop === 'inv_img'">
|
|
|
|
- <div>
|
|
|
|
- <el-upload
|
|
|
|
- class="upload"
|
|
|
|
- :before-upload="onBeforeReturnImageUpload"
|
|
|
|
- :http-request="handleRequeset"
|
|
|
|
- :show-file-list="false"
|
|
|
|
- >
|
|
|
|
- <img
|
|
|
|
- class="avatar"
|
|
|
|
- :src="formData[item.prop]"
|
|
|
|
- v-if="formData[item.prop]"
|
|
|
|
- />
|
|
|
|
- <div class="text" v-else>点击上传</div>
|
|
|
|
- </el-upload>
|
|
|
|
- <span>大小:小于1M; 尺寸:100*100; 类型:jpg.png.bmp.jpeg</span>
|
|
|
|
- </div>
|
|
|
|
- </template>
|
|
|
|
-
|
|
|
|
- <template v-else-if="item.prop === 'open_time'">
|
|
|
|
- <el-date-picker
|
|
|
|
- v-model="formData[item.prop]"
|
|
|
|
- :disabled-date="disabledDate"
|
|
|
|
- value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
|
- placeholder="请输入开票日期"
|
|
|
|
|
|
+ </el-form-item>
|
|
|
|
+
|
|
|
|
+ <!-- 扫码枪识别 -->
|
|
|
|
+ <el-form-item label="扫码枪" v-if="showScanInput">
|
|
|
|
+ <el-input
|
|
|
|
+ type="textarea"
|
|
|
|
+ placeholder="请在扫码完成后手动回车"
|
|
|
|
+ @keydown="handleScanKeydown"
|
|
|
|
+ v-model="scanInputValue"
|
|
|
|
+ v-bind="INPUT_MAX_LENGTH"
|
|
/>
|
|
/>
|
|
- </template>
|
|
|
|
-
|
|
|
|
- <template v-else>
|
|
|
|
- <el-input v-model="formData[item.prop]" v-bind="INPUT_MAX_LENGTH" />
|
|
|
|
- </template>
|
|
|
|
- </el-form-item>
|
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
|
- <el-form-item justify-end flex w-full>
|
|
|
|
- <el-button type="primary" :loading="loading" @click="handleSave"
|
|
|
|
- >保存</el-button
|
|
|
|
|
|
+ <el-form-item
|
|
|
|
+ v-for="(item, index) in formItems"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ :prop="item.prop"
|
|
|
|
+ :key="index"
|
|
>
|
|
>
|
|
- </el-form-item>
|
|
|
|
|
|
+ <template v-if="item.prop === 'invName'">
|
|
|
|
+ <el-select v-model="formData[item.prop]" placeholder="请选择发票名称">
|
|
|
|
+ <el-option
|
|
|
|
+ v-for="(type, index) in inv_type_list"
|
|
|
|
+ :label="type.label"
|
|
|
|
+ :value="type.hwy_value"
|
|
|
|
+ :key="index"
|
|
|
|
+ />
|
|
|
|
+ </el-select>
|
|
|
|
+ </template>
|
|
|
|
+
|
|
|
|
+ <template v-else-if="item.prop === 'inv_img'">
|
|
|
|
+ <!-- list-type="picture" -->
|
|
|
|
+ <div>
|
|
|
|
+ <el-upload
|
|
|
|
+ class="upload-demo"
|
|
|
|
+ v-model:file-list="fileList"
|
|
|
|
+ :before-upload="onBeforeReturnImageUpload"
|
|
|
|
+ :before-remove="handleRemove"
|
|
|
|
+ :http-request="handleRequeset"
|
|
|
|
+ multiple
|
|
|
|
+ >
|
|
|
|
+ <el-button type="primary">上传图片</el-button>
|
|
|
|
+ <template #tip>
|
|
|
|
+ <!-- <div class="el-upload__tip">
|
|
|
|
+ jpg/png files with a size less than 500kb
|
|
|
|
+ </div> -->
|
|
|
|
+ </template>
|
|
|
|
+ </el-upload>
|
|
|
|
+ </div>
|
|
|
|
+ </template>
|
|
|
|
+
|
|
|
|
+ <template v-else-if="item.prop === 'open_time'">
|
|
|
|
+ <el-date-picker
|
|
|
|
+ v-model="formData[item.prop]"
|
|
|
|
+ :disabled-date="disabledDate"
|
|
|
|
+ value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
|
+ placeholder="请输入开票日期"
|
|
|
|
+ />
|
|
|
|
+ </template>
|
|
|
|
|
|
- <PaymentTable
|
|
|
|
- ref="paymentTableRef"
|
|
|
|
- @add-btn-click="({ payNo }) => (formData.payNo = payNo)"
|
|
|
|
- />
|
|
|
|
- </el-form>
|
|
|
|
|
|
+ <template v-else>
|
|
|
|
+ <el-input v-model="formData[item.prop]" v-bind="INPUT_MAX_LENGTH" />
|
|
|
|
+ </template>
|
|
|
|
+ </el-form-item>
|
|
|
|
+
|
|
|
|
+ <el-form-item justify-end flex w-full>
|
|
|
|
+ <el-button type="primary" :loading="loading" @click="handleSave"
|
|
|
|
+ >保存</el-button
|
|
|
|
+ >
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </el-dialog>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|