|
@@ -1,65 +1,33 @@
|
|
|
<template>
|
|
|
- <van-nav-bar
|
|
|
- fixed
|
|
|
- title="信教异常群众信息上报"
|
|
|
- left-text=""
|
|
|
- left-arrow
|
|
|
- @click-left="onClickLeft"
|
|
|
- />
|
|
|
+ <van-nav-bar fixed title="信教异常群众信息上报" left-text="" left-arrow @click-left="onClickLeft" />
|
|
|
<van-loading size="16px" v-if="isLoading">加载中...</van-loading>
|
|
|
<div class="main" v-if="!isLoading">
|
|
|
<!-- <p class="title">信教异常群众上报</p> -->
|
|
|
- <van-form
|
|
|
- class="formArea"
|
|
|
- @submit="submit"
|
|
|
- show-error
|
|
|
- :show-error-message="false"
|
|
|
- validate-trigger="onChange"
|
|
|
- >
|
|
|
+ <van-form class="formArea" @submit="submit" show-error :show-error-message="false" validate-trigger="onChange">
|
|
|
<!-- <p class="miniTitle">基础信息</p> -->
|
|
|
<van-cell-group>
|
|
|
- <van-field
|
|
|
- v-model="inputForm.abnormalName"
|
|
|
- center
|
|
|
- required
|
|
|
- :rules="[{ required: true }]"
|
|
|
- label="异常人员:"
|
|
|
- placeholder="请填写异常人员姓名"
|
|
|
- input-align="right"
|
|
|
- />
|
|
|
+ <van-field v-model="religiousType" center readonly label="宗教类型:" placeholder="请选择宗教类型" input-align="right"
|
|
|
+ right-icon="arrow-down" @click="showPlace = true" />
|
|
|
+ <van-popup v-model:show="showPlace" round position="bottom">
|
|
|
+ <van-picker title="宗教类型" :columns="$dictUtils.getDictList('hs_religion_type')" :columns-field-names="{
|
|
|
+ text: 'label',
|
|
|
+ value: 'value'
|
|
|
+ }" @cancel="showPlace = false" @confirm="getType" />
|
|
|
+ </van-popup>
|
|
|
+ </van-cell-group>
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field v-model="inputForm.abnormalName" center label="异常人员:" placeholder="请填写异常人员姓名" input-align="right" />
|
|
|
</van-cell-group>
|
|
|
<van-cell-group>
|
|
|
- <van-field
|
|
|
- v-model="inputForm.abnormalIdcar"
|
|
|
- center
|
|
|
- required
|
|
|
- :rules="[{ required: true }]"
|
|
|
- label="身份证号:"
|
|
|
- placeholder="请填写身份证号"
|
|
|
- input-align="right"
|
|
|
- type="digit"
|
|
|
- />
|
|
|
+ <van-field v-model="inputForm.abnormalIdcar" center label="身份证号:" placeholder="请填写身份证号" input-align="right"
|
|
|
+ type="digit" />
|
|
|
</van-cell-group>
|
|
|
<van-cell-group>
|
|
|
- <van-field
|
|
|
- v-model="inputForm.abnormalPhone"
|
|
|
- center
|
|
|
- required
|
|
|
- :rules="[{ required: true }]"
|
|
|
- label="手机号:"
|
|
|
- placeholder="请填写手机号"
|
|
|
- input-align="right"
|
|
|
- type="tel"
|
|
|
- />
|
|
|
+ <van-field v-model="inputForm.abnormalPhone" center label="手机号:" placeholder="请填写手机号" input-align="right"
|
|
|
+ type="tel" />
|
|
|
</van-cell-group>
|
|
|
<van-cell-group>
|
|
|
- <van-field
|
|
|
- name="radio"
|
|
|
- label="性别:"
|
|
|
- required
|
|
|
- :rules="[{ required: true }]"
|
|
|
- input-align="right"
|
|
|
- >
|
|
|
+ <van-field name="radio" label="性别:" input-align="right">
|
|
|
<template #input>
|
|
|
<van-radio-group v-model="inputForm.sex" direction="horizontal">
|
|
|
<van-radio name="1">男</van-radio>
|
|
@@ -69,74 +37,41 @@
|
|
|
</van-field>
|
|
|
</van-cell-group>
|
|
|
<van-cell-group>
|
|
|
- <van-field
|
|
|
- v-model="inputForm.nativePlace"
|
|
|
- center
|
|
|
- readonly
|
|
|
- required
|
|
|
- :rules="[{ required: true }]"
|
|
|
- label="籍贯:"
|
|
|
- placeholder="请选择籍贯"
|
|
|
- input-align="right"
|
|
|
- right-icon="arrow-down"
|
|
|
- @click="showArea = true"
|
|
|
- />
|
|
|
+ <van-field v-model="inputForm.nativePlace" center readonly label="籍贯:" placeholder="请选择籍贯" input-align="right"
|
|
|
+ right-icon="arrow-down" @click="showArea = true" />
|
|
|
<van-popup v-model:show="showArea" round position="bottom">
|
|
|
- <van-cascader
|
|
|
- v-model="cascaderValue"
|
|
|
- title="请选择籍贯"
|
|
|
- :options="options"
|
|
|
- @close="showArea = false"
|
|
|
- @finish="onFinish2"
|
|
|
- />
|
|
|
+ <van-cascader v-model="cascaderValue" title="请选择籍贯" :options="options" @close="showArea = false"
|
|
|
+ @finish="onFinish2" />
|
|
|
</van-popup>
|
|
|
</van-cell-group>
|
|
|
<van-cell-group>
|
|
|
- <van-field
|
|
|
- v-model="inputForm.currentResidence"
|
|
|
- center
|
|
|
- readonly
|
|
|
- required
|
|
|
- :rules="[{ required: true }]"
|
|
|
- label="现居地:"
|
|
|
- placeholder="请选择现居地"
|
|
|
- input-align="right"
|
|
|
- right-icon="arrow-down"
|
|
|
- @click="showCurrentArea = true"
|
|
|
- />
|
|
|
+ <van-field v-model="inputForm.currentResidence" center readonly label="现居地:" placeholder="请选择现居地"
|
|
|
+ input-align="right" right-icon="arrow-down" @click="showCurrentArea = true" />
|
|
|
<van-popup v-model:show="showCurrentArea" round position="bottom">
|
|
|
- <van-cascader
|
|
|
- v-model="cascaderValue"
|
|
|
- title="请选择现居地"
|
|
|
- :options="options"
|
|
|
- @close="showCurrentArea = false"
|
|
|
- @finish="onFinish"
|
|
|
- />
|
|
|
+ <van-cascader v-model="cascaderValue" title="请选择现居地" :options="options" @close="showCurrentArea = false"
|
|
|
+ @finish="onFinish" />
|
|
|
</van-popup>
|
|
|
</van-cell-group>
|
|
|
<van-cell-group>
|
|
|
- <van-field
|
|
|
- v-model="inputForm.currentResidenceDetail"
|
|
|
- center
|
|
|
- label="现居地详情:"
|
|
|
- placeholder="请填写现居地详情"
|
|
|
- input-align="right"
|
|
|
- right-icon="location"
|
|
|
- />
|
|
|
+ <van-field v-model="inputForm.currentResidenceDetail" center label="现居地详情:" placeholder="请填写现居地详情"
|
|
|
+ input-align="right" right-icon="location" />
|
|
|
</van-cell-group>
|
|
|
<van-cell-group>
|
|
|
<div class="rowTextArea">
|
|
|
- <van-field
|
|
|
- v-model="inputForm.abnormalBehavior"
|
|
|
- placeholder="请填写异常行为"
|
|
|
- center
|
|
|
- rows="2"
|
|
|
- type="textarea"
|
|
|
- label="异常行为:"
|
|
|
- label-align="top"
|
|
|
- />
|
|
|
+ <van-field v-model="inputForm.abnormalBehavior" placeholder="请填写异常行为" center rows="2" type="textarea"
|
|
|
+ label="异常行为:" label-align="top" />
|
|
|
</div>
|
|
|
</van-cell-group>
|
|
|
+ <van-cell-group>
|
|
|
+ <van-field name="uploader" required :rules="[{ required: true }]" label="附件上传:">
|
|
|
+ <template #input>
|
|
|
+ <van-uploader :after-read="afterRead" v-model="fileList" :max-count="5" capture="camera" accept=""
|
|
|
+ :preview-full-image="false" :before-delete="deleteRead">
|
|
|
+ <van-button>上传文件</van-button>
|
|
|
+ </van-uploader>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ </van-cell-group>
|
|
|
<div class="subbtn">
|
|
|
<van-button type="primary" native-type="submit">提交</van-button>
|
|
|
<van-button type="default" hairline>取消</van-button>
|
|
@@ -145,11 +80,14 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
- <script>
|
|
|
-import { ref, onMounted } from "vue";
|
|
|
+<script>
|
|
|
+import { ref, onMounted, getCurrentInstance } from "vue";
|
|
|
import { useCascaderAreaData } from "@vant/area-data";
|
|
|
import ReligiousPeopleReportService from "@/api/differentbelievers/ReligiousPeopleReportService";
|
|
|
import { useRoute } from "vue-router";
|
|
|
+import tools from "@/api/sys/tools";
|
|
|
+// 图片路径
|
|
|
+import $base from "@/utils/config";
|
|
|
export default {
|
|
|
setup() {
|
|
|
// 返回
|
|
@@ -160,25 +98,28 @@ export default {
|
|
|
let isLoading = ref(true);
|
|
|
// 异常人员信息
|
|
|
const inputForm = ref({
|
|
|
- id: "",
|
|
|
- abnormalName: "",
|
|
|
- abnormalIdcar: "",
|
|
|
- sex: "1",
|
|
|
- abnormalPhone: "",
|
|
|
- nativePlace: "",
|
|
|
- currentResidence: "",
|
|
|
- currentResidenceDetail: "",
|
|
|
- abnormalBehavior: "",
|
|
|
- state: "0",
|
|
|
- assessment: "0",
|
|
|
- currentResidenceId: "",
|
|
|
- currentResidenceLevel1: "",
|
|
|
- currentResidenceLevel2: "",
|
|
|
- currentResidenceLevel3: "",
|
|
|
- currentResidenceLevel4: "",
|
|
|
- currentResidenceLevel5: "",
|
|
|
- currentResidenceLevel6: "",
|
|
|
+ id: '',
|
|
|
+ abnormalName: '',
|
|
|
+ religiousType: '',
|
|
|
+ information: '',
|
|
|
+ abnormalIdcar: '',
|
|
|
+ sex: '',
|
|
|
+ abnormalPhone: '',
|
|
|
+ nativePlace: '',
|
|
|
+ currentResidence: '',
|
|
|
+ currentResidenceDetail: '',
|
|
|
+ abnormalBehavior: '',
|
|
|
+ state: '0',
|
|
|
+ assessment: '0',
|
|
|
+ currentResidenceId: '',
|
|
|
+ currentResidenceLevel1: '',
|
|
|
+ currentResidenceLevel2: '',
|
|
|
+ currentResidenceLevel3: '',
|
|
|
+ currentResidenceLevel4: '',
|
|
|
+ currentResidenceLevel5: '',
|
|
|
+ currentResidenceLevel6: ''
|
|
|
});
|
|
|
+ const current = getCurrentInstance()
|
|
|
// 根据路由初始化
|
|
|
let route = useRoute();
|
|
|
onMounted(() => {
|
|
@@ -187,6 +128,27 @@ export default {
|
|
|
.queryById(route.query.id)
|
|
|
.then((data) => {
|
|
|
inputForm.value = data;
|
|
|
+ religiousType.value = current.appContext.config.globalProperties.$dictUtils.getDictLabel('hs_religion_type', inputForm.value.religiousType)
|
|
|
+ inputForm.value.information.split("|").forEach((item) => {
|
|
|
+ if (item.trim().length > 0) {
|
|
|
+ fileupList.value.push({
|
|
|
+ file: {
|
|
|
+ name: decodeURIComponent(
|
|
|
+ item.substring(item.lastIndexOf("/") + 1)
|
|
|
+ ),
|
|
|
+ },
|
|
|
+ url: item,
|
|
|
+ });
|
|
|
+ fileList.value.push({
|
|
|
+ file: {
|
|
|
+ name: decodeURIComponent(
|
|
|
+ item.substring(item.lastIndexOf("/") + 1)
|
|
|
+ ),
|
|
|
+ },
|
|
|
+ url: $base + item.replace("程序附件//", "程序附件/"),
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
isLoading.value = false;
|
|
|
});
|
|
|
} else {
|
|
@@ -201,22 +163,77 @@ export default {
|
|
|
// 全部选项选择完毕后,会触发 finish 事件
|
|
|
const onFinish = ({ selectedOptions }) => {
|
|
|
showCurrentArea.value = false;
|
|
|
- inputForm.value.currentResidence = selectedOptions
|
|
|
+ console.log(selectedOptions);
|
|
|
+ inputForm.value.currentResidence = '中国/' + selectedOptions
|
|
|
.map((option) => option.text)
|
|
|
.join("/");
|
|
|
+ inputForm.value.currentResidenceId = '100000/' + selectedOptions
|
|
|
+ .map((option) => option.value)
|
|
|
+ .join("/");
|
|
|
+ inputForm.value.currentResidenceLevel1 = '100000'
|
|
|
+ inputForm.value.currentResidenceLevel2 = selectedOptions[0].value ? selectedOptions[0].value : ''
|
|
|
+ inputForm.value.currentResidenceLevel3 = selectedOptions[1].value ? selectedOptions[1].value : ''
|
|
|
+ inputForm.value.currentResidenceLevel4 = selectedOptions[2].value ? selectedOptions[2].value : ''
|
|
|
};
|
|
|
// 籍贯选择
|
|
|
let showArea = ref(false);
|
|
|
// 全部选项选择完毕后,会触发 finish 事件
|
|
|
const onFinish2 = ({ selectedOptions }) => {
|
|
|
showArea.value = false;
|
|
|
- inputForm.value.nativePlace = selectedOptions
|
|
|
+ inputForm.value.nativePlace = '中国/' + selectedOptions
|
|
|
.map((option) => option.text)
|
|
|
.join("/");
|
|
|
};
|
|
|
+ const getType = ({ selectedOptions }) => {
|
|
|
+ showPlace.value = false;
|
|
|
+ inputForm.value.religiousType = selectedOptions[0].value;
|
|
|
+ religiousType.value = selectedOptions[0].label
|
|
|
+ };
|
|
|
+ // 文件上传
|
|
|
+ let fileList = ref([]);
|
|
|
+ let fileupList = ref([]);
|
|
|
+ const afterRead = (file) => {
|
|
|
+ file.status = "uploading";
|
|
|
+ file.message = "上传中";
|
|
|
+ // 此时可以自行将文件上传至服务器
|
|
|
+ new tools()
|
|
|
+ .uploadFile(file, `differentbelievers/religiousPeopleReport`)
|
|
|
+ .then(({ data, status, statusText }) => {
|
|
|
+ if (status == 200 || statusText == "OK") {
|
|
|
+ file.status = "done";
|
|
|
+ // xm.showToast({
|
|
|
+ // message: "上传成功",
|
|
|
+ // });
|
|
|
+ data.name = decodeURIComponent(
|
|
|
+ data.url.substring(data.url.lastIndexOf("/") + 1)
|
|
|
+ );
|
|
|
+ fileupList.value.push(data);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ file.status = "failed";
|
|
|
+ file.message = "上传失败";
|
|
|
+ });
|
|
|
+ };
|
|
|
+ // 删除文件
|
|
|
+ const deleteRead = (file) => {
|
|
|
+ //删除文件操作
|
|
|
+ for (let index = 0; index < fileList.value.length; index++) {
|
|
|
+ if (file.file.name == fileList.value[index].file.name) {
|
|
|
+ let delurl = fileupList.value[index].url;
|
|
|
+ new tools().uploadFiledelete("", delurl).then(({ data }) => { });
|
|
|
+ fileupList.value.splice(index, 1);
|
|
|
+ fileList.value.splice(index, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
// 提交数据
|
|
|
const submit = () => {
|
|
|
isLoading.value = true;
|
|
|
+ //保存前附件处理
|
|
|
+ inputForm.value.information = fileupList.value
|
|
|
+ .map((option) => option.url)
|
|
|
+ .join("|");
|
|
|
new ReligiousPeopleReportService().save(inputForm.value).then((res) => {
|
|
|
if (res.status == 200 || res.statusText == "OK") {
|
|
|
xm.showToast({
|
|
@@ -226,8 +243,11 @@ export default {
|
|
|
onClickLeft();
|
|
|
});
|
|
|
};
|
|
|
+ let showPlace = ref(false);
|
|
|
+ let religiousType = ref('');
|
|
|
return {
|
|
|
inputForm,
|
|
|
+ religiousType,
|
|
|
// 返回
|
|
|
onClickLeft,
|
|
|
// 地区选择
|
|
@@ -237,23 +257,37 @@ export default {
|
|
|
onFinish2,
|
|
|
cascaderValue,
|
|
|
isLoading,
|
|
|
+ getType,
|
|
|
+ // 文件上传
|
|
|
+ afterRead,
|
|
|
+ deleteRead,
|
|
|
+ fileList,
|
|
|
submit,
|
|
|
showCurrentArea,
|
|
|
+ showPlace
|
|
|
};
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
+.van-uploader .van-button {
|
|
|
+ border: none;
|
|
|
+ color: #36a7f3;
|
|
|
+ top: -4px;
|
|
|
+}
|
|
|
+
|
|
|
.rowTextArea::v-deep .van-field__value {
|
|
|
width: 98%;
|
|
|
border: 2px solid #ccc;
|
|
|
border-radius: 10px;
|
|
|
padding-left: 10px;
|
|
|
}
|
|
|
+
|
|
|
.rowTextArea::v-deep .van-cell {
|
|
|
display: flow-root;
|
|
|
}
|
|
|
+
|
|
|
.van-radio {
|
|
|
margin-right: 10px;
|
|
|
}
|