洋浦学校 八大中心 家委会管理前端开发

init
gongdi 3 years ago
parent c00e9ba6a2
commit 08e224eb04

@ -1209,5 +1209,74 @@ const InterfaceConfig = {
method: 'post',
isTestLogin: true,
},
/*
* 家委会成员信息列表-分页
* /dsideal_yy/ypt/intellioa/center/committee/list
* "bureau_id":"必填 int 机构id"
"stage_id":"非必填 int 学段id搜索条件"
"member_name":"非必填 string 成员姓名(搜索条件)"
"position":"非必填 string 成员职务(搜索条件)"
"page_number":"非必填 number 【当前页码】"
"page_size":"非必填 number 【每页条数】"
* */
"getCommitteeList":{
url: 'intellioa/center/committee/list',
method: 'get',
isTestLogin: true,
},
/*
* 查看家委会成员信息
* /dsideal_yy/ypt/intellioa/center/committee/view
* "member_id": "必填 number【成员id】"
* */
"getCommitteeInfo":{
url: 'intellioa/center/committee/view',
method: 'get',
isTestLogin: true,
},
/*
* 新增修改家委会成员信息
* /dsideal_yy/ypt/intellioa/center/committee/save
* "member_id""家委会成员idnumber非必填填写时为修改"
"member_name""成员姓名string必填"
"stage_id":"必填 int 学段id"
"position""职工职务string必填"
"telephone""联系电话string必填"
"id_photo_json":"必填 证件照 对象属性需要JSON.stringify转成json字符串再传"
"sort_no":"必填 int 排序号"
"person_id":"必填 int 操作人ID"
"identity_id":"必填 int 操作人身份ID"
"bureau_id":"必填 int 机构ID"
* */
"saveCommittee":{
url: 'intellioa/center/committee/save',
method: 'post',
isTestLogin: true,
},
/*
* 删除家委会成员信息
* "member_ids""家委会成员idsstring必填批量删除时以英文逗号分隔"
"bureau_id":"必填 int 机构ID"
* */
"deleteCommittee":{
url: 'intellioa/center/committee/delete',
method: 'post',
isTestLogin: true,
},
/*
* 修改家委会成员排序号
"member_id""家委会成员idnumber必填"
"sort_no":"必填 int 排序号"
"person_id":"必填 int 操作人ID"
"identity_id":"必填 int 操作人身份ID"
"bureau_id":"必填 int 机构ID"
* */
"modifyCommitteeSort":{
url: 'intellioa/center/committee/modifySort',
method: 'post',
isTestLogin: true,
},
};
export default InterfaceConfig;

@ -0,0 +1,353 @@
<template>
<div class="committee-info-content-style">
<a-spin :spinning="pageLoading">
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>排序号</div>
<div class="li-box li-right">
<a-input-number :min="0" v-model="sortNo"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>成员姓名</div>
<div class="li-box li-right">
<a-input v-model="memberName" placeholder="请输入成员姓名" :maxLength="100"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>学段</div>
<div class="li-box li-right">
<a-select :value="stageId" @change="stageChange">
<a-select-option v-for="item in stageList" :key="item.stage_id" :value="item.stage_id">
{{ item.stage_name }}
</a-select-option>
</a-select>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>职工职务</div>
<div class="li-box li-right">
<a-input v-model="position" placeholder="请输入职工职务" :maxLength="100"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>联系电话</div>
<div class="li-box li-right">
<a-input v-model="telephone" placeholder="请输入联系电话" :maxLength="100"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>证件照</div>
<div class="li-box li-right">
<Upload :type="2" :multiple="false" title="点击上传" :option="{}" :canDownload="false"
:fileData="idPhotoJson"
ref="fileUploadCertificate"
@uploadComplete="certificateFile"
/>
</div>
</div>
<div class="add-record-row-style button-row-style">
<a-button type="primary" class="button-style" @click="submit">
提交
</a-button>
<a-button class="button-style" @click="cancel"></a-button>
</div>
</a-spin>
</div>
</template>
<script>
import {Spin, Button, Cascader, Input, InputNumber, Modal, Select, DatePicker,Icon,TimePicker} from 'ant-design-vue';
import InterConfig from '../interConfig';
import locale from 'ant-design-vue/es/date-picker/locale/zh_CN';
import moment from 'moment';
import ATextarea from "ant-design-vue/es/input/TextArea";
import Upload from '../../../../../../components/common/uploader/Upload.vue';
export default{
props: {
memberId:{
type:String,
default:""
},
},
data(){
return {
pageLoading: false,
memberName:"",//
stageId:"",//id
stageList:[
{stage_id:"",stage_name:"全部"}
],//
position:"",//
telephone:"",//
locale,
idPhotoJson:[],
sortNo:"",
}
},
created(){
this.getStageList();
if (this.$props.memberId !== "") {
this.getInfo();
}
},
methods: {
getStageList: function () {
let param = {
bureau_id: this.BaseConfig.person_info_my.bureau_id,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.getSchoolStageList.url,
params: param,
method: InterConfig.getSchoolStageList.method,
isTestLogin: InterConfig.getSchoolStageList.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
this.stageList.push(...resData.data);
}
})
},
stageChange:function (value) {
this.stageId = value;
},
getInfo: function () {
let param = {
member_id: this.$props.memberId,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.getCommitteeInfo.url,
params: param,
method: InterConfig.getCommitteeInfo.method,
isTestLogin: InterConfig.getCommitteeInfo.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
let info = resData.data;
this.memberName = info.member_name;
this.stageId = info.stage_id;
this.position = info.position;
this.telephone = info.telephone;
this.sortNo = info.sort_no;
if(Object.keys(info.id_photo_json).length > 0){
this.idPhotoJson.push(info.id_photo_json);
}
if(Array.isArray(info.id_photo_json)){
this.idPhotoJson = info.id_photo_json;
}
}
})
},
certificateFile:function(file){
this.idPhotoJson = file;
},
submit: function () {
if (this.sortNo === "") {
Modal.warning({
title: "请输入排序号码",
content: "",
centered: true
})
return;
}
if (this.memberName.trim() === "") {
Modal.warning({
title: "请输入成员姓名",
content: "",
centered: true
})
return;
}
if (this.stageId === "") {
Modal.warning({
title: "请选择学段",
content: "",
centered: true
})
return;
}
if (this.position.trim() === "") {
Modal.warning({
title: "请输入职工职务",
content: "",
centered: true
})
return;
}
if (this.telephone.trim() === "") {
Modal.warning({
title: "请输入联系电话",
content: "",
centered: true
})
return;
}
if(this.idPhotoJson.length === 0){
Modal.warning({
title: "请上传证件照",
content: "",
centered: true
})
return;
}
let param = {
stage_id:this.stageId,
member_name: this.memberName,
position:this.position,
telephone:this.telephone,
id_photo_json:JSON.stringify(this.idPhotoJson),
sort_no:this.sortNo,
person_id: this.BaseConfig.userInfo.person_id,
identity_id: this.BaseConfig.userInfo.identity_id,
bureau_id: this.BaseConfig.person_info_my.bureau_id,
}
if(this.$props.memberId !== ""){
param.member_id = this.$props.memberId;
}
this.pageLoading = true;
this.InterfaceConfig.callInterface([{
url: InterConfig.saveCommittee.url,
params: param,
method: InterConfig.saveCommittee.method,
isTestLogin: InterConfig.saveCommittee.isTestLogin,
}], (result) => {
this.pageLoading = false;
let resData = result[0].data;
if (resData.code === 2000) {
Modal.success({
title: "操作成功",
content: "",
centered: true
});
this.cancel();
}
})
},
cancel: function () {
this.$emit("cancel");
}
},
components: {
ATextarea,
ASpin: Spin,
ASelect: Select,
ASelectOption: Select.Option,
AInput: Input,
AInputNumber:InputNumber,
ADatePicker: DatePicker,
ARangePicker:DatePicker.RangePicker,
Upload,
AButton: Button,
AIcon:Icon,
}
}
</script>
<style scoped lang="scss">
.committee-info-content-style {
width: 100%;
height: auto;
font-size: 1rem;
color: black;
.add-record-row-style {
width: 50%;
min-height: 3rem;
margin: 0.5rem auto;
display: flex;
.li-box {
min-height: 3rem;
line-height: 3rem;
.must-option-style {
color: red;
margin-right: 0.2rem;
}
}
.li-left {
width: 15%;
text-align: right;
}
.li-right {
width: 85%;
.person-list-content-style {
width: 700px;
height: 500px;
background-color: #ebebeb;
.list-content-style {
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
.honor-person-info {
width: auto;
height: 180px;
border: 1px solid #31a8fa;
margin: 0.5rem 0 0 0.5rem;
display: flex;
flex-direction: column;
justify-content: center;
.person-name {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
}
/deep/ .img-style {
margin-right: 0 !important;
}
}
}
}
.ant-select {
width: 100px;
}
.no-border-input-style {
border-top: 0 !important;
border-left: 0 !important;
border-right: 0 !important;
}
.photo-container-style {
display: flex;
align-items: center;
align-content: center;
justify-content: center;
justify-items: center;
width: 120px !important;
border: 1px solid #e5e5e5;
height: 160px;
background-color: white;
position: relative;
.operate-class {
position: absolute;
bottom: 0.1rem;
color: #31a8fa;
font-size: 1rem;
cursor: pointer;
display: none;
}
.photo-size-style {
display: flex;
align-items: center;
align-content: center;
justify-items: center;
justify-content: center;
}
}
.edit-style {
&:hover {
.operate-class {
display: inline-block;
}
}
}
}
}
.button-row-style {
width: 50%;
margin: auto;
display: flex;
justify-content: center;
align-items: center;
.button-style {
margin-left: 0.5rem;
}
}
}
</style>

@ -0,0 +1,274 @@
<template>
<div class="moral-committee-list-content-style">
<template v-if="pageType === 0">
<div class="search-and-add-style">
<div>
<span style="margin:0 0.5rem">学段</span>
<a-select :value="stageId" @change="stageChange">
<a-select-option v-for="item in stageList" :key="item.stage_id" :value="item.stage_id">
{{ item.stage_name }}
</a-select-option>
</a-select>
<span style="margin:0 0.5rem">成员姓名</span>
<a-input v-model="memberName"/>
<span style="margin:0 0.5rem">成员职务</span>
<a-input v-model="position"/>
<a-icon type="search" :style="{fontSize: '16px', color: '#31a8fa',marginLeft:'0.5rem'}" @click="search" />
</div>
<a-button type="primary" @click="toAdd" class="add-button-style">新增</a-button>
</div>
<a-table :columns="tableColumn" :data-source="dataList" :loading="loading" :pagination="false">
<span slot="action" slot-scope="text, record">
<a @click="toEdit(record)"></a>
<a-divider type="vertical"/>
<a @click="toDelete(record)"></a>
</span>
</a-table>
<a-pagination v-if="totalPage > 1" v-model="pageNumber" :pageSize="pageSize" :total="totalNum"
@change="onPageChange"/>
</template>
<a-modal title="提示"
:visible="visible"
centered
cancelText="取消"
okText="确定"
@ok="handleOk"
@cancel="handleCancel">
是否确定删除此条信息
</a-modal>
<template v-if="pageType === 1">
<CommitteeInfo @cancel="cancel" :memberId="memberId"/>
</template>
</div>
</template>
<script>
import InterConfig from '../interConfig';
import {Table, Button, Select, Modal, Divider, Cascader, Icon, Input,Pagination} from 'ant-design-vue';
import CommitteeInfo from './committeeInfo.vue';
const tableColumn = [
{
dataIndex: 'index',
key: 'index',
title: '序号',
width: "80px",
align: "center"
},
{
dataIndex: 'member_name',
key: 'memberName',
title: '成员姓名',
align: "center"
},
{
dataIndex: 'stage_name',
key: 'stageName',
title: '学段名称',
align: "center"
},
{
dataIndex: 'position',
key: 'position',
title: '成员职务',
align: "center"
},
{
dataIndex: 'telephone',
key: 'telephone',
title: '联系电话',
align: "center",
},
{
dataIndex: 'create_time',
key: 'createTime',
title: '创建时间',
align: "center"
},
{
title: '操作',
key: 'action',
align: "center",
scopedSlots: {customRender: 'action'},
}
]
export default{
props: ["menuId"],
data(){
return {
pageType: 0,//0 1
stageId: "",
stageList: [
{stage_id:"",stage_name:"全部"}
],
memberName:"",//
position:"",//
tableColumn: tableColumn,
dataList: [],
loading: false,
memberId: "",
visible: false,
pageNumber: 1,
pageSize: 10,
totalPage: 0,
totalNum: 0,
}
},
created(){
this.getStageList();
this.getCommitteeList();
},
mounted(){
},
methods: {
getStageList: function () {
let param = {
bureau_id: this.BaseConfig.person_info_my.bureau_id,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.getSchoolStageList.url,
params: param,
method: InterConfig.getSchoolStageList.method,
isTestLogin: InterConfig.getSchoolStageList.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
this.stageList.push(...resData.data);
}
})
},
search:function () {
this.getCommitteeList();
},
getCommitteeList: function () {
let param = {
bureau_id: this.BaseConfig.person_info_my.bureau_id,
stage_id: this.stageId,
member_name: this.memberName,
position: this.position,
page_number: this.pageNumber,
page_size: this.pageSize,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.getCommitteeList.url,
params: param,
method: InterConfig.getCommitteeList.method,
isTestLogin: InterConfig.getCommitteeList.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
let dataList = resData.data.list;
if (dataList && dataList.length > 0) {
for (let i = 0, len = dataList.length; i < len; i++) {
dataList[i]['index'] = i + 1;
}
}
this.dataList = dataList;
this.totalNum = resData.data.total_row;
this.totalPage = resData.data.total_page;
}
})
},
onPageChange: function (page) {
this.pageNumber = page;
this.getCommitteeList();
},
stageChange: function (value) {
this.stageId = value;
},
toAdd: function () {
this.memberId = "";
this.pageType = 1;
},
toEdit: function (record) {
this.pageType = 1;
this.memberId = record.member_id + "";
},
toDelete: function (record) {
this.memberId = record.member_id + "";
this.visible = true;
},
cancel: function () {
this.pageType = 0;
this.getCommitteeList();
},
//
handleOk: function () {
let param = {
member_ids: this.memberId,
bureau_id: this.BaseConfig.person_info_my.bureau_id,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.deleteCommittee.url,
params: param,
method: InterConfig.deleteCommittee.method,
isTestLogin: InterConfig.deleteCommittee.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
Modal.success({
title: "操作成功",
content: "",
centered: true
});
this.handleCancel();
this.getCommitteeList();
}
})
},
//
handleCancel: function () {
this.memberId = "";
this.visible = false;
}
},
components: {
ATable: Table,
AButton: Button,
ASelect: Select,
ASelectOption: Select.Option,
AModal: Modal,
ADivider: Divider,
AIcon: Icon,
AInput: Input,
APagination:Pagination,
CommitteeInfo
}
}
</script>
<style scoped lang="scss">
.moral-committee-list-content-style {
width: 100%;
height: auto;
padding: 0.5rem;
.search-and-add-style {
width: 100%;
height: 3.5rem;
background-color: white;
margin-bottom: 0.5rem;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 0.5rem;
.ant-select {
width: 150px;
}
.ant-input {
width: 150px;
}
.add-button-style {
float: right;
}
}
.ant-table-wrapper {
/deep/ .upload-container-style {
display: flex;
justify-content: center;
align-items: center;
}
}
.ant-pagination {
margin-top: 0.5rem;
text-align: right;
}
}
</style>
Loading…
Cancel
Save