Skip to content
This repository has been archived by the owner on Oct 31, 2023. It is now read-only.

Commit

Permalink
Merge pull request #113 from Jzow/master
Browse files Browse the repository at this point in the history
Add retail shipments model views
  • Loading branch information
Jzow authored Oct 26, 2023
2 parents eeaf335 + 0f54477 commit ce8682c
Show file tree
Hide file tree
Showing 6 changed files with 757 additions and 3 deletions.
5 changes: 2 additions & 3 deletions src/views/product/info/info.data.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,8 @@ import {useMessage} from "@/hooks/web/useMessage";
import {useI18n} from "@/hooks/web/useI18n";
import {updateProductStatus} from "@/api/product/product";
import {getCategoryList} from "@/api/product/productCategory";
import {FormState, MeTable, ProductInfo, ProductStockModel, Stock} from "@/views/product/info/model/productInfoModel";
import {UnwrapRef} from "vue/dist/vue";
import {AddProductReq, AddProductStockReq} from "@/api/product/model/productModel";
import {MeTable, ProductInfo, Stock} from "@/views/product/info/model/productInfoModel";
import {AddProductReq} from "@/api/product/model/productModel";

const { t } = useI18n();

Expand Down
348 changes: 348 additions & 0 deletions src/views/retail/shipments/components/AddEditModal.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,348 @@
<template>
<a-modal
:title="title"
:width="width"
:confirm-loading="confirmLoading"
v-bind:prefixNo="prefixNo"
:id="prefixNo"
:keyboard="false"
:forceRender="true"
switchHelp
switchFullscreen
v-model:open="open"
@cancel="handleCancelModal"
@ok="handleOkModal"
style="top:20px;height: 95%;">
<template slot="footer">
<a-button @click="">取消</a-button>
<a-button v-if="checkFlag && isCanCheck" :loading="confirmLoading" @click="">保存并审核</a-button>
<a-button type="primary" :loading="confirmLoading" @click="">保存</a-button>
<!--发起多级审核-->
<a-button v-if="!checkFlag" @click="" type="primary">提交流程</a-button>
</template>
<a-spin :spinning="confirmLoading">
<a-form ref="formRef" :model="formState">
<a-row class="form-row" :gutter="24">
<a-col :lg="6" :md="12" :sm="24">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="会员卡号" data-step="1" data-title="会员卡号"
data-intro="如果发现需要选择的会员卡号尚未录入,可以在下拉框中点击新增会员信息进行录入">
<a-select placeholder="选择会员卡号" v-model:value="formState.memberId"
:dropdownMatchSelectWidth="false" showSearch optionFilterProp="children" @change="">
<div slot="dropdownRender" slot-scope="menu">
<v-nodes :vnodes="menu" />
<a-divider style="margin: 4px 0;" />
<div v-if="isTenant" style="padding: 4px 8px; cursor: pointer;"
@mousedown="e => e.preventDefault()" @click=""><a-icon type="plus" /> 新增会员</div>
</div>
<a-select-option v-for="(item,index) in memberList" :key="index" :value="item.id">
{{ item.member }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="单据日期">
<a-date-picker show-time placeholder="选择时间" @change="dateChange" @ok="dateOk" />
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="单据编号" data-step="2" data-title="单据编号"
data-intro="单据编号自动生成、自动累加、开头是单据类型的首字母缩写,累加的规则是每次打开页面会自动占用一个新的编号">
<a-input placeholder="请输入单据编号" v-model:value="formState.receiptNumber" :readOnly="true"/>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="收款类型" data-step="3" data-title="收款类型"
data-intro="收款类型可以有现付和预付款两种类型,当选择了会员之后,如果该会员有预付款,在此处会显示具体预付款的金额,而且系统会优先默认选中预付款">
<a-select placeholder="请选择付款类型" v-model:value="formState.paymentType" :dropdownMatchSelectWidth="false">
<a-select-option v-for="(item,index) in payTypeList" :key="index" :value="item.value">
{{ item.text }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
<a-row class="form-row" :gutter="24">
<a-col :lg="18" :md="12" :sm="24">
<a-table :columns="tableColumns"
:dataSource="tableData">
<a-row :gutter="24" style="float:left;" data-step="4" data-title="扫码录入" data-intro="此功能支持扫码枪扫描商品条码进行录入">
<a-col v-if="scanStatus" :md="6" :sm="24">
<a-button @click="scanEnter">扫码录入</a-button>
</a-col>
<a-col v-if="!scanStatus" :md="16" :sm="24" style="padding: 0 6px 0 12px">
<a-input placeholder="请扫条码或序列号并回车" v-model:value="formState.scanBarCode" @pressEnter="scanPressEnter" ref="scanBarCode"/>
</a-col>
<a-col v-if="!scanStatus" :md="6" :sm="24" style="padding: 0px 18px 0 0">
<a-button @click="stopScan">收起扫码</a-button>
</a-col>
</a-row>
<a-icon type="down" @click="handleBatchSetWarehouse" />
<a-divider v-if="isTenant" style="margin: 4px 0;" />
<div v-if="isTenant" style="padding: 4px 8px; cursor: pointer;" @click="addWarehouse"><a-icon type="plus" /> 新增仓库</div>
</a-table>
<a-row class="form-row" :gutter="24">
<a-col :lg="24" :md="24" :sm="24">
<a-form-item :label-col="labelCol" :wrapper-col="{xs: { span: 24 },sm: { span: 24 }}" label="">
<a-textarea :rows="1" placeholder="请输入备注" v-model:value="formState.remark" style="margin-top:8px;"/>
</a-form-item>
</a-col>
</a-row>
<a-row class="form-row" :gutter="24">
<a-col :lg="6" :md="12" :sm="24">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="附件" data-step="9" data-title="附件"
data-intro="可以上传与单据相关的图片、文档,支持多个文件">
<a-upload v-model:file-list="fileList" action="">
<a-button>
<upload-outlined/>
点击上传附件
</a-button>
</a-upload>
</a-form-item>
</a-col>
</a-row>
</a-col>
<div class="sign">
<a-col :lg="6" :md="12" :sm="24">
<a-row class="form-row" :gutter="24">
<a-col :lg="24" :md="6" :sm="6"><br/><br/></a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" data-step="5" data-title="单据金额"
data-intro="单据金额等于左侧商品的总金额">
<span slot="label" style="font-size: 20px;line-height:20px">单据金额</span>
<a-input v-model:value="formState.receiptAmount" :style="{color:'purple'}" :readOnly="true"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" data-step="6" data-title="收款金额"
data-intro="收款金额为收银员收取用户的实际金额">
<span slot="label" style="font-size: 20px;line-height:20px">收款金额</span>
<a-input v-model:value="formState.paymentAmount" :style="{color:'red'}" defaultValue="0" @change="onChangePaymentAmount"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" data-step="7" data-title="找零"
data-intro="找零等于收款金额减去实收金额">
<span slot="label" style="font-size: 20px;line-height:20px">找零</span>
<a-input v-model:value="formState.backAmount" :style="{color:'green'}" :readOnly="true" defaultValue="0"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" data-step="8" data-title="收款账户"
data-intro="收款账户的信息来自基本资料菜单下的【结算账户】">
<span slot="label" style="font-size: 20px;line-height:20px">收款账户</span>
<a-select placeholder="选择收款账户" style="font-size:20px;" v-model:value="formState.accountReceivable" :dropdownMatchSelectWidth="false">
<div slot="dropdownRender" slot-scope="menu">
<v-nodes :vnodes="menu" />
<a-divider style="margin: 4px 0;" />
<div v-if="isTenant" style="padding: 4px 8px; cursor: pointer;"
@mousedown="e => e.preventDefault()" @click="addAccount"><a-icon type="plus" /> 新增结算账户</div>
</div>
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
{{ item.name }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
</a-col>
</div>
</a-row>
</a-form>
</a-spin>
</a-modal>
</template>

<script lang="ts">
import {defineComponent, ref} from 'vue';
import {UploadOutlined} from '@ant-design/icons-vue';
import { Dayjs } from 'dayjs';
import {
Textarea,
DatePicker,
Button,
Checkbox,
Col,
Form,
FormItem,
Input,
InputNumber,
Modal,
Row,
Select,
SelectOption,
Spin,
Table,
TabPane,
Tabs,
Tooltip,
TreeSelect,
Upload,
} from "ant-design-vue";
import {formState, tableColumns} from '/@/views/retail/shipments/model/addEditModel'
export default defineComponent({
name: 'AddEditModal',
emits: ['success', 'cancel', 'error'],
components: {
'a-modal': Modal,
'a-upload': Upload,
'a-button': Button,
'a-spin': Spin,
'a-row': Row,
'a-col': Col,
'a-form': Form,
'a-form-item': FormItem,
'a-input': Input,
'a-input-number': InputNumber,
'a-select': Select,
'a-select-option': SelectOption,
'a-tree-select': TreeSelect,
'a-checkbox': Checkbox,
'a-tooltip': Tooltip,
'a-tabs': Tabs,
'a-tab-pane': TabPane,
'a-table': Table,
'a-textarea': Textarea,
'a-date-picker': DatePicker,
'upload-outlined': UploadOutlined,
},
setup(_, context) {
const confirmLoading = ref<boolean>(false);
const open = ref<boolean>(false);
const checkFlag = ref<boolean>(true);
const isCanCheck = ref<boolean>(true);
const isTenant = ref<boolean>(true);
const scanStatus = ref<boolean>(true);
const title = ref<string>("操作");
const width = ref('1300px');
const moreStatus = ref<boolean>(true);
const addDefaultRowNum = ref(1);
const visible = ref<boolean>(true);
const prefixNo = ref('LSCK');
const fileList = ref([]);
const payTypeList = ref([]);
const minWidth = ref(1100);
const model = ref({});
const tableData = ref([])
const labelCol = ref({
xs: {span: 24},
sm: {span: 8},
});
const wrapperCol = ref({
xs: {span: 24},
sm: {span: 16},
});
const refKey = ref(['productDataTable']);
const activeKey = ref('productDataTable');
const memberList = ref([])
const accountList = ref([]);
function handleCancelModal() {
close();
open.value = false;
context.emit('cancel');
}
function openAddEditModal(id: string | undefined) {
open.value = true
console.info(id)
}
function handleOkModal() {
}
function onChangePaymentAmount() {
}
const dateChange = (value: Dayjs, dateString: string) => {
console.log('Selected Time: ', value);
console.log('Formatted Selected Time: ', dateString);
};
const dateOk = (value: Dayjs) => {
console.log('onOk: ', value);
};
function scanPressEnter() {
}
function scanEnter() {
}
function stopScan() {
}
function addAccount() {
}
function addWarehouse() {
}
function handleBatchSetWarehouse() {
}
return {
open,
checkFlag,
isCanCheck,
isTenant,
scanStatus,
confirmLoading,
handleCancelModal,
openAddEditModal,
handleOkModal,
tableColumns,
tableData,
formState,
title,
width,
moreStatus,
addDefaultRowNum,
visible,
prefixNo,
fileList,
payTypeList,
minWidth,
model,
labelCol,
wrapperCol,
refKey,
activeKey,
onChangePaymentAmount,
dateChange,
dateOk,
scanPressEnter,
scanEnter,
stopScan,
addAccount,
memberList,
accountList,
addWarehouse,
handleBatchSetWarehouse
};
},
});
</script>

<style scoped>
.sign .ant-input{
font-size: 30px;
font-weight:bolder;
text-align:center;
border-left-width:0 !important;
border-top-width:0 !important;
border-right-width:0 !important;
}
</style>
7 changes: 7 additions & 0 deletions src/views/retail/shipments/components/DetailInfoModal.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<template>

</template>

<script lang="ts">
</script>
Loading

0 comments on commit ce8682c

Please sign in to comment.