|
@@ -39,10 +39,10 @@
|
|
|
<div class="flex-1 p-5 overflow-auto">
|
|
|
<div class="bg-white w-full h-full p-3 shadow-md rounded-md flex flex-col">
|
|
|
<div class="flex justify-end pb-3">
|
|
|
- <el-button type="primary" @click="editProduct(true)">新建产品</el-button>
|
|
|
- <el-button type="primary">批量删除</el-button>
|
|
|
- <el-button type="primary">回收站</el-button>
|
|
|
- <el-button type="primary">导入</el-button>
|
|
|
+ <el-button type="primary" @click="editProduct(false)">新建产品</el-button>
|
|
|
+ <el-button type="primary" @click="batchDelete()">批量删除</el-button>
|
|
|
+ <el-button type="primary" @click="showDeteleProduct(true)">回收站</el-button>
|
|
|
+ <el-button type="primary" @click="dialogVisible.importVisible = true">导入</el-button>
|
|
|
<el-button type="primary">导出</el-button>
|
|
|
</div>
|
|
|
<div class="flex-1 w-full overflow-hidden">
|
|
@@ -57,17 +57,21 @@
|
|
|
}}</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="type" label="产品类别" width="180"></el-table-column>
|
|
|
- <el-table-column prop="unit" label="单位" width="180"></el-table-column>
|
|
|
- <el-table-column prop="price" label="标准价格" width="180"></el-table-column>
|
|
|
+ <el-table-column prop="typeName" label="产品类别" width="180"></el-table-column>
|
|
|
+ <el-table-column prop="unitName" label="单位" width="180"></el-table-column>
|
|
|
+ <el-table-column prop="price" label="标准价格(元)" width="180"></el-table-column>
|
|
|
<el-table-column prop="inventory" label="库存" width="180"></el-table-column>
|
|
|
- <el-table-column prop="status" label="状态" width="180"></el-table-column>
|
|
|
- <el-table-column prop="inchargerId" label="负责人" width="190"></el-table-column>
|
|
|
- <el-table-column prop="creatorId" label="创建人" width="180"></el-table-column>
|
|
|
+ <el-table-column prop="status" label="状态" width="180">
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.status == 1 ? '上架' : '下架' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="inchargerName" label="负责人" width="190"></el-table-column>
|
|
|
+ <el-table-column prop="creatorName" label="创建人" width="180"></el-table-column>
|
|
|
<el-table-column prop="createTime" label="创建时间" width="180"></el-table-column>
|
|
|
<el-table-column label="操作" fixed="right" width="200">
|
|
|
<template #default="scope">
|
|
|
- <el-button link type="primary" size="large">编辑</el-button>
|
|
|
+ <el-button link type="primary" size="large" @click.stop="editProduct(scope.row)">编辑</el-button>
|
|
|
<el-button link type="danger" size="large" @click.stop="deteleRow([scope.row])">删除</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
@@ -75,7 +79,8 @@
|
|
|
</div>
|
|
|
<div class="flex justify-end pt-3">
|
|
|
<el-pagination layout="total, prev, pager, next, sizes" :page-size="filterProductForm.pageSize"
|
|
|
- @size-change="handleSizeChange" @current-change="handleCurrentChange" :total="productTableTotal" :hide-on-single-page="true" />
|
|
|
+ @size-change="handleSizeChange" @current-change="handleCurrentChange" :total="productTableTotal"
|
|
|
+ :hide-on-single-page="true" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -86,8 +91,8 @@
|
|
|
<div class="flex justify-between items-center border-b pb-3 dialog-header">
|
|
|
<h4 :id="titleId">{{ allText.editClueText }}</h4>
|
|
|
<div>
|
|
|
- <el-button type="primary" @click="saveProductRow(true)" v-loading="allLoading.saveLoading">保存并新建</el-button>
|
|
|
- <el-button type="primary" @click="saveProductRow(false)" v-loading="allLoading.saveLoading">保存</el-button>
|
|
|
+ <el-button type="primary" @click="saveProductRow(true)" :loading="allLoading.saveLoading">保存并新建</el-button>
|
|
|
+ <el-button type="primary" @click="saveProductRow(false)" :loading="allLoading.saveLoading">保存</el-button>
|
|
|
<el-button @click="dialogVisible.editProductVisible = false">取消</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -99,17 +104,40 @@
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
|
|
|
+ <el-dialog v-model="dialogVisible.importVisible" width="680" :show-close="false" top="10vh">
|
|
|
+ <template #header="{ close, titleId, titleClass }">
|
|
|
+ <div class="flex justify-between items-center border-b pb-3 dialog-header">
|
|
|
+ <h4 :id="titleId">导入产品</h4>
|
|
|
+ <div class="flex">
|
|
|
+ <el-upload class="upload-demo mr-3" :limit="1" :show-file-list="false" accept=".xlsx" :http-request="importProducts">
|
|
|
+ <el-button type="primary" :loading="allLoading.importLoading">导入</el-button>
|
|
|
+ </el-upload>
|
|
|
+ <el-button @click="dialogVisible.importVisible = false">取消</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="p-8">
|
|
|
+ <div class="ml-4 mr-4">
|
|
|
+ <div class="flex items-center">1、点击下载 <el-link type="primary">产品导入模板.xlsx</el-link></div>
|
|
|
+ <div class="mt-4">2、填写excel文件、产品编号、产品名称、产品类别、标准价格、库存、状态必填</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <DeteleTables :visibles="dialogVisible.deteleProductDialogVisible" @showDeteleProduct="showDeteleProduct" />
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
import { ref, reactive, onMounted, inject } from "vue";
|
|
|
-import { GETSYSFILED, MOD, GETPERSONNEL, GETTEMPLATE, GETTABLELIST, ADDPRODUCT, ALLDETELE } from './api'
|
|
|
+import { GETSYSFILED, MOD, GETPERSONNEL, GETTEMPLATE, GETTABLELIST, ADDPRODUCT, ALLDETELE, UPLOADFILE } from './api'
|
|
|
import { getAllListByCode, getFromValue, resetFromValue, getFirstDayOfMonth, getLastDayOfMonth, formatDate, createTaskFromType, confirmAction } from '@/utils/tools'
|
|
|
-import { FormInstance, FormRules, ElMessageBox, ElTable } from 'element-plus'
|
|
|
-import { post, get } from "@/utils/request";
|
|
|
+import { FormInstance, FormRules, ElMessageBox, ElTable, UploadRequestOptions } from 'element-plus'
|
|
|
+import { post, get, uploadFile } from "@/utils/request";
|
|
|
import { useRouter, useRoute } from "vue-router";
|
|
|
import { GenerateForm } from '@zmjs/form-design';
|
|
|
+import DeteleTables from "./deteleTables.vue";
|
|
|
|
|
|
const router = useRouter()
|
|
|
const globalPopup = inject<GlobalPopup>('globalPopup')
|
|
@@ -128,12 +156,15 @@ const allLoading = reactive({
|
|
|
productTableLading: false,
|
|
|
generateFormLading: false,
|
|
|
saveLoading: false,
|
|
|
+ importLoading: false
|
|
|
})
|
|
|
const dialogVisible = reactive({
|
|
|
editProductVisible: false,
|
|
|
taskModalVisible: false,
|
|
|
clueDialogVisible: false,
|
|
|
- deteleClueDialogVisible: false
|
|
|
+ deteleClueDialogVisible: false,
|
|
|
+ importVisible: false,
|
|
|
+ deteleProductDialogVisible: false
|
|
|
})
|
|
|
const allText = reactive({
|
|
|
editClueText: '新建产品',
|
|
@@ -154,17 +185,31 @@ const genereditForm = ref({}) // 编辑表单
|
|
|
const generateFormKey = ref(1)
|
|
|
|
|
|
// 方法定义
|
|
|
+function batchDelete() {
|
|
|
+ const data = productTableRef.value && productTableRef.value.getSelectionRows()
|
|
|
+ if (!data.length) {
|
|
|
+ globalPopup?.showWarning('请选择数据')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ deteleRow(data)
|
|
|
+}
|
|
|
+
|
|
|
+function showDeteleProduct(flag: boolean) {
|
|
|
+ if(!flag) {
|
|
|
+ getProductTableList()
|
|
|
+ }
|
|
|
+ dialogVisible.deteleProductDialogVisible = flag
|
|
|
+}
|
|
|
+
|
|
|
function deteleRow(items: any[]) {
|
|
|
let ids = items.map(item => item.id).join(',')
|
|
|
let str = items.map(item => item.productName).join(',')
|
|
|
- confirmAction(`确定${items.length > 1 ? '批量删除' : '删除'}【${str}】线索吗?`).then(() => {
|
|
|
- post(ALLDETELE, { ids: ids }).then(res => {
|
|
|
- if (res.code != 'ok') {
|
|
|
- globalPopup?.showError(res.msg)
|
|
|
- return
|
|
|
- }
|
|
|
+ confirmAction(`确定${items.length > 1 ? '批量删除' : '删除'}【${str}】产品吗?`).then(() => {
|
|
|
+ post(ALLDETELE, { ids: ids }).then((_res) => {
|
|
|
globalPopup?.showSuccess('删除成功')
|
|
|
getProductTableList()
|
|
|
+ }).catch((err) => {
|
|
|
+ globalPopup?.showError(err.msg)
|
|
|
})
|
|
|
})
|
|
|
}
|
|
@@ -172,42 +217,45 @@ function deteleRow(items: any[]) {
|
|
|
async function saveProductRow(flag: boolean) {
|
|
|
const data = await generateForm.value.getData()
|
|
|
let newData = { ...genereditForm.value, ...data }
|
|
|
+ delete newData.createTime
|
|
|
allLoading.saveLoading = true
|
|
|
- post(ADDPRODUCT, { ...newData }).then((res) => {
|
|
|
- console.log(res)
|
|
|
- if(res.code != 'ok') {
|
|
|
- globalPopup?.showError(res.msg)
|
|
|
- return
|
|
|
- }
|
|
|
+ post(ADDPRODUCT, { ...newData }).then(() => {
|
|
|
globalPopup?.showSuccess('保存成功')
|
|
|
- if (!flag) {
|
|
|
+ if (flag) {
|
|
|
genereditForm.value = {}
|
|
|
generateForm.value && generateForm.value.reset()
|
|
|
- generateFormKey.value++
|
|
|
}
|
|
|
+ getProductTableList()
|
|
|
dialogVisible.editProductVisible = flag
|
|
|
- }).catch(() => {
|
|
|
- dialogVisible.editProductVisible = flag
|
|
|
+ }).catch((err) => {
|
|
|
+ globalPopup?.showError(err.msg)
|
|
|
}).finally(() => {
|
|
|
allLoading.saveLoading = false
|
|
|
})
|
|
|
}
|
|
|
|
|
|
-function editProduct(_flag: boolean) {
|
|
|
+function editProduct(item: any) {
|
|
|
dialogVisible.editProductVisible = true
|
|
|
allLoading.generateFormLading = true
|
|
|
+ if (item) {
|
|
|
+ genereditForm.value = item
|
|
|
+ allText.editClueText = '编辑产品'
|
|
|
+ }
|
|
|
+ if (!item) {
|
|
|
+ genereditForm.value = {}
|
|
|
+ }
|
|
|
setTimeout(() => {
|
|
|
generateForm.value && generateForm.value.reset()
|
|
|
generateFormKey.value++
|
|
|
allLoading.generateFormLading = false
|
|
|
- }, 1000)
|
|
|
+ }, 500)
|
|
|
}
|
|
|
|
|
|
function getProductTableList() {
|
|
|
allLoading.productTableLading = true
|
|
|
let valueForm = getFromValue(filterProductForm)
|
|
|
post(GETTABLELIST, { ...valueForm }).then((res) => {
|
|
|
- if(res.code == 'ok') {
|
|
|
+ if (res.code == 'ok') {
|
|
|
const { record, total } = res.data
|
|
|
productTableList.value = record
|
|
|
productTableTotal.value = total
|
|
@@ -217,6 +265,19 @@ function getProductTableList() {
|
|
|
})
|
|
|
}
|
|
|
|
|
|
+async function importProducts(param: UploadRequestOptions) {
|
|
|
+ allLoading.importLoading = true
|
|
|
+ const formData = new FormData();
|
|
|
+ formData.append('multipartFile', param.file)
|
|
|
+ const res = await uploadFile(UPLOADFILE, formData)
|
|
|
+ allLoading.importLoading = false
|
|
|
+ if (res.code == 'ok') {
|
|
|
+ globalPopup?.showSuccess(res.msg || '')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ globalPopup?.showError(res.msg || '')
|
|
|
+}
|
|
|
+
|
|
|
function handleSizeChange(val: number) {
|
|
|
filterProductForm.pageIndex = 1
|
|
|
filterProductForm.pageSize = val
|
|
@@ -235,9 +296,9 @@ function resetFilter() {
|
|
|
}
|
|
|
|
|
|
function toProductDetail(row: any) {
|
|
|
- router.push({
|
|
|
- path: `${MOD}/detail`,
|
|
|
- query: { id: row.id }
|
|
|
+ router.push({
|
|
|
+ path: `${MOD}/detail`,
|
|
|
+ query: { id: row.id }
|
|
|
})
|
|
|
}
|
|
|
|