From 74b54fe6ae28b1091b1701279fcf5656a5f13355 Mon Sep 17 00:00:00 2001 From: NH-LHG <lhg0612@126.com> Date: Mon, 19 Jun 2023 13:36:13 +0800 Subject: [PATCH] =?UTF-8?q?=E3=80=90add=E3=80=91=E6=96=B0=E5=A2=9E?= =?UTF-8?q?=E4=BB=93=E5=BA=93=E7=AE=A1=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/erp/StoreInfoList.vue | 241 ++++++++++++++++++ src/views/erp/modules/StoreInfoForm.vue | 139 ++++++++++ .../modules/StoreInfoModal.Style#Drawer.vue | 84 ++++++ src/views/erp/modules/StoreInfoModal.vue | 60 +++++ 4 files changed, 524 insertions(+) create mode 100644 src/views/erp/StoreInfoList.vue create mode 100644 src/views/erp/modules/StoreInfoForm.vue create mode 100644 src/views/erp/modules/StoreInfoModal.Style#Drawer.vue create mode 100644 src/views/erp/modules/StoreInfoModal.vue diff --git a/src/views/erp/StoreInfoList.vue b/src/views/erp/StoreInfoList.vue new file mode 100644 index 0000000..9863fe4 --- /dev/null +++ b/src/views/erp/StoreInfoList.vue @@ -0,0 +1,241 @@ +<template> + <a-card :bordered="false"> + <!-- 查询区域 --> + <div class="table-page-search-wrapper"> + <a-form layout="inline" @keyup.enter.native="searchQuery"> + <a-row :gutter="24"> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <a-form-item label="仓库名称"> + <a-input placeholder="请输入仓库名称" v-model="queryParam.name"></a-input> + </a-form-item> + </a-col> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <a-form-item label="仓管员"> + <a-input placeholder="请输入仓管员" v-model="queryParam.contacts"></a-input> + </a-form-item> + </a-col> + <template v-if="toggleSearchStatus"> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <a-form-item label="手机号"> + <a-input placeholder="请输入手机号" v-model="queryParam.phone"></a-input> + </a-form-item> + </a-col> + </template> + <a-col :xl="6" :lg="7" :md="8" :sm="24"> + <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons"> + <a-button type="primary" @click="searchQuery" icon="search">查询</a-button> + <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button> + <a @click="handleToggleSearch" style="margin-left: 8px"> + {{ toggleSearchStatus ? '收起' : '展开' }} + <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/> + </a> + </span> + </a-col> + </a-row> + </a-form> + </div> + <!-- 查询区域-END --> + + <!-- 操作按钮区域 --> + <div class="table-operator"> + <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button> + <a-button type="primary" icon="download" @click="handleExportXls('仓库管理')">导出</a-button> + <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel"> + <a-button type="primary" icon="import">导入</a-button> + </a-upload> + <!-- 高级查询区域 --> + <j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query> + <a-dropdown v-if="selectedRowKeys.length > 0"> + <a-menu slot="overlay"> + <a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item> + </a-menu> + <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button> + </a-dropdown> + </div> + + <!-- table区域-begin --> + <div> + <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;"> + <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项 + <a style="margin-left: 24px" @click="onClearSelected">清空</a> + </div> + + <a-table + ref="table" + size="middle" + :scroll="{x:true}" + bordered + rowKey="id" + :columns="columns" + :dataSource="dataSource" + :pagination="ipagination" + :loading="loading" + :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" + class="j-table-force-nowrap" + @change="handleTableChange"> + + <template slot="htmlSlot" slot-scope="text"> + <div v-html="text"></div> + </template> + <template slot="imgSlot" slot-scope="text,record"> + <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span> + <img v-else :src="getImgView(text)" :preview="record.id" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/> + </template> + <template slot="fileSlot" slot-scope="text"> + <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span> + <a-button + v-else + :ghost="true" + type="primary" + icon="download" + size="small" + @click="downloadFile(text)"> + 下载 + </a-button> + </template> + + <span slot="action" slot-scope="text, record"> + <a @click="handleEdit(record)">编辑</a> + + <a-divider type="vertical" /> + <a-dropdown> + <a class="ant-dropdown-link">更多 <a-icon type="down" /></a> + <a-menu slot="overlay"> + <a-menu-item> + <a @click="handleDetail(record)">详情</a> + </a-menu-item> + <a-menu-item> + <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)"> + <a>删除</a> + </a-popconfirm> + </a-menu-item> + </a-menu> + </a-dropdown> + </span> + + </a-table> + </div> + + <store-info-modal ref="modalForm" @ok="modalFormOk"></store-info-modal> + </a-card> +</template> + +<script> + + import '@/assets/less/TableExpand.less' + import { mixinDevice } from '@/utils/mixin' + import { JeecgListMixin } from '@/mixins/JeecgListMixin' + import StoreInfoModal from './modules/StoreInfoModal' + import {filterMultiDictText} from '@/components/dict/JDictSelectUtil' + + export default { + name: 'StoreInfoList', + mixins:[JeecgListMixin, mixinDevice], + components: { + StoreInfoModal + }, + data () { + return { + description: '仓库管理管理页面', + // 表头 + columns: [ + { + title: '#', + dataIndex: '', + key:'rowIndex', + width:60, + align:"center", + customRender:function (t,r,index) { + return parseInt(index)+1; + } + }, + { + title:'仓库名称', + align:"center", + dataIndex: 'name' + }, + { + title:'仓管员', + align:"center", + dataIndex: 'contacts' + }, + { + title:'手机号', + align:"center", + dataIndex: 'phone' + }, + { + title:'仓库地址', + align:"center", + dataIndex: 'addr' + }, + { + title:'区域', + align:"center", + dataIndex: 'region' + }, + { + title:'是否启用', + align:"center", + dataIndex: 'enable_dictText' + }, + { + title:'创建时间', + align:"center", + dataIndex: 'crateTime' + }, + { + title:'创建部门', + align:"center", + dataIndex: 'orgCode' + }, + { + title: '操作', + dataIndex: 'action', + align:"center", + fixed:"right", + width:147, + scopedSlots: { customRender: 'action' } + } + ], + url: { + list: "/erp/storeInfo/list", + delete: "/erp/storeInfo/delete", + deleteBatch: "/erp/storeInfo/deleteBatch", + exportXlsUrl: "/erp/storeInfo/exportXls", + importExcelUrl: "erp/storeInfo/importExcel", + + }, + dictOptions:{}, + superFieldList:[], + } + }, + created() { + this.getSuperFieldList(); + }, + computed: { + importExcelUrl: function(){ + return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`; + }, + }, + methods: { + initDictConfig(){ + }, + getSuperFieldList(){ + let fieldList=[]; + fieldList.push({type:'string',value:'name',text:'仓库名称',dictCode:''}) + fieldList.push({type:'string',value:'contacts',text:'仓管员',dictCode:''}) + fieldList.push({type:'string',value:'phone',text:'手机号',dictCode:''}) + fieldList.push({type:'string',value:'addr',text:'仓库地址',dictCode:''}) + fieldList.push({type:'string',value:'region',text:'区域',dictCode:''}) + fieldList.push({type:'int',value:'enable',text:'是否启用',dictCode:'ifSale'}) + fieldList.push({type:'datetime',value:'crateTime',text:'创建时间'}) + fieldList.push({type:'string',value:'orgCode',text:'创建部门',dictCode:''}) + this.superFieldList = fieldList + } + } + } +</script> +<style scoped> + @import '~@assets/less/common.less'; +</style> \ No newline at end of file diff --git a/src/views/erp/modules/StoreInfoForm.vue b/src/views/erp/modules/StoreInfoForm.vue new file mode 100644 index 0000000..0ee1c6c --- /dev/null +++ b/src/views/erp/modules/StoreInfoForm.vue @@ -0,0 +1,139 @@ +<template> + <a-spin :spinning="confirmLoading"> + <j-form-container :disabled="formDisabled"> + <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail"> + <a-row> + <a-col :span="24"> + <a-form-model-item label="仓库名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name"> + <a-input v-model="model.name" placeholder="请输入仓库名称" ></a-input> + </a-form-model-item> + </a-col> + <a-col :span="24"> + <a-form-model-item label="仓管员" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="contacts"> + <a-input v-model="model.contacts" placeholder="请输入仓管员" ></a-input> + </a-form-model-item> + </a-col> + <a-col :span="24"> + <a-form-model-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="phone"> + <a-input v-model="model.phone" placeholder="请输入手机号" ></a-input> + </a-form-model-item> + </a-col> + <a-col :span="24"> + <a-form-model-item label="仓库地址" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="addr"> + <a-input v-model="model.addr" placeholder="请输入仓库地址" ></a-input> + </a-form-model-item> + </a-col> + <a-col :span="24"> + <a-form-model-item label="区域" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="region"> + <a-input v-model="model.region" placeholder="请输入区域" ></a-input> + </a-form-model-item> + </a-col> + <a-col :span="24"> + <a-form-model-item label="是否启用" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="enable"> + <j-dict-select-tag type="list" v-model="model.enable" dictCode="ifSale" placeholder="请选择是否启用" /> + </a-form-model-item> + </a-col> + <a-col :span="24"> + <a-form-model-item label="创建时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="crateTime"> + <j-date placeholder="请选择创建时间" v-model="model.crateTime" :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" /> + </a-form-model-item> + </a-col> + <a-col :span="24"> + <a-form-model-item label="创建部门" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="orgCode"> + <a-input v-model="model.orgCode" placeholder="请输入创建部门" ></a-input> + </a-form-model-item> + </a-col> + </a-row> + </a-form-model> + </j-form-container> + </a-spin> +</template> + +<script> + + import { httpAction, getAction } from '@/api/manage' + import { validateDuplicateValue } from '@/utils/util' + + export default { + name: 'StoreInfoForm', + components: { + }, + props: { + //表单禁用 + disabled: { + type: Boolean, + default: false, + required: false + } + }, + data () { + return { + model:{ + }, + labelCol: { + xs: { span: 24 }, + sm: { span: 5 }, + }, + wrapperCol: { + xs: { span: 24 }, + sm: { span: 16 }, + }, + confirmLoading: false, + validatorRules: { + }, + url: { + add: "/erp/storeInfo/add", + edit: "/erp/storeInfo/edit", + queryById: "/erp/storeInfo/queryById" + } + } + }, + computed: { + formDisabled(){ + return this.disabled + }, + }, + created () { + //备份model原始值 + this.modelDefault = JSON.parse(JSON.stringify(this.model)); + }, + methods: { + add () { + this.edit(this.modelDefault); + }, + edit (record) { + this.model = Object.assign({}, record); + this.visible = true; + }, + submitForm () { + const that = this; + // 触发表单验证 + this.$refs.form.validate(valid => { + if (valid) { + that.confirmLoading = true; + let httpurl = ''; + let method = ''; + if(!this.model.id){ + httpurl+=this.url.add; + method = 'post'; + }else{ + httpurl+=this.url.edit; + method = 'put'; + } + httpAction(httpurl,this.model,method).then((res)=>{ + if(res.success){ + that.$message.success(res.message); + that.$emit('ok'); + }else{ + that.$message.warning(res.message); + } + }).finally(() => { + that.confirmLoading = false; + }) + } + + }) + }, + } + } +</script> \ No newline at end of file diff --git a/src/views/erp/modules/StoreInfoModal.Style#Drawer.vue b/src/views/erp/modules/StoreInfoModal.Style#Drawer.vue new file mode 100644 index 0000000..ba4872f --- /dev/null +++ b/src/views/erp/modules/StoreInfoModal.Style#Drawer.vue @@ -0,0 +1,84 @@ +<template> + <a-drawer + :title="title" + :width="width" + placement="right" + :closable="false" + @close="close" + destroyOnClose + :visible="visible"> + <store-info-form ref="realForm" @ok="submitCallback" :disabled="disableSubmit" normal></store-info-form> + <div class="drawer-footer"> + <a-button @click="handleCancel" style="margin-bottom: 0;">关闭</a-button> + <a-button v-if="!disableSubmit" @click="handleOk" type="primary" style="margin-bottom: 0;">提交</a-button> + </div> + </a-drawer> +</template> + +<script> + + import StoreInfoForm from './StoreInfoForm' + + export default { + name: 'StoreInfoModal', + components: { + StoreInfoForm + }, + data () { + return { + title:"操作", + width:800, + visible: false, + disableSubmit: false + } + }, + methods: { + add () { + this.visible=true + this.$nextTick(()=>{ + this.$refs.realForm.add(); + }) + }, + edit (record) { + this.visible=true + this.$nextTick(()=>{ + this.$refs.realForm.edit(record); + }); + }, + close () { + this.$emit('close'); + this.visible = false; + }, + submitCallback(){ + this.$emit('ok'); + this.visible = false; + }, + handleOk () { + this.$refs.realForm.submitForm(); + }, + handleCancel () { + this.close() + } + } + } +</script> + +<style lang="less" scoped> +/** Button按钮间距 */ + .ant-btn { + margin-left: 30px; + margin-bottom: 30px; + float: right; + } + .drawer-footer{ + position: absolute; + bottom: -8px; + width: 100%; + border-top: 1px solid #e8e8e8; + padding: 10px 16px; + text-align: right; + left: 0; + background: #fff; + border-radius: 0 0 2px 2px; + } +</style> \ No newline at end of file diff --git a/src/views/erp/modules/StoreInfoModal.vue b/src/views/erp/modules/StoreInfoModal.vue new file mode 100644 index 0000000..d70e49b --- /dev/null +++ b/src/views/erp/modules/StoreInfoModal.vue @@ -0,0 +1,60 @@ +<template> + <j-modal + :title="title" + :width="width" + :visible="visible" + switchFullscreen + @ok="handleOk" + :okButtonProps="{ class:{'jee-hidden': disableSubmit} }" + @cancel="handleCancel" + cancelText="关闭"> + <store-info-form ref="realForm" @ok="submitCallback" :disabled="disableSubmit"></store-info-form> + </j-modal> +</template> + +<script> + + import StoreInfoForm from './StoreInfoForm' + export default { + name: 'StoreInfoModal', + components: { + StoreInfoForm + }, + data () { + return { + title:'', + width:800, + visible: false, + disableSubmit: false + } + }, + methods: { + add () { + this.visible=true + this.$nextTick(()=>{ + this.$refs.realForm.add(); + }) + }, + edit (record) { + this.visible=true + this.$nextTick(()=>{ + this.$refs.realForm.edit(record); + }) + }, + close () { + this.$emit('close'); + this.visible = false; + }, + handleOk () { + this.$refs.realForm.submitForm(); + }, + submitCallback(){ + this.$emit('ok'); + this.visible = false; + }, + handleCancel () { + this.close() + } + } + } +</script> \ No newline at end of file