From a473c0680b7b003c33fa6ae5f646eb851e17fe8f Mon Sep 17 00:00:00 2001
From: 龚焕茏 <2842157468@qq.com>
Date: 星期三, 06 三月 2024 18:06:56 +0800
Subject: [PATCH] 上传图片
---
src/views/scenery/sceneryOperationData/index.vue | 246 ++++++++++++++++++++++++++++++++++++-------------
1 files changed, 180 insertions(+), 66 deletions(-)
diff --git a/src/views/scenery/sceneryOperationData/index.vue b/src/views/scenery/sceneryOperationData/index.vue
index 805829f..4ed518f 100644
--- a/src/views/scenery/sceneryOperationData/index.vue
+++ b/src/views/scenery/sceneryOperationData/index.vue
@@ -3,35 +3,17 @@
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div class="search" v-show="showSearch">
<el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="鍛ㄦ湡骞�" prop="periodYear">
- <el-input v-model="queryParams.periodYear" placeholder="璇疯緭鍏ュ懆鏈熷勾" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ <el-form-item label="鏅尯鍚嶇О" prop="sceneryInfoName">
+ <el-input v-model="queryParams.sceneryInfoName" placeholder="璇疯緭鍏ユ櫙鍖哄悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
</el-form-item>
- <el-form-item label="鍛ㄦ湡鏈�" prop="periodMonth">
- <el-input v-model="queryParams.periodMonth" placeholder="璇疯緭鍏ュ懆鏈熸湀" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ <el-form-item label="鍛ㄦ湡" prop="periodDate">
+ <el-input v-model="queryParams.periodDate" placeholder="璇疯緭鍏ュ懆鏈�" clearable style="width: 240px" @keyup.enter="handleQuery" />
</el-form-item>
- <el-form-item label="杞︽祦閲�" prop="carFlowNum">
- <el-input v-model="queryParams.carFlowNum" placeholder="璇疯緭鍏ヨ溅娴侀噺" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="浜烘祦閲�" prop="personFlowNum">
- <el-input v-model="queryParams.personFlowNum" placeholder="璇疯緭鍏ヤ汉娴侀噺" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="娓稿棰勭害" prop="visitorSubNum">
- <el-input v-model="queryParams.visitorSubNum" placeholder="璇疯緭鍏ユ父瀹㈤绾�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鍏ュ洯浜烘暟" prop="enterGardenNum">
- <el-input v-model="queryParams.enterGardenNum" placeholder="璇疯緭鍏ュ叆鍥汉鏁�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鍦ㄥ矖璀﹀姏" prop="onPolice">
- <el-input v-model="queryParams.onPolice" placeholder="璇疯緭鍏ュ湪宀楄鍔�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鍦ㄥ矖璀﹁溅" prop="onPaddyWagon">
- <el-input v-model="queryParams.onPaddyWagon" placeholder="璇疯緭鍏ュ湪宀楄杞�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="澶囧嫟璀﹀姏" prop="standbyPolice">
- <el-input v-model="queryParams.standbyPolice" placeholder="璇疯緭鍏ュ鍕よ鍔�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鏅尯id" prop="scId">
- <el-input v-model="queryParams.scId" placeholder="璇疯緭鍏ユ櫙鍖篿d" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="璇烽�夋嫨" clearable style="width: 240px" @keyup.enter="handleQuery" >
+ <el-option key="1" label="宸插惎鐢�" value="1" />
+ <el-option key="2" label="宸茬鐢�" value="2" />
+ </el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
@@ -45,16 +27,19 @@
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
- <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['rs:sceneryOperationData:add']">鏂板</el-button>
+ <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['demo:sceneryOperationData:add']">鏂板</el-button>
</el-col>
<el-col :span="1.5">
- <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['rs:sceneryOperationData:edit']">淇敼</el-button>
+ <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['demo:sceneryOperationData:edit']">淇敼</el-button>
</el-col>
<el-col :span="1.5">
- <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['rs:sceneryOperationData:remove']">鍒犻櫎</el-button>
+ <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['demo:sceneryOperationData:remove']">鍒犻櫎</el-button>
</el-col>
<el-col :span="1.5">
- <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['rs:sceneryOperationData:export']">瀵煎嚭</el-button>
+ <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['demo:sceneryOperationData:export']">瀵煎嚭</el-button>
+ </el-col>
+ <el-col :span="1.5">
+ <el-button type="info" plain icon="Top" @click="handleImport" v-hasPermi="['demo:sceneryOperationData:importTemplate']">瀵煎叆</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@@ -62,9 +47,9 @@
<el-table v-loading="loading" :data="sceneryOperationDataList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
- <el-table-column label="id" align="center" prop="id" v-if="true" />
- <el-table-column label="鍛ㄦ湡骞�" align="center" prop="periodYear" />
- <el-table-column label="鍛ㄦ湡鏈�" align="center" prop="periodMonth" />
+ <el-table-column label="搴忓彿" align="center" type="index" v-if="true" width="60" />
+ <el-table-column label="鏅尯鍚嶇О" align="center" prop="sceneryInfoName" />
+ <el-table-column label="缁熻鍛ㄦ湡" align="center" prop="periodDate" />
<el-table-column label="杞︽祦閲�" align="center" prop="carFlowNum" />
<el-table-column label="浜烘祦閲�" align="center" prop="personFlowNum" />
<el-table-column label="娓稿棰勭害" align="center" prop="visitorSubNum" />
@@ -72,15 +57,20 @@
<el-table-column label="鍦ㄥ矖璀﹀姏" align="center" prop="onPolice" />
<el-table-column label="鍦ㄥ矖璀﹁溅" align="center" prop="onPaddyWagon" />
<el-table-column label="澶囧嫟璀﹀姏" align="center" prop="standbyPolice" />
- <el-table-column label="鐘舵�� 1鍚敤 0鏈惎鐢�" align="center" prop="status" />
- <el-table-column label="鏅尯id" align="center" prop="scId" />
+ <el-table-column label="鐘舵��" align="center" prop="status">
+ <template #default="scope">
+ <span v-show="scope.row['status'] == 1">宸插惎鐢�</span>
+ <span v-show="scope.row['status'] == 2" style="color: rgba(227, 70,101);">宸茬鐢�</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" />
<el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="淇敼" placement="top">
- <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['rs:sceneryOperationData:edit']"></el-button>
+ <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['demo:sceneryOperationData:edit']"></el-button>
</el-tooltip>
<el-tooltip content="鍒犻櫎" placement="top">
- <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['rs:sceneryOperationData:remove']"></el-button>
+ <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['demo:sceneryOperationData:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
@@ -97,11 +87,18 @@
<!-- 娣诲姞鎴栦慨鏀规櫙鍖鸿繍琛屾暟鎹璇濇 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="sceneryOperationDataFormRef" :model="form" :rules="rules" label-width="80px">
- <el-form-item label="鍛ㄦ湡骞�" prop="periodYear">
- <el-input v-model="form.periodYear" placeholder="璇疯緭鍏ュ懆鏈熷勾" />
+ <el-form-item label="鏅尯鍚嶇О" prop="sceneryInfoName">
+ <el-select v-model="form.sceneryInfoName" placeholder="璇烽�夋嫨" clearable style="width: 240px" @change="setSceneryInfoId" >
+ <el-option v-for="item in sceneryInfoNames" :key="item.sceneryName" :label="item.sceneryName" :value="item.sceneryName"/>
+ </el-select>
</el-form-item>
- <el-form-item label="鍛ㄦ湡鏈�" prop="periodMonth">
- <el-input v-model="form.periodMonth" placeholder="璇疯緭鍏ュ懆鏈熸湀" />
+ <el-form-item label="缁熻鍛ㄦ湡" prop="periodDate">
+ <el-select v-model="form.period" placeholder="璇烽�夋嫨" style="width: 100px;" @change="clearPeriod">
+ <el-option key="1" label="骞村害" :value="1" />
+ <el-option key="2" label="鏈堝害" :value="2" />
+ </el-select>
+  
+ <el-date-picker v-model="form.periodDate" :type="pickerType" :value-format="pickerFormat" placeholder="璇烽�夋嫨缁熻鍛ㄦ湡" />
</el-form-item>
<el-form-item label="杞︽祦閲�" prop="carFlowNum">
<el-input v-model="form.carFlowNum" placeholder="璇疯緭鍏ヨ溅娴侀噺" />
@@ -124,8 +121,11 @@
<el-form-item label="澶囧嫟璀﹀姏" prop="standbyPolice">
<el-input v-model="form.standbyPolice" placeholder="璇疯緭鍏ュ鍕よ鍔�" />
</el-form-item>
- <el-form-item label="鏅尯id" prop="scId">
- <el-input v-model="form.scId" placeholder="璇疯緭鍏ユ櫙鍖篿d" />
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="form.status" placeholder="璇烽�夋嫨">
+ <el-option key="1" label="宸插惎鐢�" :value="1" />
+ <el-option key="2" label="宸茬鐢�" :value="2" />
+ </el-select>
</el-form-item>
</el-form>
<template #footer>
@@ -135,12 +135,46 @@
</div>
</template>
</el-dialog>
+
+ <!-- 鏁版嵁瀵煎叆瀵硅瘽妗� -->
+ <el-dialog :title="upload.title" v-model="upload.open" width="400px" append-to-body>
+ <el-upload
+ ref="uploadRef"
+ :limit="1"
+ accept=".xlsx, .xls"
+ :headers="upload.headers"
+ :action="upload.url + '?updateSupport=' + upload.updateSupport"
+ :disabled="upload.isUploading"
+ :on-progress="handleFileUploadProgress"
+ :on-success="handleFileSuccess"
+ :auto-upload="false"
+ drag
+ >
+ <el-icon class="el-icon--upload">
+ <i-ep-upload-filled />
+ </el-icon>
+ <div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
+ <template #tip>
+ <div class="text-center el-upload__tip">
+ <span>浠呭厑璁稿鍏ls銆亁lsx鏍煎紡鏂囦欢銆�</span>
+ <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">涓嬭浇妯℃澘</el-link>
+ </div>
+ </template>
+ </el-upload>
+ <template #footer>
+ <div class="dialog-footer">
+ <el-button type="primary" @click="submitFileForm">纭� 瀹�</el-button>
+ <el-button @click="upload.open = false">鍙� 娑�</el-button>
+ </div>
+ </template>
+ </el-dialog>
</div>
</template>
<script setup name="SceneryOperationData" lang="ts">
-import { listSceneryOperationData, getSceneryOperationData, delSceneryOperationData, addSceneryOperationData, updateSceneryOperationData } from '@/api/scenery/sceneryOperationData';
+import { getSceneryInfoNames, listSceneryOperationData, getSceneryOperationData, delSceneryOperationData, addSceneryOperationData, updateSceneryOperationData } from '@/api/scenery/sceneryOperationData';
import { SceneryOperationDataVO, SceneryOperationDataQuery, SceneryOperationDataForm } from '@/api/scenery/sceneryOperationData/types';
+import { SceneryInfoVO } from '@/api/sceneryInfo/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -163,8 +197,10 @@
const initFormData: SceneryOperationDataForm = {
id: undefined,
- periodYear: undefined,
- periodMonth: undefined,
+ sceneryInfoId: undefined,
+ sceneryInfoName: undefined,
+ period: undefined,
+ periodDate: undefined,
carFlowNum: undefined,
personFlowNum: undefined,
visitorSubNum: undefined,
@@ -173,24 +209,15 @@
onPaddyWagon: undefined,
standbyPolice: undefined,
status: undefined,
- scId: undefined
}
const data = reactive<PageData<SceneryOperationDataForm, SceneryOperationDataQuery>>({
form: {...initFormData},
queryParams: {
pageNum: 1,
pageSize: 10,
- periodYear: undefined,
- periodMonth: undefined,
- carFlowNum: undefined,
- personFlowNum: undefined,
- visitorSubNum: undefined,
- enterGardenNum: undefined,
- onPolice: undefined,
- onPaddyWagon: undefined,
- standbyPolice: undefined,
+ sceneryInfoName: undefined,
+ periodDate: undefined,
status: undefined,
- scId: undefined,
params: {
}
},
@@ -198,11 +225,17 @@
id: [
{ required: true, message: "id涓嶈兘涓虹┖", trigger: "blur" }
],
- periodYear: [
- { required: true, message: "鍛ㄦ湡骞翠笉鑳戒负绌�", trigger: "blur" }
+ sceneryInfoId: [
+ { required: true, message: "鏅尯id涓嶈兘涓虹┖", trigger: "blur" }
],
- periodMonth: [
- { required: true, message: "鍛ㄦ湡鏈堜笉鑳戒负绌�", trigger: "blur" }
+ sceneryInfoName: [
+ { required: true, message: "鏅尯鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ period: [
+ { required: true, message: "骞村害/鏈堝害 1骞村害 2鏈堝害涓嶈兘涓虹┖", trigger: "blur" }
+ ],
+ periodDate: [
+ { required: true, message: "鍛ㄦ湡涓嶈兘涓虹┖", trigger: "blur" }
],
carFlowNum: [
{ required: true, message: "杞︽祦閲忎笉鑳戒负绌�", trigger: "blur" }
@@ -228,9 +261,6 @@
status: [
{ required: true, message: "鐘舵�� 1鍚敤 0鏈惎鐢ㄤ笉鑳戒负绌�", trigger: "change" }
],
- scId: [
- { required: true, message: "鏅尯id涓嶈兘涓虹┖", trigger: "blur" }
- ]
}
});
@@ -276,9 +306,19 @@
multiple.value = !selection.length;
}
+// 璋冪敤鍚庣API鑾峰彇鏅尯鍚嶇О鍒楄〃
+const sceneryInfoNames = ref<SceneryInfoVO[]>([]);
+
+/** 鏌ヨ鏅尯杩愯鏁版嵁鍒楄〃 */
+const getSceneryInfoName = async () => {
+ const res = await getSceneryInfoNames();
+ sceneryInfoNames.value = res.rows;
+}
+
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
reset();
+ getSceneryInfoName();
dialog.visible = true;
dialog.title = "娣诲姞鏅尯杩愯鏁版嵁";
}
@@ -312,6 +352,7 @@
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: SceneryOperationDataVO) => {
+ if(row?.status == 1) { proxy?.$modal.msgWarning("褰撳墠涓哄凡鍚敤鐘舵�侊紝涓嶆敮鎸佸垹闄�"); return; }
const _ids = row?.id || ids.value;
await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鏅尯杩愯鏁版嵁缂栧彿涓�"' + _ids + '"鐨勬暟鎹」锛�').finally(() => loading.value = false);
await delSceneryOperationData(_ids);
@@ -321,7 +362,7 @@
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download('sc/sceneryOperationData/export', {
+ proxy?.download('demo/sceneryOperationData/export', {
...queryParams.value
}, `sceneryOperationData_${new Date().getTime()}.xlsx`)
}
@@ -329,4 +370,77 @@
onMounted(() => {
getList();
});
+
+
+/** 鍛ㄦ湡骞存垨鏈� */
+const pickerType = computed(() => {
+ return form.value.period === 1 ? 'year' : 'month';
+});
+
+const pickerFormat = computed(() => {
+ return form.value.period === 1 ? 'YYYY' : 'YYYY-MM';
+});
+
+/** 娓呯┖鍛ㄦ湡 */
+const clearPeriod = () => {
+ form.value.periodDate = undefined;
+};
+
+/** 璁剧疆鏅尯ID */
+const setSceneryInfoId = (sceneryInfoName: any) => {
+ const item = sceneryInfoNames.value.find(item => item.sceneryName === sceneryInfoName);
+ if(item) {
+ form.value.sceneryInfoId = item.id;
+ }
+}
+
+import { globalHeaders } from "@/utils/request";
+/*** 瀵煎叆鍙傛暟 */
+const upload = reactive<ImportOption>({
+ // 鏄惁鏄剧ず寮瑰嚭灞傦紙瀵煎叆锛�
+ open: false,
+ // 寮瑰嚭灞傛爣棰橈紙瀵煎叆锛�
+ title: "",
+ // 鏄惁绂佺敤涓婁紶
+ isUploading: false,
+ // 鏄惁鏇存柊宸茬粡瀛樺湪鐨勭敤鎴锋暟鎹�
+ updateSupport: 0,
+ // 璁剧疆涓婁紶鐨勮姹傚ご閮�
+ headers: globalHeaders(),
+ // 涓婁紶鐨勫湴鍧�
+ url: import.meta.env.VITE_APP_BASE_API + "/demo/sceneryOperationData/importData"
+})
+/** 涓嬭浇妯℃澘鎿嶄綔 */
+const importTemplate = () => {
+ proxy?.download("demo/sceneryOperationData/importTemplate", {
+ }, `鏅尯杩愯鏁版嵁瀵煎叆妯℃澘_${new Date().getTime()}.xlsx`);
+}
+
+/** 瀵煎叆鎸夐挳鎿嶄綔 */
+const handleImport = () => {
+ upload.title = "鐢ㄦ埛瀵煎叆";
+ upload.open = true;
+}
+
+/**鏂囦欢涓婁紶涓鐞� */
+const handleFileUploadProgress = () => {
+ upload.isUploading = true;
+}
+
+const uploadRef = ref<ElUploadInstance>();
+
+/** 鏂囦欢涓婁紶鎴愬姛澶勭悊 */
+const handleFileSuccess = (response: any, file: UploadFile) => {
+ upload.open = false;
+ upload.isUploading = false;
+ uploadRef.value?.handleRemove(file);
+ ElMessageBox.alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "瀵煎叆缁撴灉", { dangerouslyUseHTMLString: true });
+ getList();
+}
+
+/** 鎻愪氦涓婁紶鏂囦欢 */
+function submitFileForm() {
+ uploadRef.value?.submit();
+}
+
</script>
--
Gitblit v1.8.0