jiangyy
3 years ago
5 changed files with 1735 additions and 2 deletions
@ -0,0 +1,421 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<div class="dialog-h-content scroll-h"> |
||||
|
<el-form |
||||
|
ref="ref_form" |
||||
|
:inline="true" |
||||
|
:model="fmData" |
||||
|
:rules="dataRule" |
||||
|
:disabled="formType === 'watch'" |
||||
|
class="form" |
||||
|
> |
||||
|
<el-form-item |
||||
|
label="服务类别 " |
||||
|
prop="serviceCategoryKey" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-select |
||||
|
v-if="formType == 'add'" |
||||
|
v-model="fmData.serviceCategoryKey" |
||||
|
placeholder="请选择" |
||||
|
clearable |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in categoryOptions" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<div v-else>{{ fmData.serviceCategory }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="项目名称" |
||||
|
prop="serviceName" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-input |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
class="item_width_1" |
||||
|
maxlength="100" |
||||
|
show-word-limit |
||||
|
placeholder="请输入项目名称" |
||||
|
v-model="fmData.serviceName" |
||||
|
> |
||||
|
</el-input> |
||||
|
<div v-else>{{ fmData.serviceName }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="服务内容" |
||||
|
prop="serviceContent" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-input |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
class="item_width_1" |
||||
|
type="textarea" |
||||
|
maxlength="1000" |
||||
|
show-word-limit |
||||
|
:rows="3" |
||||
|
placeholder="请输入服务内容，不超过1000字" |
||||
|
v-model="fmData.serviceContent" |
||||
|
></el-input> |
||||
|
<div v-else>{{ fmData.serviceContent }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="政策级别 " |
||||
|
prop="policyLevel" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-select |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
v-model="fmData.policyLevel" |
||||
|
placeholder="请选择" |
||||
|
clearable |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in levelOptions" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<div v-else>{{ fmData.policyLevelName }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="政策依据" |
||||
|
prop="policyGround" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-input |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
class="item_width_1" |
||||
|
type="textarea" |
||||
|
maxlength="1000" |
||||
|
show-word-limit |
||||
|
:rows="3" |
||||
|
placeholder="请输入政策依据，不超过1000字" |
||||
|
v-model="fmData.policyGround" |
||||
|
></el-input> |
||||
|
<div v-else>{{ fmData.policyGround }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="图片/附件" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
prop="attachmentList" |
||||
|
> |
||||
|
<el-upload |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
class="avatar-uploader" |
||||
|
:action="uploadUrl" |
||||
|
:data="{ customerId: customerId }" |
||||
|
:show-file-list="true" |
||||
|
:on-success="handleImgSuccess" |
||||
|
:on-remove="handleImgRemove" |
||||
|
:before-upload="beforeImgUpload" |
||||
|
> |
||||
|
<i class="el-icon-plus avatar-uploader-icon"></i> |
||||
|
</el-upload> |
||||
|
<div v-else> |
||||
|
<div class="attachement-list"> |
||||
|
<a |
||||
|
:href="att.url" |
||||
|
target="_blank" |
||||
|
:key="att.url" |
||||
|
v-for="att in this.fmData.attachmentList" |
||||
|
> |
||||
|
<i class="el-icon-folder-opened"></i> |
||||
|
{{ att.name }} |
||||
|
</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
|
||||
|
<div class="div_btn resi-btns"> |
||||
|
<el-button size="small" @click="handleCancle">取 消</el-button> |
||||
|
<el-button |
||||
|
v-if="formType != 'watch'" |
||||
|
type="primary" |
||||
|
size="small" |
||||
|
:disabled="btnDisable" |
||||
|
@click="handleComfirm" |
||||
|
>确 定</el-button |
||||
|
> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { mapGetters } from "vuex"; |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import formVltHelper from "dai-js/tools/formVltHelper"; |
||||
|
|
||||
|
export default { |
||||
|
props: { |
||||
|
formId: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
formType: { |
||||
|
type: String, |
||||
|
default: "info", |
||||
|
}, |
||||
|
}, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
uploadUrl: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadqrcodeV2", |
||||
|
customerId: localStorage.getItem("customerId"), |
||||
|
|
||||
|
btnDisable: false, |
||||
|
|
||||
|
fmData: { |
||||
|
serviceCategoryKey: "", |
||||
|
serviceName: "", |
||||
|
serviceContent: "", |
||||
|
policyGround: "", |
||||
|
policyLevel: "", |
||||
|
attachmentList: [], |
||||
|
}, |
||||
|
|
||||
|
levelOptions: [ |
||||
|
{ |
||||
|
value: "0", |
||||
|
label: "市级", |
||||
|
}, |
||||
|
{ |
||||
|
value: "1", |
||||
|
label: "区级", |
||||
|
}, |
||||
|
{ |
||||
|
value: "2", |
||||
|
label: "街道级", |
||||
|
}, |
||||
|
], |
||||
|
categoryOptions: [], |
||||
|
}; |
||||
|
}, |
||||
|
components: {}, |
||||
|
computed: { |
||||
|
dataRule() { |
||||
|
return { |
||||
|
serviceCategoryKey: [ |
||||
|
{ required: true, message: "服务类别不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
serviceName: [ |
||||
|
{ required: true, message: "项目名称不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
serviceContent: [ |
||||
|
{ required: true, message: "服务内容不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
policyGround: [ |
||||
|
{ required: true, message: "政策依据不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
policyLevel: [ |
||||
|
{ required: true, message: "政策级别不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
}; |
||||
|
}, |
||||
|
}, |
||||
|
watch: {}, |
||||
|
|
||||
|
async mounted() { |
||||
|
this.initForm(); |
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
async initForm() { |
||||
|
this.getCategoryOpitons(); |
||||
|
if (this.formId) { |
||||
|
this.getInfo(); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async getInfo() { |
||||
|
const url = "/heart/icServiceProject/serviceProjectDetail"; |
||||
|
|
||||
|
const params = { |
||||
|
serviceProjectId: this.formId, |
||||
|
}; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
if (code === 0) { |
||||
|
this.info = { ...this.info, ...data }; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async getCategoryOpitons() { |
||||
|
const url = "/sys/dict/data/dictlist"; |
||||
|
const params = { |
||||
|
dictType: "ic_service_type", |
||||
|
}; |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
if (code === 0) { |
||||
|
this.categoryOptions = data || []; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
beforeImgUpload(file) { |
||||
|
console.log(file); |
||||
|
const isLt1M = file.size / 1024 / 1024 < 10; |
||||
|
const srcType = file.type; |
||||
|
const format = file.name.split(".").pop(); |
||||
|
|
||||
|
if (!isLt1M) { |
||||
|
this.$message.error("上传文件大小不能超过 10MB!"); |
||||
|
return false; |
||||
|
} |
||||
|
if ( |
||||
|
srcType.indexOf("image") == -1 && |
||||
|
srcType.indexOf("video") == -1 && |
||||
|
["doc", "docx", "xls", "xlsx", "ppt", "pptx", "pdf"].indexOf(format) == |
||||
|
-1 |
||||
|
) { |
||||
|
this.$message.error("文档仅限pdf和office文件!"); |
||||
|
return false; |
||||
|
} |
||||
|
return true; |
||||
|
}, |
||||
|
|
||||
|
handleImgSuccess(res, file, fileList) { |
||||
|
console.log("handleImgSuccess", file); |
||||
|
if (res.code === 0 && res.msg === "success") { |
||||
|
let format = file.name.split(".").pop(); |
||||
|
let srcType = file.raw.type; |
||||
|
let type = "file"; |
||||
|
console.log("==============================srcType: ", srcType); |
||||
|
if (srcType.indexOf("image") != -1) { |
||||
|
type = "image"; |
||||
|
} else if (srcType.indexOf("video") != -1) { |
||||
|
type = "video"; |
||||
|
} |
||||
|
this.fmData.attachmentList.push({ |
||||
|
format, |
||||
|
name: file.name, |
||||
|
size: file.size, |
||||
|
type, |
||||
|
url: res.data.url, |
||||
|
}); |
||||
|
console.log(this.fmData.attachmentList); |
||||
|
} else { |
||||
|
this.$message.error(res.msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleImgRemove(file) { |
||||
|
console.log("handleImgRemove", file); |
||||
|
if (file.response) { |
||||
|
let index = this.fmData.attachmentList.findIndex( |
||||
|
(item) => item.url == file.response.data.url |
||||
|
); |
||||
|
this.fmData.attachmentList.splice(index, 1); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
watchImg(src) { |
||||
|
window.open(src); |
||||
|
}, |
||||
|
|
||||
|
async handleComfirm() { |
||||
|
this.btnDisable = true; |
||||
|
setTimeout(() => { |
||||
|
this.btnDisable = false; |
||||
|
}, 10000); |
||||
|
this.$refs["ref_form"].validate((valid, messageObj) => { |
||||
|
if (!valid) { |
||||
|
app.util.validateRule(messageObj); |
||||
|
this.btnDisable = false; |
||||
|
} else { |
||||
|
this.submit(); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
async submit() { |
||||
|
let url = ""; |
||||
|
let params = { ...this.fmData }; |
||||
|
if (this.formType === "add") { |
||||
|
url = "/heart/icServiceProject/serviceProjectAdd"; |
||||
|
} else { |
||||
|
url = "/heart/icServiceProject/serviceProjectEdit"; |
||||
|
|
||||
|
params.serviceProjectId = this.formId; |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message({ |
||||
|
type: "success", |
||||
|
message: "操作成功", |
||||
|
}); |
||||
|
this.$emit("afterEdit"); |
||||
|
this.btnDisable = false; |
||||
|
} else { |
||||
|
this.btnDisable = false; |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleCancle() { |
||||
|
this.$emit("close"); |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.item_width_1 { |
||||
|
width: 500px; |
||||
|
} |
||||
|
.item_width_2 { |
||||
|
width: 400px; |
||||
|
} |
||||
|
.item_width_3 { |
||||
|
margin-left: 10px; |
||||
|
width: 200px; |
||||
|
} |
||||
|
.item_width_4 { |
||||
|
width: 200px; |
||||
|
} |
||||
|
|
||||
|
.div_map { |
||||
|
margin-top: 10px; |
||||
|
} |
||||
|
|
||||
|
.div_btn { |
||||
|
// display: flex; |
||||
|
// justify-content: flex-end; |
||||
|
} |
||||
|
.el-tabs { |
||||
|
margin: 0 20px; |
||||
|
} |
||||
|
.el-upload__tip { |
||||
|
color: rgb(155, 155, 155); |
||||
|
margin: 0; |
||||
|
} |
||||
|
.form { |
||||
|
margin-top: 30px; |
||||
|
} |
||||
|
|
||||
|
.attachement-list { |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,424 @@ |
|||||
|
<template> |
||||
|
<div class="div_main"> |
||||
|
<div v-show="true"> |
||||
|
<div class="div_search"> |
||||
|
<el-form |
||||
|
:inline="true" |
||||
|
:model="searchData" |
||||
|
ref="ref_searchform" |
||||
|
:label-width="'80px'" |
||||
|
> |
||||
|
<div> |
||||
|
<el-form-item label="服务类别" prop="serviceCategory"> |
||||
|
<el-select |
||||
|
v-model="searchData.serviceCategory" |
||||
|
placeholder="请选择" |
||||
|
size="small" |
||||
|
clearable |
||||
|
class="item_width_2" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in categoryOptions" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="服务名称" prop="serviceName"> |
||||
|
<el-input |
||||
|
v-model="searchData.serviceName" |
||||
|
class="item_width_1" |
||||
|
size="small" |
||||
|
clearable |
||||
|
placeholder="请输入" |
||||
|
> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="服务内容" prop="serviceContent"> |
||||
|
<el-input |
||||
|
v-model="searchData.serviceContent" |
||||
|
class="item_width_2" |
||||
|
size="small" |
||||
|
clearable |
||||
|
placeholder="请输入" |
||||
|
> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="政策依据" prop="policyGround"> |
||||
|
<el-input |
||||
|
v-model="searchData.policyGround" |
||||
|
class="item_width_2" |
||||
|
size="small" |
||||
|
clearable |
||||
|
placeholder="请输入" |
||||
|
> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-button |
||||
|
style="margin-left: 30px" |
||||
|
size="small" |
||||
|
class="diy-button--search" |
||||
|
@click="handleSearch" |
||||
|
>查询</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
style="margin-left: 10px" |
||||
|
size="small" |
||||
|
class="diy-button--reset" |
||||
|
@click="resetSearch" |
||||
|
>重置</el-button |
||||
|
> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
|
||||
|
<div class="div_table"> |
||||
|
<div class="div_btn"> |
||||
|
<el-button class="diy-button--add" size="small" @click="handleAdd" |
||||
|
>新增</el-button |
||||
|
> |
||||
|
|
||||
|
<!-- <el-button |
||||
|
@click="handleExport" |
||||
|
class="diy-button--reset" |
||||
|
size="small" |
||||
|
>导出</el-button |
||||
|
> --> |
||||
|
</div> |
||||
|
|
||||
|
<el-table |
||||
|
:data="tableData" |
||||
|
border |
||||
|
:header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }" |
||||
|
class="table" |
||||
|
style="width: 100%" |
||||
|
:height="maxTableHeight" |
||||
|
> |
||||
|
<el-table-column |
||||
|
label="序号" |
||||
|
fixed="left" |
||||
|
type="index" |
||||
|
align="center" |
||||
|
width="50" |
||||
|
/> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="serviceCategory" |
||||
|
align="center" |
||||
|
label="服务类别" |
||||
|
:show-overflow-tooltip="true" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="serviceName" |
||||
|
label="服务名称" |
||||
|
align="center" |
||||
|
:show-overflow-tooltip="true" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="serviceContent" |
||||
|
align="center" |
||||
|
label="服务内容" |
||||
|
:show-overflow-tooltip="true" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="policyGround" |
||||
|
align="center" |
||||
|
:show-overflow-tooltip="true" |
||||
|
label="政策依据" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="policyLevel" |
||||
|
align="center" |
||||
|
label="政策级别" |
||||
|
:show-overflow-tooltip="true" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
fixed="right" |
||||
|
label="操作" |
||||
|
align="center" |
||||
|
width="100" |
||||
|
> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button |
||||
|
@click="handleWatch(scope.row)" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
class=".div-table-button--detail" |
||||
|
>查看</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
@click="handleDispose(scope.row)" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
class="div-table-button--edit" |
||||
|
>编辑</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
@click="handleDelete(scope.row)" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
class="div-table-button--delete" |
||||
|
>删除</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
|
||||
|
<div> |
||||
|
<el-pagination |
||||
|
@size-change="handleSizeChange" |
||||
|
@current-change="handleCurrentChange" |
||||
|
:current-page.sync="pageNo" |
||||
|
:page-sizes="[20, 50, 100, 200]" |
||||
|
:page-size="parseInt(pageSize)" |
||||
|
layout="sizes, prev, pager, next, total" |
||||
|
:total="total" |
||||
|
> |
||||
|
</el-pagination> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 修改弹出框 --> |
||||
|
<el-dialog |
||||
|
:visible.sync="formShow" |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false" |
||||
|
:title="formTitle" |
||||
|
width="850px" |
||||
|
top="5vh" |
||||
|
class="dialog-h" |
||||
|
@closed="handleClose" |
||||
|
> |
||||
|
<edit-form |
||||
|
ref="eleEditForm" |
||||
|
:formId="formId" |
||||
|
:formType="formType" |
||||
|
@close="handleClose" |
||||
|
@afterEdit="handleEditSuccess" |
||||
|
></edit-form> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import nextTick from "dai-js/tools/nextTick"; |
||||
|
import { mapGetters } from "vuex"; |
||||
|
import axios from "axios"; |
||||
|
import editForm from "./cpts/edit"; |
||||
|
|
||||
|
function iniSearchData() { |
||||
|
return { |
||||
|
serviceCategory: "", |
||||
|
serviceName: "", |
||||
|
serviceContent: "", |
||||
|
policyGround: "", |
||||
|
}; |
||||
|
} |
||||
|
|
||||
|
export default { |
||||
|
components: { editForm }, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
tableData: [], |
||||
|
|
||||
|
searchData: iniSearchData(), |
||||
|
categoryOptions: [], |
||||
|
|
||||
|
pageNo: 1, |
||||
|
pageSize: window.localStorage.getItem("pageSize") || 20, |
||||
|
total: 1, |
||||
|
|
||||
|
formId: "", |
||||
|
formShow: false, |
||||
|
formTitle: "服务项目", |
||||
|
formType: "", // 列表list 新增add 修改edit 详情info |
||||
|
}; |
||||
|
}, |
||||
|
computed: { |
||||
|
maxTableHeight() { |
||||
|
return this.$store.state.inIframe |
||||
|
? this.clientHeight - 410 + this.iframeHeigh |
||||
|
: this.clientHeight - 410; |
||||
|
}, |
||||
|
...mapGetters(["clientHeight", "iframeHeight"]), |
||||
|
}, |
||||
|
watch: { |
||||
|
"searchData.endTime": function (val) { |
||||
|
if (val && val != "") { |
||||
|
let arrayTemp = val.split(" "); |
||||
|
this.searchData.endTime = arrayTemp[0] + " 23:59:59"; |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
mounted() { |
||||
|
console.log(this.$store.state); |
||||
|
this.user = this.$store.state.user; |
||||
|
|
||||
|
this.agencyId = this.user.agencyId; |
||||
|
|
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
methods: { |
||||
|
handleSearch(val) { |
||||
|
console.log(this.searchData); |
||||
|
this.pageNo = 1; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
async handleExport() { |
||||
|
const url = "/gov/project/icEvent/export"; |
||||
|
const { pageSize, pageNo, searchData } = this; |
||||
|
axios({ |
||||
|
url: window.SITE_CONFIG["apiURL"] + url, |
||||
|
method: "post", |
||||
|
data: { |
||||
|
pageSize, |
||||
|
pageNo, |
||||
|
...searchData, |
||||
|
}, |
||||
|
responseType: "blob", |
||||
|
}) |
||||
|
.then((res) => { |
||||
|
let fileName = window.decodeURI( |
||||
|
res.headers["content-disposition"].split(";")[1].split("=")[1] |
||||
|
); |
||||
|
console.log("filename", fileName); |
||||
|
let blob = new Blob([res.data], { type: "application/vnd.ms-excel" }); |
||||
|
var url = window.URL.createObjectURL(blob); |
||||
|
var aLink = document.createElement("a"); |
||||
|
aLink.style.display = "none"; |
||||
|
aLink.href = url; |
||||
|
aLink.setAttribute("download", fileName); |
||||
|
document.body.appendChild(aLink); |
||||
|
aLink.click(); |
||||
|
document.body.removeChild(aLink); //下载完成移除元素 |
||||
|
window.URL.revokeObjectURL(url); //释放掉blob对象 |
||||
|
}) |
||||
|
.catch((err) => { |
||||
|
console.log("获取导出情失败", err); |
||||
|
return this.$message.error("网络错误"); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
handleAdd() { |
||||
|
this.formType = "add"; |
||||
|
this.formTitle = "新增"; |
||||
|
this.formShow = true; |
||||
|
}, |
||||
|
|
||||
|
handleWatch(row) { |
||||
|
this.formType = "watch"; |
||||
|
this.formId = row.serviceProjectId; |
||||
|
this.formTitle = "查看"; |
||||
|
this.formShow = true; |
||||
|
}, |
||||
|
|
||||
|
handleEdit(row) { |
||||
|
this.formType = "edit"; |
||||
|
this.formId = row.serviceProjectId; |
||||
|
this.formTitle = "查看"; |
||||
|
this.formShow = true; |
||||
|
}, |
||||
|
|
||||
|
handleClose() { |
||||
|
this.formShow = false; |
||||
|
}, |
||||
|
|
||||
|
handleEditSuccess() { |
||||
|
this.handleClose(); |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
async handleDel(rowData, rowIndex) { |
||||
|
console.log(rowData, rowIndex); |
||||
|
const url = "/heart/icServiceProject/serviceProjectEnabled"; |
||||
|
const { tableData } = this; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, [ |
||||
|
tableData[rowIndex].serviceProjectId, |
||||
|
]); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message.success("删除成功！"); |
||||
|
this.getTableData(); |
||||
|
} else { |
||||
|
this.$message.error("操作失败！"); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async getCategoryOpitons() { |
||||
|
const url = "/sys/dict/data/dictlist"; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, { |
||||
|
dictType: "ic_service_type", |
||||
|
}); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.categoryOptions = data || []; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async getTableData() { |
||||
|
const url = "/heart/icServiceProject/serviceProjectList"; |
||||
|
|
||||
|
const { pageSize, pageNo, searchData } = this; |
||||
|
const { data, code, msg } = await requestPost(url, { |
||||
|
pageSize, |
||||
|
pageNo, |
||||
|
...searchData, |
||||
|
}); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.total = data.total || 0; |
||||
|
this.tableData = data.list |
||||
|
? data.list.map((item) => { |
||||
|
return item; |
||||
|
}) |
||||
|
: []; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleSizeChange(val) { |
||||
|
this.pageSize = val; |
||||
|
window.localStorage.setItem("pageSize", val); |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
handleCurrentChange(val) { |
||||
|
this.pageNo = val; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
resetSearch() { |
||||
|
this.searchData = iniSearchData(); |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
@import "@/assets/scss/buttonstyle.scss"; |
||||
|
@import "@/assets/scss/modules/management/list-main.scss"; |
||||
|
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
||||
|
</style> |
||||
@ -0,0 +1,464 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<div class="dialog-h-content scroll-h"> |
||||
|
<el-form |
||||
|
ref="ref_form" |
||||
|
:inline="true" |
||||
|
:model="fmData" |
||||
|
:rules="dataRule" |
||||
|
:disabled="formType === 'watch'" |
||||
|
class="form" |
||||
|
> |
||||
|
<el-form-item |
||||
|
label="服务类别 " |
||||
|
prop="serviceTypeArr" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-select |
||||
|
v-if="formType == 'add'" |
||||
|
v-model="fmData.serviceTypeArr" |
||||
|
placeholder="请选择" |
||||
|
clearable |
||||
|
multiple |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in categoryOptions" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<div v-else>{{ fmData.serviceTypeName }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="服务组织名称" |
||||
|
prop="orgName" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-input |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
class="item_width_1" |
||||
|
maxlength="100" |
||||
|
show-word-limit |
||||
|
placeholder="请输入项目名称" |
||||
|
v-model="fmData.orgName" |
||||
|
> |
||||
|
</el-input> |
||||
|
<div v-else>{{ fmData.orgName }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="组织描述" |
||||
|
prop="orgDescribe" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-input |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
class="item_width_1" |
||||
|
type="textarea" |
||||
|
maxlength="1000" |
||||
|
show-word-limit |
||||
|
:rows="3" |
||||
|
placeholder="请输入服务内容，不超过1000字" |
||||
|
v-model="fmData.orgDescribe" |
||||
|
></el-input> |
||||
|
<div v-else>{{ fmData.orgDescribe }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="负责人姓名" |
||||
|
prop="principalName" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-input |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
class="item_width_1" |
||||
|
maxlength="100" |
||||
|
show-word-limit |
||||
|
placeholder="请输入负责人姓名" |
||||
|
v-model="fmData.principalName" |
||||
|
></el-input> |
||||
|
<div v-else>{{ fmData.principalName }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="联系方式" |
||||
|
prop="principalMobile" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-input |
||||
|
v-if="formType == 'add' || formType == 'edit'" |
||||
|
class="item_width_1" |
||||
|
maxlength="100" |
||||
|
show-word-limit |
||||
|
placeholder="请输入联系方式" |
||||
|
v-model="fmData.principalMobile" |
||||
|
></el-input> |
||||
|
<div v-else>{{ fmData.principalMobile }}</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="位置坐标" |
||||
|
prop="longitude" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<div style="width: 500px"> |
||||
|
<el-input |
||||
|
class="item_width_4" |
||||
|
maxlength="50" |
||||
|
placeholder="请输入关键字" |
||||
|
v-model="fmData.address" |
||||
|
> |
||||
|
</el-input> |
||||
|
<el-button |
||||
|
style="margin-left: 10px" |
||||
|
type="primary" |
||||
|
size="small" |
||||
|
@click="handleSearchMap" |
||||
|
>查询</el-button |
||||
|
> |
||||
|
<div id="app" class="div_map"></div> |
||||
|
<div style="margin-top: 10px"> |
||||
|
<span>经度</span> |
||||
|
<el-input |
||||
|
class="item_width_3" |
||||
|
maxlength="50" |
||||
|
placeholder="请输入经度" |
||||
|
v-model="fmData.longitude" |
||||
|
> |
||||
|
</el-input> |
||||
|
<span style="margin-left: 20px">纬度</span> |
||||
|
<el-input |
||||
|
class="item_width_3" |
||||
|
maxlength="50" |
||||
|
placeholder="请输入纬度" |
||||
|
v-model="fmData.latitude" |
||||
|
> |
||||
|
</el-input> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item |
||||
|
label="备注" |
||||
|
prop="remark" |
||||
|
label-width="150px" |
||||
|
style="display: block" |
||||
|
> |
||||
|
<el-input |
||||
|
class="item_width_1" |
||||
|
type="textarea" |
||||
|
maxlength="500" |
||||
|
show-word-limit |
||||
|
:rows="3" |
||||
|
placeholder="请输入备注，不超过500字" |
||||
|
v-model="fmData.remark" |
||||
|
></el-input> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
|
||||
|
<div class="div_btn resi-btns"> |
||||
|
<el-button size="small" @click="handleCancle">取 消</el-button> |
||||
|
<el-button |
||||
|
v-if="formType != 'watch'" |
||||
|
type="primary" |
||||
|
size="small" |
||||
|
:disabled="btnDisable" |
||||
|
@click="handleComfirm" |
||||
|
>确 定</el-button |
||||
|
> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { mapGetters } from "vuex"; |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import formVltHelper from "dai-js/tools/formVltHelper"; |
||||
|
|
||||
|
var map; |
||||
|
var search; |
||||
|
var markers; |
||||
|
var infoWindowList; |
||||
|
|
||||
|
export default { |
||||
|
props: { |
||||
|
formId: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
formType: { |
||||
|
type: String, |
||||
|
default: "info", |
||||
|
}, |
||||
|
}, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
uploadUrl: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadqrcodeV2", |
||||
|
customerId: localStorage.getItem("customerId"), |
||||
|
|
||||
|
btnDisable: false, |
||||
|
|
||||
|
fmData: { |
||||
|
serviceTypeArr: [], |
||||
|
serviceType: "", |
||||
|
orgName: "", |
||||
|
orgDescribe: "", |
||||
|
principalName: "", |
||||
|
principalMobile: "", |
||||
|
longitude: "", |
||||
|
latitude: "", |
||||
|
address: "", |
||||
|
remark: "", |
||||
|
}, |
||||
|
|
||||
|
categoryOptions: [], |
||||
|
}; |
||||
|
}, |
||||
|
components: {}, |
||||
|
computed: { |
||||
|
dataRule() { |
||||
|
return { |
||||
|
serviceTypeArr: [ |
||||
|
{ required: true, message: "服务类别不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
orgName: [ |
||||
|
{ required: true, message: "服务组织名称不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
principalName: [ |
||||
|
{ required: true, message: "负责人姓名不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
principalMobile: [ |
||||
|
{ required: true, message: "联系方式不能为空", trigger: "blur" }, |
||||
|
], |
||||
|
}; |
||||
|
}, |
||||
|
}, |
||||
|
watch: {}, |
||||
|
|
||||
|
async mounted() { |
||||
|
this.initForm(); |
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
async initForm() { |
||||
|
this.initMap(); |
||||
|
this.getCategoryOpitons(); |
||||
|
if (this.formId) { |
||||
|
this.getInfo(); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 地图初始化函数，本例取名为init，开发者可根据实际情况定义 |
||||
|
initMap() { |
||||
|
// 定义地图中心点坐标 |
||||
|
var center = new window.TMap.LatLng(36.0722275, 120.38945519); |
||||
|
// 定义map变量，调用 TMap.Map() 构造函数创建地图 |
||||
|
map = new window.TMap.Map(document.getElementById("app"), { |
||||
|
center: center, // 设置地图中心点坐标 |
||||
|
zoom: 17.2, // 设置地图缩放级别 |
||||
|
pitch: 43.5, // 设置俯仰角 |
||||
|
rotation: 45, // 设置地图旋转角度 |
||||
|
}); |
||||
|
|
||||
|
search = new window.TMap.service.Search({ pageSize: 10 }); |
||||
|
// 新建一个地点搜索类 |
||||
|
markers = new TMap.MultiMarker({ |
||||
|
map: map, |
||||
|
geometries: [], |
||||
|
}); |
||||
|
infoWindowList = Array(10); |
||||
|
|
||||
|
// 监听地图平移结束 |
||||
|
map.on("panend", () => { |
||||
|
this.handleMoveCenter(); |
||||
|
}); |
||||
|
this.handleMoveCenter(); |
||||
|
}, |
||||
|
|
||||
|
setMarker(lat, lng) { |
||||
|
markers.setGeometries([]); |
||||
|
markers.add([ |
||||
|
{ |
||||
|
id: "4", |
||||
|
styleId: "marker", |
||||
|
position: new TMap.LatLng(lat, lng), |
||||
|
properties: { |
||||
|
title: "marker4", |
||||
|
}, |
||||
|
}, |
||||
|
]); |
||||
|
}, |
||||
|
|
||||
|
handleSearchMap() { |
||||
|
infoWindowList.forEach((infoWindow) => { |
||||
|
infoWindow.close(); |
||||
|
}); |
||||
|
infoWindowList.length = 0; |
||||
|
markers.setGeometries([]); |
||||
|
// 在地图显示范围内以给定的关键字搜索地点 |
||||
|
search |
||||
|
.searchRectangle({ |
||||
|
keyword: this.fmData.address, |
||||
|
bounds: map.getBounds(), |
||||
|
}) |
||||
|
.then((result) => { |
||||
|
let { data } = result; |
||||
|
if (Array.isArray(data) && data.length > 0) { |
||||
|
const { |
||||
|
location: { lat, lng }, |
||||
|
} = data[0]; |
||||
|
map.setCenter(new TMap.LatLng(lat, lng)); |
||||
|
this.setMarker(lat, lng); |
||||
|
this.fmData.latitude = lat; |
||||
|
this.fmData.longitude = lng; |
||||
|
} else { |
||||
|
this.$message.error("未检索到相关位置坐标"); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
handleMoveCenter() { |
||||
|
//修改地图中心点 |
||||
|
const center = map.getCenter(); |
||||
|
const lat = center.getLat(); |
||||
|
const lng = center.getLng(); |
||||
|
this.fmData.latitude = lat; |
||||
|
this.fmData.longitude = lng; |
||||
|
this.setMarker(lat, lng); |
||||
|
}, |
||||
|
|
||||
|
async getInfo() { |
||||
|
const url = "/heart/icServiceOrg/detail"; |
||||
|
|
||||
|
const params = { |
||||
|
icServiceOrgId: this.formId, |
||||
|
}; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
if (code === 0) { |
||||
|
this.info = { |
||||
|
...this.info, |
||||
|
...data, |
||||
|
serviceTypeArr: data.serviceType.split(","), |
||||
|
}; |
||||
|
map.setCenter(new TMap.LatLng(data.latitude, data.longitude)); |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async getCategoryOpitons() { |
||||
|
const url = "/sys/dict/data/dictlist"; |
||||
|
const params = { |
||||
|
dictType: "ic_service_type", |
||||
|
}; |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
if (code === 0) { |
||||
|
this.categoryOptions = data || []; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
watchImg(src) { |
||||
|
window.open(src); |
||||
|
}, |
||||
|
|
||||
|
async handleComfirm() { |
||||
|
this.btnDisable = true; |
||||
|
setTimeout(() => { |
||||
|
this.btnDisable = false; |
||||
|
}, 10000); |
||||
|
this.$refs["ref_form"].validate((valid, messageObj) => { |
||||
|
if (!valid) { |
||||
|
app.util.validateRule(messageObj); |
||||
|
this.btnDisable = false; |
||||
|
} else { |
||||
|
this.submit(); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
async submit() { |
||||
|
let url = ""; |
||||
|
let params = { |
||||
|
...this.fmData, |
||||
|
serviceType: this.fmData.serviceTypeArr.join(","), |
||||
|
}; |
||||
|
if (this.formType === "add") { |
||||
|
url = "/heart/icServiceOrg/add"; |
||||
|
} else { |
||||
|
url = "/heart/icServiceOrg/edit"; |
||||
|
|
||||
|
params.icServiceOrgId = this.formId; |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message({ |
||||
|
type: "success", |
||||
|
message: "操作成功", |
||||
|
}); |
||||
|
this.$emit("afterEdit"); |
||||
|
this.btnDisable = false; |
||||
|
} else { |
||||
|
this.btnDisable = false; |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleCancle() { |
||||
|
this.$emit("close"); |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.item_width_1 { |
||||
|
width: 500px; |
||||
|
} |
||||
|
.item_width_2 { |
||||
|
width: 400px; |
||||
|
} |
||||
|
.item_width_3 { |
||||
|
margin-left: 10px; |
||||
|
width: 200px; |
||||
|
} |
||||
|
.item_width_4 { |
||||
|
width: 200px; |
||||
|
} |
||||
|
|
||||
|
.div_map { |
||||
|
margin-top: 10px; |
||||
|
} |
||||
|
|
||||
|
.div_btn { |
||||
|
// display: flex; |
||||
|
// justify-content: flex-end; |
||||
|
} |
||||
|
.el-tabs { |
||||
|
margin: 0 20px; |
||||
|
} |
||||
|
.el-upload__tip { |
||||
|
color: rgb(155, 155, 155); |
||||
|
margin: 0; |
||||
|
} |
||||
|
.form { |
||||
|
margin-top: 30px; |
||||
|
} |
||||
|
|
||||
|
.attachement-list { |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,424 @@ |
|||||
|
<template> |
||||
|
<div class="div_main"> |
||||
|
<div v-show="true"> |
||||
|
<div class="div_search"> |
||||
|
<el-form |
||||
|
:inline="true" |
||||
|
:model="searchData" |
||||
|
ref="ref_searchform" |
||||
|
:label-width="'80px'" |
||||
|
> |
||||
|
<div> |
||||
|
<el-form-item label="服务类别" prop="serviceType"> |
||||
|
<el-select |
||||
|
v-model="searchData.serviceType" |
||||
|
placeholder="请选择" |
||||
|
size="small" |
||||
|
clearable |
||||
|
class="item_width_2" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in categoryOptions" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="服务组织" prop="orgName"> |
||||
|
<el-input |
||||
|
v-model="searchData.orgName" |
||||
|
class="item_width_1" |
||||
|
size="small" |
||||
|
clearable |
||||
|
placeholder="请输入" |
||||
|
> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="服务地址" prop="address"> |
||||
|
<el-input |
||||
|
v-model="searchData.address" |
||||
|
class="item_width_2" |
||||
|
size="small" |
||||
|
clearable |
||||
|
placeholder="请输入" |
||||
|
> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="备注" prop="remark"> |
||||
|
<el-input |
||||
|
v-model="searchData.remark" |
||||
|
class="item_width_2" |
||||
|
size="small" |
||||
|
clearable |
||||
|
placeholder="请输入" |
||||
|
> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-button |
||||
|
style="margin-left: 30px" |
||||
|
size="small" |
||||
|
class="diy-button--search" |
||||
|
@click="handleSearch" |
||||
|
>查询</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
style="margin-left: 10px" |
||||
|
size="small" |
||||
|
class="diy-button--reset" |
||||
|
@click="resetSearch" |
||||
|
>重置</el-button |
||||
|
> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
|
||||
|
<div class="div_table"> |
||||
|
<div class="div_btn"> |
||||
|
<el-button class="diy-button--add" size="small" @click="handleAdd" |
||||
|
>新增</el-button |
||||
|
> |
||||
|
|
||||
|
<!-- <el-button |
||||
|
@click="handleExport" |
||||
|
class="diy-button--reset" |
||||
|
size="small" |
||||
|
>导出</el-button |
||||
|
> --> |
||||
|
</div> |
||||
|
|
||||
|
<el-table |
||||
|
:data="tableData" |
||||
|
border |
||||
|
:header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }" |
||||
|
class="table" |
||||
|
style="width: 100%" |
||||
|
:height="maxTableHeight" |
||||
|
> |
||||
|
<el-table-column |
||||
|
label="序号" |
||||
|
fixed="left" |
||||
|
type="index" |
||||
|
align="center" |
||||
|
width="50" |
||||
|
/> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="serviceTypeName" |
||||
|
align="center" |
||||
|
label="服务类别" |
||||
|
:show-overflow-tooltip="true" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="orgName" |
||||
|
label="服务组织名称" |
||||
|
align="center" |
||||
|
:show-overflow-tooltip="true" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="address" |
||||
|
align="center" |
||||
|
label="地址" |
||||
|
:show-overflow-tooltip="true" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="principalName" |
||||
|
align="center" |
||||
|
:show-overflow-tooltip="true" |
||||
|
label="负责人" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
prop="principalMobile" |
||||
|
align="center" |
||||
|
label="联系方式" |
||||
|
:show-overflow-tooltip="true" |
||||
|
> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column |
||||
|
fixed="right" |
||||
|
label="操作" |
||||
|
align="center" |
||||
|
width="100" |
||||
|
> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button |
||||
|
@click="handleWatch(scope.row)" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
class=".div-table-button--detail" |
||||
|
>查看</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
@click="handleDispose(scope.row)" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
class="div-table-button--edit" |
||||
|
>编辑</el-button |
||||
|
> |
||||
|
<el-button |
||||
|
@click="handleDelete(scope.row)" |
||||
|
type="text" |
||||
|
size="small" |
||||
|
class="div-table-button--delete" |
||||
|
>删除</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
|
||||
|
<div> |
||||
|
<el-pagination |
||||
|
@size-change="handleSizeChange" |
||||
|
@current-change="handleCurrentChange" |
||||
|
:current-page.sync="pageNo" |
||||
|
:page-sizes="[20, 50, 100, 200]" |
||||
|
:page-size="parseInt(pageSize)" |
||||
|
layout="sizes, prev, pager, next, total" |
||||
|
:total="total" |
||||
|
> |
||||
|
</el-pagination> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 修改弹出框 --> |
||||
|
<el-dialog |
||||
|
:visible.sync="formShow" |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false" |
||||
|
:title="formTitle" |
||||
|
width="850px" |
||||
|
top="5vh" |
||||
|
class="dialog-h" |
||||
|
@closed="handleClose" |
||||
|
> |
||||
|
<edit-form |
||||
|
ref="eleEditForm" |
||||
|
:formId="formId" |
||||
|
:formType="formType" |
||||
|
@close="handleClose" |
||||
|
@afterEdit="handleEditSuccess" |
||||
|
></edit-form> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
import nextTick from "dai-js/tools/nextTick"; |
||||
|
import { mapGetters } from "vuex"; |
||||
|
import axios from "axios"; |
||||
|
import editForm from "./cpts/edit"; |
||||
|
|
||||
|
function iniSearchData() { |
||||
|
return { |
||||
|
serviceType: "", |
||||
|
orgName: "", |
||||
|
address: "", |
||||
|
remark: "", |
||||
|
}; |
||||
|
} |
||||
|
|
||||
|
export default { |
||||
|
components: { editForm }, |
||||
|
|
||||
|
data() { |
||||
|
return { |
||||
|
tableData: [], |
||||
|
|
||||
|
searchData: iniSearchData(), |
||||
|
categoryOptions: [], |
||||
|
|
||||
|
pageNo: 1, |
||||
|
pageSize: window.localStorage.getItem("pageSize") || 20, |
||||
|
total: 1, |
||||
|
|
||||
|
formId: "", |
||||
|
formShow: false, |
||||
|
formTitle: "服务项目", |
||||
|
formType: "", // 列表list 新增add 修改edit 详情info |
||||
|
}; |
||||
|
}, |
||||
|
computed: { |
||||
|
maxTableHeight() { |
||||
|
return this.$store.state.inIframe |
||||
|
? this.clientHeight - 410 + this.iframeHeigh |
||||
|
: this.clientHeight - 410; |
||||
|
}, |
||||
|
...mapGetters(["clientHeight", "iframeHeight"]), |
||||
|
}, |
||||
|
watch: { |
||||
|
"searchData.endTime": function (val) { |
||||
|
if (val && val != "") { |
||||
|
let arrayTemp = val.split(" "); |
||||
|
this.searchData.endTime = arrayTemp[0] + " 23:59:59"; |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
mounted() { |
||||
|
console.log(this.$store.state); |
||||
|
this.user = this.$store.state.user; |
||||
|
|
||||
|
this.agencyId = this.user.agencyId; |
||||
|
|
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
methods: { |
||||
|
handleSearch(val) { |
||||
|
console.log(this.searchData); |
||||
|
this.pageNo = 1; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
async handleExport() { |
||||
|
const url = "/gov/project/icEvent/export"; |
||||
|
const { pageSize, pageNo, searchData } = this; |
||||
|
axios({ |
||||
|
url: window.SITE_CONFIG["apiURL"] + url, |
||||
|
method: "post", |
||||
|
data: { |
||||
|
pageSize, |
||||
|
pageNo, |
||||
|
...searchData, |
||||
|
}, |
||||
|
responseType: "blob", |
||||
|
}) |
||||
|
.then((res) => { |
||||
|
let fileName = window.decodeURI( |
||||
|
res.headers["content-disposition"].split(";")[1].split("=")[1] |
||||
|
); |
||||
|
console.log("filename", fileName); |
||||
|
let blob = new Blob([res.data], { type: "application/vnd.ms-excel" }); |
||||
|
var url = window.URL.createObjectURL(blob); |
||||
|
var aLink = document.createElement("a"); |
||||
|
aLink.style.display = "none"; |
||||
|
aLink.href = url; |
||||
|
aLink.setAttribute("download", fileName); |
||||
|
document.body.appendChild(aLink); |
||||
|
aLink.click(); |
||||
|
document.body.removeChild(aLink); //下载完成移除元素 |
||||
|
window.URL.revokeObjectURL(url); //释放掉blob对象 |
||||
|
}) |
||||
|
.catch((err) => { |
||||
|
console.log("获取导出情失败", err); |
||||
|
return this.$message.error("网络错误"); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
handleAdd() { |
||||
|
this.formType = "add"; |
||||
|
this.formTitle = "新增"; |
||||
|
this.formShow = true; |
||||
|
}, |
||||
|
|
||||
|
handleWatch(row) { |
||||
|
this.formType = "watch"; |
||||
|
this.formId = row.icServiceOrgId; |
||||
|
this.formTitle = "查看"; |
||||
|
this.formShow = true; |
||||
|
}, |
||||
|
|
||||
|
handleEdit(row) { |
||||
|
this.formType = "edit"; |
||||
|
this.formId = row.icServiceOrgId; |
||||
|
this.formTitle = "查看"; |
||||
|
this.formShow = true; |
||||
|
}, |
||||
|
|
||||
|
handleClose() { |
||||
|
this.formShow = false; |
||||
|
}, |
||||
|
|
||||
|
handleEditSuccess() { |
||||
|
this.handleClose(); |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
async handleDel(rowData, rowIndex) { |
||||
|
console.log(rowData, rowIndex); |
||||
|
const url = "/heart/icServiceOrg/del"; |
||||
|
const { tableData } = this; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, [ |
||||
|
tableData[rowIndex].serviceProjectId, |
||||
|
]); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message.success("删除成功！"); |
||||
|
this.getTableData(); |
||||
|
} else { |
||||
|
this.$message.error("操作失败！"); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async getCategoryOpitons() { |
||||
|
const url = "/sys/dict/data/dictlist"; |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, { |
||||
|
dictType: "ic_service_type", |
||||
|
}); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.categoryOptions = data || []; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async getTableData() { |
||||
|
const url = "/heart/icServiceOrg/list"; |
||||
|
|
||||
|
const { pageSize, pageNo, searchData } = this; |
||||
|
const { data, code, msg } = await requestPost(url, { |
||||
|
pageSize, |
||||
|
pageNo, |
||||
|
...searchData, |
||||
|
}); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.total = data.total || 0; |
||||
|
this.tableData = data.list |
||||
|
? data.list.map((item) => { |
||||
|
return item; |
||||
|
}) |
||||
|
: []; |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleSizeChange(val) { |
||||
|
this.pageSize = val; |
||||
|
window.localStorage.setItem("pageSize", val); |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
handleCurrentChange(val) { |
||||
|
this.pageNo = val; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
resetSearch() { |
||||
|
this.searchData = iniSearchData(); |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
@import "@/assets/scss/buttonstyle.scss"; |
||||
|
@import "@/assets/scss/modules/management/list-main.scss"; |
||||
|
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
||||
|
</style> |
||||
Loading…
Reference in new issue