|
@@ -0,0 +1,443 @@
|
|
|
+<template>
|
|
|
+ <van-nav-bar fixed title="非宗教类信息报送" left-text="" left-arrow @click-left="onClickLeft"
|
|
|
+ :style="{ 'background-color': selectColor }" />
|
|
|
+ <van-loading size="16px" v-show="isLoading">加载中...</van-loading>
|
|
|
+ <div class="main" v-show="!isLoading">
|
|
|
+ <div class="formArea">
|
|
|
+ <!-- <p class="miniTitle">基础信息</p> -->
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field v-model="religiousCategories" center readonly label="宗教类别:" placeholder="请选择宗教类别"
|
|
|
+ input-align="right" right-icon="arrow-down" @click="showPlace1 = true" />
|
|
|
+ <van-popup v-model:show="showPlace1" round position="bottom">
|
|
|
+ <van-picker title="宗教类别" :columns="$dictUtils.getDictList('hs_religion_type')" :columns-field-names="{
|
|
|
+ text: 'label',
|
|
|
+ value: 'value',
|
|
|
+ }" @cancel="showPlace1 = false" @confirm="getType" />
|
|
|
+ </van-popup>
|
|
|
+ </van-cell-group>
|
|
|
+
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field v-model="siteInspection.siteName.name" readonly required center label="场所名称:"
|
|
|
+ placeholder="请选择" input-align="right" right-icon="arrow-down" @click="showPlace = true" />
|
|
|
+ <van-popup v-model:show="showPlace" round position="bottom">
|
|
|
+
|
|
|
+ <van-search placeholder="请输入场所名称" shape="round" input-align="center" v-model="interSearch"
|
|
|
+ @search="onSearch" @cancel="onCancel" />
|
|
|
+ <van-picker title="场所选择" :columns="places" :columns-field-names="customFieldName"
|
|
|
+ @cancel="showPlace = false" @confirm="getPlace" />
|
|
|
+
|
|
|
+ </van-popup>
|
|
|
+ </van-cell-group>
|
|
|
+
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field v-model="siteInspection.reportingTime" center readonly label="时间:" placeholder="请选择时间"
|
|
|
+ input-align="right" right-icon="arrow-down" @click="showAct = true" />
|
|
|
+ <van-popup v-model:show="showAct" round position="bottom">
|
|
|
+ <van-picker-group title="时间" :tabs="['选择日期', '选择时间']" next-step-text="下一步" @confirm="getTime"
|
|
|
+ @cancel="showAct = false">
|
|
|
+ <van-date-picker v-model="currentDate" />
|
|
|
+ <van-time-picker v-model="currentTime" :columns-type="columnsType" />
|
|
|
+ </van-picker-group>
|
|
|
+ </van-popup>
|
|
|
+ </van-cell-group>
|
|
|
+
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field v-model="siteInspection.placeSelectName" center readonly label="地点:" placeholder="请填写地点"
|
|
|
+ input-align="right" right-icon="arrow-down" />
|
|
|
+ <van-popup v-model:show="showArea" round position="bottom">
|
|
|
+ <van-cascader v-model="cascaderValue" title="请选择所在地区" :options="options" @close="showArea = false"
|
|
|
+ @finish="onFinish" :field-names="fieldNames" />
|
|
|
+ </van-popup>
|
|
|
+ </van-cell-group>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field v-model="siteInspection.placeDetailed" center label="详细地址:" placeholder="请填写具体地址"
|
|
|
+ input-align="right">
|
|
|
+ <template #right-icon>
|
|
|
+ <van-icon name="location" @click="getLocation" />
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ </van-cell-group>
|
|
|
+
|
|
|
+ <van-cell-group>
|
|
|
+ <div class="rowTextArea">
|
|
|
+ <van-field v-model="siteInspection.eventOverview" center rows="1" type="textarea" label="事件概述:"
|
|
|
+ label-align="top" />
|
|
|
+ </div>
|
|
|
+ </van-cell-group>
|
|
|
+
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field label="事件内容:" label-align="top">
|
|
|
+ <template #input>
|
|
|
+ <wang-editor ref="contentEditor" v-model="siteInspection.eventContent" style="height: auto;" />
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ </van-cell-group>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <!-- <van-cell-group>
|
|
|
+ <van-field label="内容:" label-align="top">
|
|
|
+ <template #input>
|
|
|
+ <wang-editor ref="contentEditor" v-model="inputForm.content" />
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ </van-cell-group> -->
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="subbtn">
|
|
|
+ <van-button type="primary" @click="submit">提交</van-button>
|
|
|
+ <van-button type="default" hairline>取消</van-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ reactive,
|
|
|
+ ref,
|
|
|
+ onMounted
|
|
|
+ } from "vue";
|
|
|
+ import personList from "../personList.vue";
|
|
|
+ import secularMessageService from "@/api/secularMessage/secularMessageService";
|
|
|
+ import {
|
|
|
+ useRoute
|
|
|
+ } from "vue-router";
|
|
|
+ import tools from "@/api/sys/tools";
|
|
|
+ import {
|
|
|
+ formatDate,
|
|
|
+ formatTime
|
|
|
+ } from "@/utils/datatime";
|
|
|
+ // 图片路径
|
|
|
+ import $base from "@/utils/config";
|
|
|
+ // 富文本编辑器
|
|
|
+ import WangEditor from "@/components/editor/WangEditor";
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ personList, WangEditor
|
|
|
+ },
|
|
|
+ setup() {
|
|
|
+ // 导航栏颜色
|
|
|
+ const selectColor = ref(window.localStorage.getItem("MZ_COLOR"));
|
|
|
+ const onClickLeft = () => {
|
|
|
+ history.back();
|
|
|
+ };
|
|
|
+ const siteInspection = ref({
|
|
|
+ id: "",
|
|
|
+ siteName: {
|
|
|
+ id: "",
|
|
|
+ },
|
|
|
+ place: "",
|
|
|
+ placeSelectName: "",
|
|
|
+ placeDetailed: "",
|
|
|
+ reportingTime: "",
|
|
|
+ eventContent: "",
|
|
|
+ eventOverview: "",
|
|
|
+ //附件
|
|
|
+ enclosure: "",
|
|
|
+ state: "0",
|
|
|
+ assessment: "0",
|
|
|
+ assessmentName: "",
|
|
|
+ });
|
|
|
+
|
|
|
+ // 根据路由初始化
|
|
|
+ let route = useRoute();
|
|
|
+ onMounted(() => {
|
|
|
+ if (route.query.id) {
|
|
|
+ new secularMessageService().queryById(route.query.id).then((data) => {
|
|
|
+ siteInspection.value = data;
|
|
|
+
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 场所名称
|
|
|
+ let places = ref([]);
|
|
|
+ // 场所搜索
|
|
|
+ let interSearch = ref("");
|
|
|
+ const onCancel = () => {
|
|
|
+ interSearch.value = "";
|
|
|
+ places.value = [];
|
|
|
+ placelist();
|
|
|
+ };
|
|
|
+ const onSearch = () => {
|
|
|
+ places.value = [];
|
|
|
+ new tools()
|
|
|
+ .placeList({
|
|
|
+ current: 1,
|
|
|
+ size: 10000,
|
|
|
+ name: interSearch.value
|
|
|
+ })
|
|
|
+ .then(({
|
|
|
+ records
|
|
|
+ }) => {
|
|
|
+ places.value.push(...records);
|
|
|
+ });
|
|
|
+ };
|
|
|
+ const customFieldName = {
|
|
|
+ text: "name",
|
|
|
+ value: "id",
|
|
|
+ };
|
|
|
+ const placelist = () => {
|
|
|
+ new tools()
|
|
|
+ .placeList({
|
|
|
+ current: 1,
|
|
|
+ size: 10000,
|
|
|
+ })
|
|
|
+ .then(({
|
|
|
+ records
|
|
|
+ }) => {
|
|
|
+ places.value.push(...records);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ placelist();
|
|
|
+ let showPlace = ref(false);
|
|
|
+ let showPlace1 = ref(false);
|
|
|
+ let religiousCategories = ref("");
|
|
|
+ const getType = ({
|
|
|
+ selectedOptions
|
|
|
+ }) => {
|
|
|
+ showPlace1.value = false;
|
|
|
+ siteInspection.value.religiousCategories = selectedOptions[0].value;
|
|
|
+ religiousCategories.value = selectedOptions[0].label;
|
|
|
+ };
|
|
|
+ const getPlace = ({
|
|
|
+ selectedOptions
|
|
|
+ }) => {
|
|
|
+ if (selectedOptions[0] != undefined && selectedOptions[0] != null) {
|
|
|
+ showPlace.value = false;
|
|
|
+ siteInspection.value.siteName = selectedOptions[0];
|
|
|
+ siteInspection.value.placeSelectName = selectedOptions[0].placeSelectName;
|
|
|
+ siteInspection.value.place = selectedOptions[0].placeSelectId;
|
|
|
+ siteInspection.value.placeDetailed = selectedOptions[0].place;
|
|
|
+ }
|
|
|
+ };
|
|
|
+ // 获取督查时间
|
|
|
+ let showAct = ref(false);
|
|
|
+ let currentDate = ref(formatDate(new Date()));
|
|
|
+ let currentTime = ref(formatTime(new Date()));
|
|
|
+ const columnsType = ['hour', 'minute', 'second'];
|
|
|
+ const getTime = () => {
|
|
|
+ showAct.value = false;
|
|
|
+ siteInspection.value.reportingTime = `${currentDate.value.join(
|
|
|
+ "-"
|
|
|
+ )} ${currentTime.value.join(":")}`;
|
|
|
+ };
|
|
|
+ let list = {
|
|
|
+ value: [],
|
|
|
+ type: "",
|
|
|
+ };
|
|
|
+
|
|
|
+ // 地区选择
|
|
|
+ let showArea = ref(false);
|
|
|
+ const cascaderValue = ref("");
|
|
|
+ const fieldNames = {
|
|
|
+ text: "name",
|
|
|
+ value: "code",
|
|
|
+ children: "children",
|
|
|
+ };
|
|
|
+ // 选项列表,children 代表子选项,支持多级嵌套
|
|
|
+ let options = ref([]);
|
|
|
+ new tools().treeData().then((res) => {
|
|
|
+ options.value.push(res[0]);
|
|
|
+ });
|
|
|
+ // 全部选项选择完毕后,会触发 finish 事件
|
|
|
+ const onFinish = ({
|
|
|
+ selectedOptions
|
|
|
+ }) => {
|
|
|
+ if (selectedOptions[0] != undefined && selectedOptions[0] != null) {
|
|
|
+ showArea.value = false;
|
|
|
+ siteInspection.value.place = selectedOptions
|
|
|
+ .map((option) => option.name)
|
|
|
+ .join("/");
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ //选择排查结果
|
|
|
+ let showLx = ref(false);
|
|
|
+ const facilityTypes = [{
|
|
|
+ text: "正常",
|
|
|
+ value: "1"
|
|
|
+ }, {
|
|
|
+ text: "异常",
|
|
|
+ value: "2"
|
|
|
+ }];
|
|
|
+ const getfacilityType = ({
|
|
|
+ selectedOptions
|
|
|
+ }) => {
|
|
|
+ if (selectedOptions[0] != undefined && selectedOptions[0] != null) {
|
|
|
+ siteInspection.value.assessment = selectedOptions[0].value;
|
|
|
+ siteInspection.value.assessmentName = selectedOptions[0].text;
|
|
|
+ // getVideoAudioList();
|
|
|
+ // getFireStationList();
|
|
|
+ showLx.value = false;
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ // 文件上传
|
|
|
+ let fileList = ref([]);
|
|
|
+ let fileupList = ref([]);
|
|
|
+ const chooseImg = () => {
|
|
|
+
|
|
|
+ xm.chooseFile({
|
|
|
+ count: 1,
|
|
|
+ name: "file",
|
|
|
+ url: $base + `/sys/file/webupload/upload?uploadPath=csjcqk/siteInspection`,
|
|
|
+ headers: {
|
|
|
+ 'Content-Type': 'multipart/form-data'
|
|
|
+ },
|
|
|
+ }).then(res => {
|
|
|
+ let data = res[0].data
|
|
|
+ data.name = decodeURIComponent(
|
|
|
+ data.id.substring(data.url.lastIndexOf("/") + 1)
|
|
|
+ );
|
|
|
+ data.url = $base + data.url;
|
|
|
+ fileupList.value.push(data);
|
|
|
+ fileList.value.push(data)
|
|
|
+ xm.showToast({
|
|
|
+ message: "上传成功",
|
|
|
+ });
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ // 删除文件
|
|
|
+ const deleteRead = (file) => {
|
|
|
+ //删除文件操作
|
|
|
+ for (let index = 0; index < fileList.value.length; index++) {
|
|
|
+ if (file.id == fileList.value[index].id) {
|
|
|
+ fileList.value.splice(index, 1);
|
|
|
+ if (fileupList.value[index]) {
|
|
|
+ let delurl = fileupList.value[index].url;
|
|
|
+ new tools().uploadFiledelete("", delurl).then(({
|
|
|
+ data
|
|
|
+ }) => {});
|
|
|
+ fileupList.value.splice(index, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ const getLocation = () => {
|
|
|
+ xm.getLocation().then(data => {
|
|
|
+ siteInspection.value.placeDetailed = data.POIName;
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ // 提交数据
|
|
|
+ const submit = () => {
|
|
|
+ //添加保存前判断
|
|
|
+ if (siteInspection.value.siteName.id == "") {
|
|
|
+ window.xm.showToast({
|
|
|
+ message: "请先选择场所信息!"
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+
|
|
|
+ //保存前附件处理
|
|
|
+ siteInspection.value.enclosure = fileupList.value.map((option) => option.id).join("|");
|
|
|
+ new secularMessageService().save(siteInspection.value).then((res) => {
|
|
|
+ if (res.data == "保存宗教类信息上报成功") {
|
|
|
+ window.xm.showToast({
|
|
|
+ message: "保存成功!"
|
|
|
+ })
|
|
|
+ history.back();
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ };
|
|
|
+ return {
|
|
|
+ // 导航栏颜色
|
|
|
+ selectColor,
|
|
|
+ siteInspection,
|
|
|
+ // 场所
|
|
|
+ customFieldName,
|
|
|
+ showPlace,
|
|
|
+ showPlace1,
|
|
|
+ religiousCategories,
|
|
|
+ places,
|
|
|
+ interSearch,
|
|
|
+ onSearch,
|
|
|
+ onCancel,
|
|
|
+ getPlace,
|
|
|
+ // 时间
|
|
|
+ showAct,
|
|
|
+ currentDate,
|
|
|
+ currentTime,
|
|
|
+ columnsType,
|
|
|
+ getTime,
|
|
|
+ // 返回
|
|
|
+ onClickLeft,
|
|
|
+ // 地区选择
|
|
|
+ showArea,
|
|
|
+ fieldNames,
|
|
|
+ options,
|
|
|
+ onFinish,
|
|
|
+ cascaderValue,
|
|
|
+
|
|
|
+ //排查结果选择
|
|
|
+ showLx,
|
|
|
+ facilityTypes,
|
|
|
+ getfacilityType,
|
|
|
+
|
|
|
+ getLocation,
|
|
|
+ getType,
|
|
|
+ // 文件上传
|
|
|
+ chooseImg,
|
|
|
+ fileList,
|
|
|
+ fileupList,
|
|
|
+ deleteRead,
|
|
|
+ submit,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+ .van-cell__value .van-field__right-icon .van-icon-location {
|
|
|
+ color: #36a7f3 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .van-uploader .van-button {
|
|
|
+ border: none;
|
|
|
+ color: #36a7f3;
|
|
|
+ top: -4px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .van-dialog {
|
|
|
+ width: 80%;
|
|
|
+ top: 50%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .van-loading {
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 80px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .preview-cover {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ padding: 4px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 12px;
|
|
|
+ text-align: center;
|
|
|
+ background: rgba(0, 0, 0, 0.3);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .rowTextArea::v-deep .van-field__value {
|
|
|
+ width: 94%;
|
|
|
+ border: 2px solid #ccc;
|
|
|
+ border-radius: 10px;
|
|
|
+ padding: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .rowTextArea::v-deep .van-cell {
|
|
|
+ display: flow-root;
|
|
|
+ }
|
|
|
+</style>
|