交通事故

龚焕茏

2024-03-11 da2229d6488b4e3574f9e9ad1287326b290e26ac

 src/views/scenery/sceneryOperationData/index.vue

@@ -38,6 +38,9 @@
          <el-col :span="1.5">
            <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>
      </template>
@@ -97,16 +100,16 @@
          &emsp;
          <el-date-picker v-model="form.periodDate" :type="pickerType" :value-format="pickerFormat" placeholder="请选择统计周期" />
        </el-form-item>
        <el-form-item label="车流量" prop="carFlowNum">
        <el-form-item label="车流量" prop="carFlowNum" v-if="indicatorStatus.carFlowNum == 1">
          <el-input v-model="form.carFlowNum" placeholder="请输入车流量" />
        </el-form-item>
        <el-form-item label="人流量" prop="personFlowNum">
        <el-form-item label="人流量" prop="personFlowNum" v-if="indicatorStatus.personFlowNum == 1">
          <el-input v-model="form.personFlowNum" placeholder="请输入人流量" />
        </el-form-item>
        <el-form-item label="游客预约" prop="visitorSubNum">
        <el-form-item label="游客预约" prop="visitorSubNum" v-if="indicatorStatus.visitorSubNum == 1">
          <el-input v-model="form.visitorSubNum" placeholder="请输入游客预约" />
        </el-form-item>
        <el-form-item label="入园人数" prop="enterGardenNum">
        <el-form-item label="入园人数" prop="enterGardenNum" v-if="indicatorStatus.enterGardenNum == 1">
          <el-input v-model="form.enterGardenNum" placeholder="请输入入园人数" />
        </el-form-item>
        <el-form-item label="在岗警力" prop="onPolice">
@@ -129,6 +132,39 @@
        <div class="dialog-footer">
          <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </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>仅允许导入xls、xlsx格式文件。</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>
@@ -279,10 +315,22 @@
  sceneryInfoNames.value = res.rows;
}

import { getIndicatorInfoStatus } from '@/api/indicatorInfo';
import { IndicatorStatus } from '@/api/indicatorInfo/status';
// 调用后端API获取指标状态
const indicatorStatus = ref<IndicatorStatus[]>([]);

/** 查询指标取值状态 */
const getIndicatorStatus = async () => {
  const res = await getIndicatorInfoStatus();
  indicatorStatus.value = res;
}

/** 新增按钮操作 */
const handleAdd = () => {
  reset();
  getSceneryInfoName();
  getIndicatorStatus();
  dialog.visible = true;
  dialog.title = "添加景区运行数据";
}
@@ -358,4 +406,53 @@
  }
}

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>