Browse Source

投诉等页面样式修改

v4
meizf 1 year ago
parent
commit
7a594cb954
  1. 12
      src/views/enforce/historyCheck.vue
  2. 689
      src/views/enterprise/compaint/selectMssqFilter.vue
  3. 7
      src/views/enterprise/complaint.vue
  4. 79
      src/views/enterprise/complaintItem.vue
  5. 12
      src/views/enterprise/registrationList.vue

12
src/views/enforce/historyCheck.vue

@ -80,10 +80,10 @@
<div class="card_box_span">
<p>
<label class="card_box_label">执法人员</label>
<div>
<div>{{ nameCorrect(item.lawEnforcer) }}</div>
<div v-for="(item, index) in item.lawEnforcer2List">{{ nameCorrect(item) }}</div>
</div>
<span class="asblock">
<span>{{ nameCorrect(item.lawEnforcer) }}</span>
<span v-for="(item, index) in item.lawEnforcer2List">{{ nameCorrect(item) }}</span>
</span>
</p>
</div>
<div class="card_box_span">
@ -600,6 +600,10 @@
white-space: nowrap;
}
.asblock, .asblock > span {
display: block;
}
/deep/ .van-search__content {
height: 0.9rem;
border: 1px solid #ececec;

689
src/views/enterprise/compaint/selectMssqFilter.vue

@ -1,381 +1,380 @@
<template>
<div v-if="visible" class="van-overlay"></div>
<div v-if="visible" class="popup">
<div class="popup-title">部门查询</div>
<!-- 返回按钮 -->
<label class="btn-goback"><van-icon name="arrow-left" @click="next"/></label>
<!-- 关闭按钮 -->
<label class="close-button" @click="closePopup"></label>
<div v-if="visible" class="van-overlay"></div>
<div v-if="visible" class="popup">
<div class="popup-title">单位查询</div>
<!-- 返回按钮 -->
<label class="btn-goback"><van-icon name="arrow-left" @click="next"/></label>
<!-- 关闭按钮 -->
<label class="close-button" @click="closePopup"></label>
<!-- 弹窗的内容 -->
<div class="popup-content">
<div class="subsearch">
<input class="searchbox" v-model="searchParam.complaintItemName" placeholder="请输入部门名称"/>
<van-icon class="ibtn-reset" name="clear" @click="cancel()" title="重置"/>
<button class='btn-search' @click="queryList()">搜索</button>
<button class='btn-search' @click="selectData()">确定</button>
</div>
<div class="search-result">
<van-checkbox-group v-model="checked">
<van-cell-group inset>
<!-- <van-cell v-for="(item, index) in dataList" :key="item" @click="toDrill(item.deptId, item.parentId)" clickable>
<div style="display: flex; justify-content: space-between;">
<div style="width: 70%; text-align: left;">
{{item.deptName}}
</div>
<div style="width: 30%;"><van-icon name="arrow" size="0.35rem" /></div>
</div>
</van-cell> -->
<van-cell v-for="(item, index) in dataList" :key="item">
<div style="display: flex; justify-content: space-between;">
<div @click="toggle(item.complaintItemCode)">
<van-checkbox :name="item.complaintItemCode+';-;'+item.complaintItemName" :ref="el => checkboxRefs[item.complaintItemCode] = el" @click.stop>
{{item.complaintItemName}}
</van-checkbox>
</div>
<div>
<!-- <van-button
type="primary"
size="mini"
icon="add-o"
@click="toDrill(item.deptId, item.parentId)"
>展开</van-button> -->
</div>
</div>
</van-cell>
</van-cell-group>
<!-- 弹窗的内容 -->
<div class="popup-content">
<div class="subsearch">
<input class="searchbox" v-model="searchParam.complaintItemName" placeholder="请输入单位名称"/>
<van-icon class="ibtn-reset" name="clear" @click="cancel()" title="重置"/>
<button class='btn-search' @click="queryList()">搜索</button>
<button class='btn-search' @click="selectData()">确定</button>
</div>
<div class="search-result">
<van-checkbox-group v-model="checked">
<van-cell-group inset>
<!-- <van-cell v-for="(item, index) in dataList" :key="item" @click="toDrill(item.deptId, item.parentId)" clickable>
<div style="display: flex; justify-content: space-between;">
<div style="width: 70%; text-align: left;">
{{item.deptName}}
</div>
<div style="width: 30%;"><van-icon name="arrow" size="0.35rem" /></div>
</div>
</van-cell> -->
<van-cell v-for="(item, index) in dataList" :key="item">
<div style="display: flex; justify-content: space-between;">
<div @click="toggle(item.complaintItemCode)">
<van-checkbox :name="item.complaintItemCode+';-;'+item.complaintItemName" :ref="el => checkboxRefs[item.complaintItemCode] = el" @click.stop>
{{item.complaintItemName}}
</van-checkbox>
</div>
<div>
<!-- <van-button
type="primary"
size="mini"
icon="add-o"
@click="toDrill(item.deptId, item.parentId)"
>展开</van-button> -->
</div>
</div>
<!-- <van-cell-group inset>
<van-cell v-for="(item, index) in userList" :key="item" clickable>
<div style="display: flex; justify-content: space-between;">
<div style="width: 70%;" @click="toggle(item.deptId)">
<van-checkbox :name="item.userId+';-;'+item.userName+';-;'+item.deptId+';-;'+item.dept.deptName" :ref="el => checkboxRefs[item.userId] = el" @click.stop>
{{item.userName}}
</van-checkbox>
</div>
</div>
</van-cell>
</van-cell-group> -->
</van-checkbox-group>
</div>
</div>
</div>
</van-cell>
</van-cell-group>
<!-- <van-cell-group inset>
<van-cell v-for="(item, index) in userList" :key="item" clickable>
<div style="display: flex; justify-content: space-between;">
<div style="width: 70%;" @click="toggle(item.deptId)">
<van-checkbox :name="item.userId+';-;'+item.userName+';-;'+item.deptId+';-;'+item.dept.deptName" :ref="el => checkboxRefs[item.userId] = el" @click.stop>
{{item.userName}}
</van-checkbox>
</div>
</div>
</van-cell>
</van-cell-group> -->
</van-checkbox-group>
</div>
</div>
</div>
</template>
<script>
import {ref} from 'vue'
import { queryComplaintItemList } from '@/api/enterprise'
import {Icon, showSuccessToast,showToast } from 'vant';
import {ref} from 'vue'
import { queryComplaintItemList } from '@/api/enterprise'
import {Icon, showSuccessToast,showToast } from 'vant';
const {useCommon} = $globalStore
const router = useRouter();
export default {
props: {
visible: {
type: Boolean,
default: false
},
content: {
type: String,
default: ''
},
},
data() {
return {
searchParam: {
//
dataScopeId: useCommon.userId,
deptName: '',
parentId: '0',
complaintItemName:"",
},
searchKey: "",
dataList: [],
checked: ref([]),
checkboxRefs: ref([]),
nextParentId: '0',
userList: [],
}
},
created() {
this.queryList()
},
methods: {
toggle(index) {
this.checkboxRefs[index].toggle();
},
toDrill(deptId, parentId) {
this.nextParentId = parentId;
this.searchParam.parentId = deptId;
this.queryList();
},
next() {
if (null != this.nextParentId) {
this.searchParam.parentId = this.nextParentId;
this.searchParam.deptName = "";
nextDeptByparentId(this.searchParam, success => {
this.nextParentId = success.data.parentId;
this.queryList();
}, error => {
})
}
},
closePopup() {
this.$emit('close');
},
queryList() {
queryComplaintItemList(this.searchParam, success => {
if (null != success.rows && success.rows.length > 0) {
this.userList = [];
this.dataList = success.rows
this.$emit('item-list', success.rows);
} else {
showToast ("暂无数据!")
}
}, error => {
})
},
queryUserList() {
if (null == this.searchKey || "" == this.searchKey) {
showSuccessToast('人员过多, 请输入关键字!');
return;
}
queryUsersNoPermission({"userName": this.searchKey}, success => {
this.dataList = [];
this.userList = success.data;
}, error => {
});
},
cancel() {
this.searchParam.complaintItemName = '';
this.queryList()
},
selectData() {
let res = [];
let checkeds = JSON.parse(JSON.stringify(this.checked));
for (var i=0; i<checkeds.length; i++) {
var item = checkeds[i].split(";-;");
res.push({"deptId":item[0], "deptName":item[1]});
}
// this.$emit("reciveData", JSON.parse(JSON.stringify(this.checked)));
this.$emit("reciveData", res);
this.$emit('close');
},
},
}
const {useCommon} = $globalStore
const router = useRouter();
export default {
props: {
visible: {
type: Boolean,
default: false
},
content: {
type: String,
default: ''
},
},
data() {
return {
searchParam: {
//
dataScopeId: useCommon.userId,
deptName: '',
parentId: '0',
complaintItemName:"",
},
searchKey: "",
dataList: [],
checked: ref([]),
checkboxRefs: ref([]),
nextParentId: '0',
userList: [],
}
},
created() {
this.queryList()
},
methods: {
toggle(index) {
this.checkboxRefs[index].toggle();
},
toDrill(deptId, parentId) {
this.nextParentId = parentId;
this.searchParam.parentId = deptId;
this.queryList();
},
next() {
if (null != this.nextParentId) {
this.searchParam.parentId = this.nextParentId;
this.searchParam.deptName = "";
nextDeptByparentId(this.searchParam, success => {
this.nextParentId = success.data.parentId;
this.queryList();
}, error => {
})
}
},
closePopup() {
this.$emit('close');
},
queryList() {
queryComplaintItemList(this.searchParam, success => {
if (null != success.rows && success.rows.length > 0) {
this.userList = [];
this.dataList = success.rows
} else {
showToast ("暂无数据!")
}
}, error => {
})
},
queryUserList() {
if (null == this.searchKey || "" == this.searchKey) {
showSuccessToast('人员过多, 请输入关键字!');
return;
}
queryUsersNoPermission({"userName": this.searchKey}, success => {
this.dataList = [];
this.userList = success.data;
}, error => {
});
},
cancel() {
this.searchParam.complaintItemName = '';
this.queryList()
},
selectData() {
let res = [];
let checkeds = JSON.parse(JSON.stringify(this.checked));
for (var i=0; i<checkeds.length; i++) {
var item = checkeds[i].split(";-;");
res.push({"deptId":item[0], "deptName":item[1]});
}
// this.$emit("reciveData", JSON.parse(JSON.stringify(this.checked)));
this.$emit("reciveData", res);
this.$emit('close');
},
},
}
</script>
<style scoped>
.popup {
position: fixed;
z-index: 999;
top: 3rem;
left: 0;
width: 100%;
height: calc(100% - 3rem);
background: #fff;
overflow: hidden;
}
.popup {
position: fixed;
z-index: 999;
top: 3rem;
left: 0;
width: 100%;
height: calc(100% - 3rem);
background: #fff;
overflow: hidden;
}
.popup-title {
margin: 0.3rem 0 0;
width: 100%;
height: 1rem;
border-bottom: 1px solid #f3f4f5;
text-align: center;
font-size: 0.42rem;
font-weight: 600;
}
.popup-title {
margin: 0.3rem 0 0;
width: 100%;
height: 1rem;
border-bottom: 1px solid #f3f4f5;
text-align: center;
font-size: 0.42rem;
font-weight: 600;
}
.btn-goback {
position: absolute;
top: 0.267rem;
left: 0.3rem;
width: 0.8rem;
height: 0.8rem;
font-size: 0.5rem;
font-weight: bold;
color: #333;
line-height: 1.5;
}
.btn-goback {
position: absolute;
top: 0.267rem;
left: 0.3rem;
width: 0.8rem;
height: 0.8rem;
font-size: 0.5rem;
font-weight: bold;
color: #333;
line-height: 1.5;
}
.close-button {
position: absolute;
top: 0.15rem;
right: 0.1rem;
width: 0.8rem;
height: 0.8rem;
background-color: rgba(255, 255, 255, .5);
border: 0.05rem solid rgba(255, 255, 255, .7);
border-radius: 50%;
transform: rotate(45deg);
}
.close-button {
position: absolute;
top: 0.15rem;
right: 0.1rem;
width: 0.8rem;
height: 0.8rem;
background-color: rgba(255, 255, 255, .5);
border: 0.05rem solid rgba(255, 255, 255, .7);
border-radius: 50%;
transform: rotate(45deg);
}
.close-button:before,
.close-button:after {
content: '';
position: absolute;
top: 50%;
left: 50%;
background: #333;
border-radius: 50%;
transform: translate(-50%, -50%);
height: 0.4rem;
width: 0.02rem;
}
.close-button:before,
.close-button:after {
content: '';
position: absolute;
top: 50%;
left: 50%;
background: #333;
border-radius: 50%;
transform: translate(-50%, -50%);
height: 0.4rem;
width: 0.02rem;
}
.close-button:after {
height: 0.02rem;
width: 0.4rem;
}
.close-button:after {
height: 0.02rem;
width: 0.4rem;
}
.popup-content {
margin: 0.25rem 0 0;
padding-bottom: 3rem;
width: 100%;
height: calc(100% - 1.6rem);
overflow-y: auto;
font-size: 0.37rem;
}
.popup-content {
margin: 0.25rem 0 0;
padding-bottom: 3rem;
width: 100%;
height: calc(100% - 1.6rem);
overflow-y: auto;
font-size: 0.37rem;
}
.subsearch {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1% 0.43rem 3%;
width: calc(100% - 0.86rem);
height: 1.25rem;
font-size: 0.37rem;
}
.subsearch {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1% 0.43rem 3%;
width: calc(100% - 0.86rem);
height: 1.25rem;
font-size: 0.37rem;
}
.subsearch .ibtn-reset {
margin: 0 0.5rem 0 -1rem;
width: 1rem;
color: #cfcbcb;
font-size: 0.5rem;
}
.subsearch .ibtn-reset {
margin: 0 0.5rem 0 -1rem;
width: 1rem;
color: #cfcbcb;
font-size: 0.5rem;
}
.subsearch .btn-search {
margin: 0 0.8rem 0 -0.2rem;
width: 20%;
height: 1rem;
background: #eeeff1 url(/src/assets/images/icon_sou.png) no-repeat;
background-position: left 0.3rem center;
background-size: auto 50%;
border-radius: 0 0.15rem 0.15rem 0;
border: 1px solid rgba(0, 0, 0, .1);
border-left: 1px solid #eee;
line-height: 10rem;
overflow: hidden;
}
.subsearch .btn-search {
margin: 0 0.8rem 0 -0.2rem;
width: 20%;
height: 1rem;
background: #eeeff1 url(/src/assets/images/icon_sou.png) no-repeat;
background-position: left 0.3rem center;
background-size: auto 50%;
border-radius: 0 0.15rem 0.15rem 0;
border: 1px solid rgba(0, 0, 0, .1);
border-left: 1px solid #eee;
line-height: 10rem;
overflow: hidden;
}
.subsearch .btn-search:last-child {
margin-right: 0;
border-radius: 0.15rem;
background: #1367fe;
border-color: #1367fe;
color: #fff;
line-height: 1;
}
.subsearch .btn-search:last-child {
margin-right: 0;
border-radius: 0.15rem;
background: #1367fe;
border-color: #1367fe;
color: #fff;
line-height: 1;
}
.searchbox {
margin: 2% 0;
padding: 0.1rem 1.2rem 0.1rem 0.3rem;
width: 100%;
height: 1rem;
/*background: #f6f7fe url(../../assets/images/icon_sou.png) no-repeat;
background-position: left 0.25rem center;
background-size: auto 50%;*/
box-sizing: border-box;
border: 1px solid rgba(0, 0, 0, .1);
border-radius: 0.15rem 0 0 0.15rem;
color: #999999;
outline: none;
}
.searchbox {
margin: 2% 0;
padding: 0.1rem 1.2rem 0.1rem 0.3rem;
width: 100%;
height: 1rem;
/*background: #f6f7fe url(../../assets/images/icon_sou.png) no-repeat;
background-position: left 0.25rem center;
background-size: auto 50%;*/
box-sizing: border-box;
border: 1px solid rgba(0, 0, 0, .1);
border-radius: 0.15rem 0 0 0.15rem;
color: #999999;
outline: none;
}
.subtitle {
margin: 0.5rem 0 0.25rem;
font-size: 0.4rem;
font-weight: 600;
}
.subtitle {
margin: 0.5rem 0 0.25rem;
font-size: 0.38rem;
font-weight: 600;
}
.quick-item {
display: flex;
}
.quick-item {
display: flex;
}
.quick-item span {
display: inline-block;
margin: 1% 0 2% 3.5%;
padding: 2% 3.75%;
background: #f2f3f4;
border: 0;
border-radius: 8px;
color: #4c4c4c;
}
.quick-item span {
display: inline-block;
margin: 1% 0 2% 3.5%;
padding: 2% 3.75%;
background: #f2f3f4;
border: 0;
border-radius: 8px;
color: #4c4c4c;
}
.quick-item span.seled {
background: #e9f2fb;
color: #1367fe;
}
.quick-item span.seled {
background: #e9f2fb;
color: #1367fe;
}
.btnbox {
display: flex;
justify-content: center;
margin: 5% 2%;
width: 96%;
height: 1.0rem;
}
.btnbox {
display: flex;
justify-content: center;
margin: 5% 2%;
width: 96%;
height: 1.0rem;
}
.btn-reset,
.btn-search {
display: inline-block;
margin: 0 2%;
padding: 0;
width: 60%;
color: #fff;
font-size: 0.37rem;
border-radius: 1rem;
background: #1367fe;
border: 1px solid #1367fe;
text-align: center;
}
.btn-reset,
.btn-search {
display: inline-block;
margin: 0 2%;
padding: 0;
width: 60%;
color: #fff;
font-size: 0.37rem;
border-radius: 1rem;
background: #1367fe;
border: 1px solid #1367fe;
text-align: center;
}
.btn-reset {
width: 35%;
background-color: #fff;
border-color: rgba(19, 103, 254, .7);
color: #1367fe;
}
.btn-reset {
width: 35%;
background-color: #fff;
border-color: rgba(19, 103, 254, .7);
color: #1367fe;
}
.search-result {
width: 100%;
height: calc(100% - 3rem);
padding-bottom: 1rem;
overflow-y: auto;
}
.search-result {
width: 100%;
height: calc(100% - 3rem);
padding-bottom: 1rem;
overflow-y: auto;
}
.search-result .van-cell-group {
margin: 0;
}
.search-result .van-cell-group {
margin: 0;
}
.case-item {
margin: 3% 2%;
padding: 2% 0;
width: 96%;
font-size: 0.35rem;
border-bottom: 1px solid #f4f4f4;
color: #999;
line-height: 2;
}
.case-item {
margin: 3% 2%;
padding: 2% 0;
width: 96%;
font-size: 0.35rem;
border-bottom: 1px solid #f4f4f4;
color: #999;
line-height: 2;
}
.case-title {
margin: 2% 0;
font-size: 0.42rem;
color: #333;
line-height: 1.25;
}
.case-title {
margin: 2% 0;
font-size: 0.42rem;
color: #333;
line-height: 1.25;
}
</style>

7
src/views/enterprise/complaint.vue

@ -41,10 +41,7 @@
<van-field
v-model="submitData.complaintRecordItem"
label="投诉事项"
readonly
clickable
required
:rules="[{ required: true, message: '必填项' }]"
placeholder="请选择"
is-link
@click-input="showItemPopup(index)"
@ -67,7 +64,6 @@
<van-divider class="divdsty"/>
<van-field
label="投诉内容"
required
/>
<van-field class="complaint-cont"
v-model="submitData.problemDescription"
@ -77,7 +73,6 @@
maxlength="100"
show-word-limit
placeholder="请输入投诉内容"
:rules="[{ required: true, message: '请输入投诉内容' }]"
/>
<van-divider class="divdsty"/>
<div class="file-upload">
@ -651,7 +646,7 @@
.subtitle {
margin: 0.5rem 0 0.25rem;
font-size: 0.4rem;
font-size: 0.38rem;
font-weight: 600;
}

79
src/views/enterprise/complaintItem.vue

@ -13,7 +13,7 @@
@click="showStartTime"
readonly
/>
<span style="padding: 10px">-</span>
<span style="padding: 10px"></span>
<van-field v-model="searchParam.endTime" placeholder="结束日期"
@click="showEndTime"
readonly
@ -74,12 +74,12 @@
<p v-if="item.dataType==1"><label class="card_box_label">入企单位</label> <span>{{ item.bureauDeptName }}</span></p>
</div>
<div class="card_box_span">
<p v-if="item.dataType==0"><label class="card_box_label">执法人员</label></p>
<p v-if="item.dataType==1"><label class="card_box_label">入企人员</label></p>
<div>
<div>{{ item.lawEnforcer }}</div>
<div>{{ item.lawEnforcerOther}}</div>
</div>
<p><label class="card_box_label" v-if="item.dataType==0">执法人员</label>
<label class="card_box_label" v-if="item.dataType==1">入企人员</label>
<span class="asblock">
<span>{{ item.lawEnforcer }}</span>
<span>{{ item.lawEnforcerOther}}</span>
</span></p>
</div>
<div class="card_box_span">
<p v-if="item.dataType==0"><label class="card_box_label" >执法类别</label> <span>{{ item.lawEnforcementType }}</span></p>
@ -262,7 +262,8 @@
display: flex;
background-color: #fff;
margin: 0.27rem;
border-radius: 0.2rem;
border-radius: 0.27rem;
box-shadow: 0 0 0.15rem #ececec;
.swipe_cell {
width: 100%;
@ -296,12 +297,31 @@
}
}
.card_box_action {
}
.card-title p {
display: block !important;
color: #000;
font-size: 0.4rem;
font-weight: bold;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
.card_box_label {
color: #323233;
white-space: nowrap;
}
.card_box_span:first-child p {
color: #c1bfbf !important;
}
.asblock, .asblock > span {
display: block;
}
.popup {
position: fixed;
z-index: 999;
@ -373,41 +393,6 @@
font-size: 0.37rem;
}
.subtitle {
margin: 0.5rem 0 0.25rem;
font-size: 0.4rem;
font-weight: 600;
}
.quick-item {
display: flex;
}
.quick-item span {
display: inline-block;
margin: 1% 0 2% 3.5%;
padding: 2% 3.75%;
background: #f2f3f4;
border: 0;
border-radius: 8px;
color: #4c4c4c;
}
.quick-item span.seled {
background: #e9f2fb;
color: #1367fe;
}
.btnbox {
display: flex;
justify-content: center;
margin: 5% 2%;
width: 96%;
height: 1.0rem;
}
.van-search__action {
margin: 0 3% 0 0;
width: 10%;
@ -450,7 +435,7 @@
.subtitle {
margin: 2% 0 2% 3%;
font-size: 0.4rem;
font-size: 0.38rem;
font-weight: 600;
}

12
src/views/enterprise/registrationList.vue

@ -100,10 +100,10 @@
<div class="card_box_span">
<p>
<label class="card_box_label">执法人员</label>
<div>
<div>{{ nameCorrect(item.lawEnforcer) }}</div>
<div v-for="(item, index) in item.lawEnforcer2List" :key="index">{{ nameCorrect(item)}}</div>
</div>
<span class="asblock">
<span>{{ nameCorrect(item.lawEnforcer) }}</span>
<span v-for="(item, index) in item.lawEnforcer2List" :key="index">{{ nameCorrect(item)}}</span>
</span>
</p>
</div>
<div class="card_box_span">
@ -607,6 +607,10 @@
white-space: nowrap;
}
.asblock, .asblock > span {
display: block;
}
/deep/ .van-search__content {
height: 0.9rem;
border: 1px solid #ececec;

Loading…
Cancel
Save