1343 lines
36 KiB
Vue
1343 lines
36 KiB
Vue
<template>
|
||
<view class="container" style="margin: 20rpx;margin-top: 220rpx;">
|
||
<view class="zhixing_top" style="display: flex; flex-direction: column;">
|
||
<view style="display: flex; flex-direction: row;margin-bottom: 10px; margin-left: 10px;">
|
||
<view class="querybox" style=" margin-right:20px;">
|
||
<view class="querybox_title" style="display: flex; flex-direction: row;">
|
||
<view style="color: #ca4341; margin-right:5px;">*</view>
|
||
<view>单位名称：</view>
|
||
</view>
|
||
<u-input style="width: 300px;" @change="chaxunqy()" v-model="queryParams.nameLike" clearable
|
||
placeholder="请输入单位名称"></u-input>
|
||
</view>
|
||
<view class="querybox">
|
||
<view class="querybox_title">状态：</view>
|
||
<csr-uni-data-select style="width:150px;" :filterable="false" v-model="queryParams.status" placeholder="选择状态"
|
||
dataKey="label" dataValue="value" :localdata="zhuangtailist" @change="chaxunqy"
|
||
:clear="true"></csr-uni-data-select>
|
||
</view>
|
||
<view class="querybox">
|
||
<u-button style="width:100px; float: left;margin-left: 20px;" type="warning" icon="reload" text="重置"
|
||
@click="resetqy()" size="small"></u-button>
|
||
<u-button style="width:100px; float: left;margin-left:30px;" type="primary" icon="search" text="查询"
|
||
@click="chaxunqy()" size="small"></u-button>
|
||
</view>
|
||
</view>
|
||
<view style="margin-top: 20px; margin-bottom: 10px;">
|
||
<u-button style="width:100px; float: left; margin-left:10px;" type="success" icon="plus-circle" text="添加"
|
||
@click="addyz()" size="small" v-if="$checkPermi(['safety_hazard:company:add'])"></u-button>
|
||
<u-button style="width:100px; float: left;margin-left: 20px;" type="primary" icon="edit-pen" text="编辑"
|
||
:disabled="!rowitem" @click="upxiangmu()" size="small"
|
||
v-if="$checkPermi(['safety_hazard:company:edit'])"></u-button>
|
||
<u-button style="width:100px; float: left;margin-left: 20px;" type="error" icon="trash" text="删除"
|
||
:disabled="!rowitem" @click="shanchujiancha()" size="small"
|
||
v-if="$checkPermi(['safety_hazard:company:remove'])"></u-button>
|
||
|
||
</view>
|
||
</view>
|
||
|
||
<!-- <view class="d-table">
|
||
<view class="d-tr" style=" background: #e8eaec; line-height:34px; ">
|
||
<view class="d-th">单位名称</view>
|
||
<view class="d-th">级别</view>
|
||
<view class="d-th">编码</view>
|
||
<view class="d-th">状态</view>
|
||
<view class="d-th">创建人</view>
|
||
<view class="d-th">创建时间</view>
|
||
</view>
|
||
|
||
<view style="width: 100%;">
|
||
<block v-for="(item, i) in tableData" :key="item.id">
|
||
<view class="d-tr" v-if="item.level === 0 || checkOpen(item.pids[item.pids.length - 1])">
|
||
<view class="d-td text-left" :class="`padding-left-${item.pids.length * 5 + 10}`"
|
||
style="display: flex;flex-direction: row;align-items: center;"
|
||
:style="{paddingLeft:item.level === 0?'8px':item.level === 1?'22px':'34px'}">
|
||
<u-checkbox v-model:checked="item.checked" @change="dianjifxk($event,item, i)"></u-checkbox>
|
||
<u-icon v-if="item.hasChildren" :name="!checkOpen(item.id) ? 'play-right-fill' : 'arrow-down-fill'"
|
||
color="#666" size="12" @click="open(item, i)"></u-icon>
|
||
<view v-if="item.level && !item.hasChildren" style="width: 24rpx;height: 26rpx;display: inline-block;">
|
||
</view>
|
||
<text class="padding-left-5">{{ item.name }}</text>
|
||
</view>
|
||
<view class="d-td">
|
||
{{ item.level=='1'?'一级单位': item.level=='2'?'二级单位':'三级单位' }}
|
||
</view>
|
||
<view class="d-td">{{ item.code }}</view>
|
||
<view class="d-td" style="text-align: center;">
|
||
<u-tag style="width:40px; text-align: center; margin: 0 auto;" v-if="item.status"
|
||
:text="item.status=='0'?'正常':'停用'" :type="item.status=='1'?'error':'success'" size="mini"></u-tag>
|
||
</view>
|
||
<view class="d-td">{{ item.createBy }}</view>
|
||
<view class="d-td">{{ item.createTime }}</view>
|
||
</view>
|
||
</block>
|
||
</view>
|
||
</view> -->
|
||
<view class="table-wrapper" style=" width: 98%; margin: 0 auto;">
|
||
<view class="table-container">
|
||
<!-- 表格容器 -->
|
||
<view class="table-content">
|
||
<!-- 表头部分 -->
|
||
<view class="table-header" sty>
|
||
<view class="table-row header-row">
|
||
<view v-for="(col, index) in columns" :key="'header-' + index" class="table-header-cell" :style="{
|
||
width: col.width + 'px',
|
||
minWidth: col.minWidth + 'px'
|
||
}">
|
||
{{ col.title }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 表格主体 -->
|
||
<scroll-view class="table-body" scroll-y scroll-x :scroll-with-animation="true"
|
||
:style="{ height: bodyHeight + 'px' }">
|
||
<block v-for="(item, rowIndex) in tableData" :key="'body-' + rowIndex">
|
||
<view class="table-row" v-if="item.level === 1|| checkOpen(item.pids[item.pids.length - 1])">
|
||
<!-- <view v-for="(col, colIndex) in columns" :key="'body-' + rowIndex + '-' + colIndex"
|
||
class="table-body-cell" :style="{
|
||
width: col.width + 'px',
|
||
minWidth: col.minWidth + 'px'
|
||
}">
|
||
{{ row[col.field] }}
|
||
</view> -->
|
||
<view class="table-body-cell" :style="{
|
||
width: columns[0].width + 'px',
|
||
minWidth: columns[0].minWidth + 'px',paddingLeft:item.level === 1?'8px':item.level === 2?'22px':'34px'
|
||
}" style="justify-content:flex-start;">
|
||
<u-checkbox v-model:checked="item.checked" @change="dianjifxk($event,item, i)"></u-checkbox>
|
||
<u-icon v-if="item.hasChildren" :name="!checkOpen(item.id) ? 'play-right-fill' : 'arrow-down-fill'"
|
||
color="#666" size="12"></u-icon>
|
||
<view v-if="item.level && !item.hasChildren"
|
||
style="width: 24rpx;height: 26rpx;display: inline-block;">
|
||
</view>
|
||
<text class="padding-left-5"
|
||
@click="open(item, i)">{{ item.name }}{{item.shortName?`${'('+item.shortName+')'}`:''}}</text>
|
||
</view>
|
||
<view class="table-body-cell" :style="{
|
||
width: columns[1].width + 'px',
|
||
minWidth: columns[1].minWidth + 'px'
|
||
}">
|
||
{{ item.level=='1'?'一级单位': item.level=='2'?'二级单位':'三级单位' }}
|
||
</view>
|
||
<view class="table-body-cell" :style="{
|
||
width: columns[2].width + 'px',
|
||
minWidth: columns[2].minWidth + 'px'
|
||
}">
|
||
{{ item.code }}
|
||
</view>
|
||
<view class="table-body-cell" :style="{
|
||
width: columns[3].width + 'px',
|
||
minWidth: columns[3].minWidth + 'px'
|
||
}">
|
||
<!-- <u-tag style="width:40px; text-align: center; margin: 0 auto;" v-if="item.status"
|
||
:text="item.status=='0'?'正常':'停用'" :type="item.status=='1'?'error':'success'" size="mini"></u-tag> -->
|
||
<u-switch space="2" v-model="item.status" @change="statusswitch($event,item, i)" activeValue="0"
|
||
inactiveValue="1" activeColor="#5ac725" inactiveColor="#f56c6c">
|
||
</u-switch>
|
||
</view>
|
||
<view class="table-body-cell" :style="{
|
||
width: columns[4].width + 'px',
|
||
minWidth: columns[4].minWidth + 'px'
|
||
}">
|
||
{{ item.createBy }}
|
||
</view>
|
||
<view class="table-body-cell" :style="{
|
||
width: columns[5].width + 'px',
|
||
minWidth: columns[5].minWidth + 'px'
|
||
}">
|
||
{{ item.createTime }}
|
||
</view>
|
||
</view>
|
||
</block>
|
||
</scroll-view>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-modal content="" :closeOnClickOverlay="true" :title="modaltitle" :showCancelButton="true" confirmText="保存"
|
||
width="600px" :show="addshow" @confirm="baocun()" @cancel="() => addshow = false">
|
||
<view class="slot-content" style="width: 100%;">
|
||
<view class="wenjuanadbox" style="width: 100%; height:250px; align-items: left; border-top:1px solid #eee;">
|
||
<view class="querybox1" style=" margin-top: 10px;">
|
||
<view class="querybox_title" style="display: flex; flex-direction: row;">
|
||
<view style="color: #ca4341; margin-right:5px;">*</view>
|
||
<view>上级单位：</view>
|
||
</view>
|
||
<view style="width:300px;">
|
||
<customthree-tree-select :disabled="isedit" :listData="treelistData" dataLabel="name"
|
||
dataValue="customerCompanyId" v-model="formdata.selectedArr" @xuanzechange="xuanzechange" />
|
||
</view>
|
||
</view>
|
||
<view class="querybox1" style=" margin-top: 10px;">
|
||
<view class="querybox_title" style="display: flex; flex-direction: row;">
|
||
<view style="color: #ca4341; margin-right:5px;">*</view>
|
||
<view>单位名称：</view>
|
||
</view>
|
||
<view style="width: 300px;">
|
||
<u-input v-model="formdata.name" clearable placeholder="请输入单位名称"></u-input>
|
||
</view>
|
||
</view>
|
||
<view class="querybox1" style=" margin-top: 10px;">
|
||
<view class="querybox_title" style="display: flex; flex-direction: row;">
|
||
<view style="color: #ca4341; margin-right:5px;">*</view>
|
||
<view>简称：</view>
|
||
</view>
|
||
<view style="width: 300px;">
|
||
<u-input v-model="formdata.shortName" clearable placeholder="请输入公司简称"></u-input>
|
||
</view>
|
||
</view>
|
||
<view class="querybox1" style=" margin-top: 10px;">
|
||
<view class="querybox_title" style="display: flex; flex-direction: row;">
|
||
<view style="color: #ca4341; margin-right:5px;"></view>
|
||
<view>编码：</view>
|
||
</view>
|
||
<view style="width: 300px;">
|
||
<u-input v-model="formdata.code" clearable placeholder="请输入编码"></u-input>
|
||
</view>
|
||
</view>
|
||
<view class="querybox1" style=" margin-top: 10px;">
|
||
<view class="querybox_title" style="display: flex; flex-direction: row;">
|
||
<view style="color: #ca4341; margin-right:5px;">*</view>
|
||
<view>单位状态：</view>
|
||
</view>
|
||
<view style="width: 300px;">
|
||
<u-radio-group v-model="formdata.status" placement="row" activeColor="#007aff">
|
||
<u-radio name="0" label="正常" :customStyle="{margin: '8px 8px 8px 8px'}"></u-radio>
|
||
<u-radio name="1" label="停用" :customStyle="{margin: '8px 8px 8px 8px'}"></u-radio>
|
||
</u-radio-group>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
</u-modal>
|
||
|
||
<next-modal :show="shanchushow" confirmText="知道了" :showCancel="false" @confirm="shanchushow=false" width="400px">
|
||
<!--注意插槽的使用的优先级大于next-modal组件的props的值-->
|
||
<view slot="title" style=" border-bottom:1px solid #e8e8e8">
|
||
<view style="text-align: center;padding:20rpx;line-height:22px;"><text>删除结果</text></view>
|
||
</view>
|
||
<!-- <template #content><view style="text-align: center;"><text>hello你好，这是next-modal组件的内容！next-modal是一个轻量级的组件，没有其他依赖，请放心使用！</text></view></template> -->
|
||
<!--自定义content内容-->
|
||
<view slot="content"
|
||
style="min-height: 100px; max-height: 200px; overflow-y: auto; padding: 10px; display: flex; flex-direction: column;">
|
||
<view style="line-height:26px;">
|
||
共：{{shanchujg.total}}条，删除成功：{{shanchujg.sucTotal}}条，失败：{{shanchujg.failedTotal}}条</view>
|
||
<view style="line-height:20px;">{{shanchujg.failedDetailString}}</view>
|
||
</view>
|
||
|
||
</next-modal>
|
||
<UniMenu />
|
||
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
/**
|
||
* @vdata list 原始数据列表
|
||
* @vdata openList 被展开数据的id列表
|
||
* @vdata treeList 重组后用于展示的树形结构列表
|
||
* @vmethod treeToArray 将树形数据转换为一维数组，通过pids进行关联
|
||
* @vmethod setLevel 给list每个下标及其chilren的每个下标添加level（level越大，表示越接近leaf，leaf代表最下层或者代表树形数据的叶子）
|
||
* @vmethod checkOpen 检测是否为打开状态
|
||
*
|
||
* 可以通过设置openList的默认值来使得树形数据默认展开，但是必须包含需要展开的列的所有pid
|
||
*
|
||
*/
|
||
import {
|
||
getsafety_hazardInfo,
|
||
getexecutionprojectlist
|
||
} from "@/apis/zhixing"
|
||
import {
|
||
getthstatus
|
||
} from "@/apis/hetong"
|
||
|
||
import {
|
||
getstandardchecktablelist
|
||
|
||
} from "@/apis/biaozhunku"
|
||
import {
|
||
setsafety_hazardcompanystatus,
|
||
getsysCtcNo,
|
||
getcustomerCompanyIdinfo,
|
||
getcompanylist,
|
||
getcompanytreeselect,
|
||
addsafety_hazardcompany,
|
||
upsafety_hazardcompany,
|
||
delsafety_hazardcompany
|
||
} from "@/apis/yezhudanwei"
|
||
import {
|
||
getToken,
|
||
setToken,
|
||
removeToken
|
||
} from '@/utils/auth'
|
||
import {
|
||
parseObjectToArray
|
||
} from "@/utils/util"
|
||
import UniMenu from '@/components/uni-menu/uni-menu.vue'
|
||
import comboxMore from '@/components/wl-combox-more/combox-more.vue'
|
||
import useUserStore from '@/store/user';
|
||
import CustomPicker from '@/components/custom-search-picker/index.vue';
|
||
import AddEditnr from '@/pages/zhixing/addwenjuan.vue';
|
||
import LandScape from '@/components/signature/landscape.vue';
|
||
export default {
|
||
name: 'tree',
|
||
computed: {
|
||
// 计算总宽度
|
||
totalWidth() {
|
||
return this.columns.reduce((sum, col) => sum + col.width, 0)
|
||
},
|
||
treeList() {
|
||
// let list = this.setLevel(this.deepClone(this.list));
|
||
// this.openIndexList.forEach((o, i) => {
|
||
// const children = this.openList[i].children;
|
||
// children.forEach((o1, i1) => {
|
||
// list.splice(o + i1 + 1, 0, o1);
|
||
// });
|
||
// });
|
||
let list = this.deepClone(this.tableData);
|
||
list = this.treeToArray(list);
|
||
return list;
|
||
}
|
||
},
|
||
|
||
components: {
|
||
UniMenu,
|
||
comboxMore,
|
||
CustomPicker,
|
||
AddEditnr,
|
||
LandScape
|
||
},
|
||
data() {
|
||
return {
|
||
|
||
// 表格配置
|
||
columns: [{
|
||
title: '单位名称',
|
||
field: 'name',
|
||
width: 400,
|
||
minWidth: 80
|
||
},
|
||
{
|
||
title: '级别',
|
||
field: 'level',
|
||
width: 100,
|
||
minWidth: 120
|
||
},
|
||
{
|
||
title: '编码',
|
||
field: 'code',
|
||
width: 200,
|
||
minWidth: 180
|
||
},
|
||
{
|
||
title: '状态',
|
||
field: 'status',
|
||
width: 80,
|
||
minWidth: 80
|
||
},
|
||
{
|
||
title: '创建人',
|
||
field: 'createBy',
|
||
width: 120,
|
||
minWidth: 100
|
||
},
|
||
{
|
||
title: '创建时间',
|
||
field: 'createTime',
|
||
width: 150,
|
||
minWidth: 100
|
||
}
|
||
],
|
||
|
||
// 容器尺寸
|
||
containerHeight: 400,
|
||
bodyHeight: 460,
|
||
rowitem: null,
|
||
addshow: false,
|
||
modaltitle: '添加',
|
||
isedit: false,
|
||
zhuangtailist: [{
|
||
label: '正常',
|
||
value: '0'
|
||
}, {
|
||
label: '停用',
|
||
value: '1'
|
||
}],
|
||
|
||
queryParams: {
|
||
nameLike: '',
|
||
status: '',
|
||
},
|
||
checkedlist: [],
|
||
tableData: [],
|
||
formdata: {
|
||
id: null,
|
||
customerCompanyId: null,
|
||
selectedArr: [],
|
||
shortName: '',
|
||
name: "",
|
||
code: "",
|
||
level: null,
|
||
parentId: null,
|
||
status: "0",
|
||
remark: ""
|
||
},
|
||
shanchushow: false,
|
||
shanchujg: {},
|
||
list: [{
|
||
name: '张三',
|
||
age: 16,
|
||
sex: 0,
|
||
id: 1,
|
||
children: [{
|
||
name: '张三-1',
|
||
age: 18,
|
||
sex: 1,
|
||
id: 11,
|
||
children: [{
|
||
name: '张三-1-1',
|
||
age: 12,
|
||
sex: 1,
|
||
id: 111,
|
||
children: [{
|
||
name: '张三-1-1-1',
|
||
age: 12,
|
||
sex: 1,
|
||
id: 11111
|
||
},
|
||
{
|
||
name: '张三-1-1-2',
|
||
age: 11,
|
||
sex: 1,
|
||
id: 11112
|
||
}
|
||
],
|
||
hasChildren: true
|
||
},
|
||
{
|
||
name: '张三-1-2',
|
||
age: 11,
|
||
sex: 1,
|
||
id: 112
|
||
}
|
||
],
|
||
hasChildren: true
|
||
}],
|
||
hasChildren: true
|
||
},
|
||
{
|
||
name: '李四',
|
||
age: 18,
|
||
sex: 1,
|
||
id: 2,
|
||
children: [{
|
||
name: '李四-1',
|
||
age: 18,
|
||
sex: 1,
|
||
id: 21
|
||
},
|
||
{
|
||
name: '李四-2',
|
||
age: 18,
|
||
sex: 1,
|
||
id: 22
|
||
}
|
||
],
|
||
hasChildren: true
|
||
},
|
||
{
|
||
name: '王五',
|
||
age: 17,
|
||
sex: 0,
|
||
id: 3
|
||
}
|
||
],
|
||
openList: [], // 设置[1, 11, 111],即可预览默认展开
|
||
treelistData: [],
|
||
};
|
||
},
|
||
computed: {
|
||
nick() {
|
||
// debugger
|
||
// return userStore.username
|
||
const userStore = useUserStore();
|
||
return userStore.name
|
||
},
|
||
imageSrc() {
|
||
|
||
const userStore = useUserStore();
|
||
return userStore.avatar
|
||
},
|
||
|
||
username() {
|
||
// debugger
|
||
// return userStore.username
|
||
const userStore = useUserStore();
|
||
return userStore.username
|
||
},
|
||
avatar() {
|
||
//debugger
|
||
const userStore = useUserStore();
|
||
return userStore.avatar
|
||
},
|
||
windowHeight() {
|
||
return uni.getSystemInfoSync().windowHeight - 50
|
||
}
|
||
},
|
||
methods: {
|
||
parseObjectToArray,
|
||
treeToArray(nodes, ids = [0]) {
|
||
let arr = [];
|
||
if (this.isArray(nodes)) {
|
||
for (let i = 0, l = nodes.length; i < l; i++) {
|
||
// debugger
|
||
const node = nodes[i];
|
||
node.pids = ids;
|
||
// node.level = ids.length - 1;
|
||
node.level = nodes[i].level;
|
||
|
||
arr.push(node); // 取每项数据放入一个新数组
|
||
if (this.isArray(node['children']) && node['children'].length > 0)
|
||
// 若存在children则递归调用，把数据拼接到新数组中，并且删除该children
|
||
arr = arr.concat(this.treeToArray(node['children'], node.pids.concat([node.id])));
|
||
delete node['children'];
|
||
}
|
||
}
|
||
return arr;
|
||
},
|
||
syncOpen(ids) {
|
||
const list = [];
|
||
ids.forEach(o => {
|
||
this.openList.forEach(o1 => {
|
||
o1 === o && list.push(o1);
|
||
});
|
||
});
|
||
this.openList = list;
|
||
},
|
||
checkOpen(id) {
|
||
//debugger
|
||
return ~this.openList.findIndex(o => o === id);
|
||
},
|
||
open(item, index) {
|
||
//debugger
|
||
if (!this.checkOpen(item.id)) {
|
||
this.openList.push(item.id);
|
||
} else {
|
||
this.syncOpen(item.pids);
|
||
}
|
||
},
|
||
setLevel(list = [], index = -1) {
|
||
index++;
|
||
list.forEach(o => {
|
||
o.level = index;
|
||
if (this.isArray(o.children)) {
|
||
this.setLevel(o.children, index);
|
||
}
|
||
});
|
||
return list;
|
||
},
|
||
// 深度克隆
|
||
deepClone(obj) {
|
||
// 对常见的“非”值，直接返回原来值
|
||
if ([null, undefined, NaN, false].includes(obj)) return obj;
|
||
if (typeof obj !== 'object' && typeof obj !== 'function') {
|
||
//原始类型直接返回
|
||
return obj;
|
||
}
|
||
var o = this.isArray(obj) ? [] : {};
|
||
for (let i in obj) {
|
||
if (obj.hasOwnProperty(i)) {
|
||
o[i] = typeof obj[i] === 'object' ? this.deepClone(obj[i]) : obj[i];
|
||
}
|
||
}
|
||
return o;
|
||
},
|
||
// 判断arr是否为一个数组，返回一个bool值
|
||
isArray(arr) {
|
||
return Object.prototype.toString.call(arr) === '[object Array]';
|
||
},
|
||
|
||
setHasChildren(arr) {
|
||
if (!Array.isArray(arr)) return [];
|
||
|
||
return arr.map(item => {
|
||
const hasChildren = item.children &&
|
||
Array.isArray(item.children) &&
|
||
item.children.length > 0;
|
||
|
||
const newItem = {
|
||
...item,
|
||
hasChildren: hasChildren,
|
||
checked: false
|
||
};
|
||
|
||
if (hasChildren) {
|
||
newItem.children = this.setHasChildren(item.children);
|
||
}
|
||
|
||
return newItem;
|
||
});
|
||
},
|
||
|
||
chaxunqy() {
|
||
//查询
|
||
this.getlistinfo()
|
||
|
||
},
|
||
resetqy() {
|
||
//重置
|
||
this.queryParams = {
|
||
nameLike: '',
|
||
status: '',
|
||
};
|
||
this.getlistinfo(); //获取列表
|
||
},
|
||
hideKeyboard() {
|
||
uni.hideKeyboard()
|
||
},
|
||
getlistinfo() {
|
||
//获取发现问题列表
|
||
this.tableData = [];
|
||
this.rowitem = null;
|
||
getcompanytreeselect(this.queryParams).then((res) => {
|
||
//debugger
|
||
// this.tableData = res.rows || [];
|
||
// this.treeList();
|
||
let datalist = res.data || [];
|
||
this.treelistData = JSON.parse(JSON.stringify(datalist));
|
||
datalist = this.setHasChildren(datalist);
|
||
let list = this.deepClone(datalist);
|
||
list = this.treeToArray(list);
|
||
// debugger
|
||
this.tableData = list;
|
||
this.openList = [list[0].id];
|
||
|
||
})
|
||
},
|
||
|
||
dianjifxk(e, item, i) {
|
||
// debugger
|
||
for (let xx of this.tableData) {
|
||
xx.checked = false;
|
||
}
|
||
if (e) {
|
||
this.rowitem = item;
|
||
} else {
|
||
this.rowitem = null;
|
||
}
|
||
},
|
||
addyz() {
|
||
//添加
|
||
this.addshow = true;
|
||
this.isedit = false;
|
||
this.formdata = {
|
||
id: null,
|
||
customerCompanyId: null,
|
||
selectedArr: [],
|
||
name: "",
|
||
code: "",
|
||
shortName: '',
|
||
level: null,
|
||
parentId: null,
|
||
status: "0",
|
||
remark: ""
|
||
};
|
||
|
||
//debugger
|
||
//新增
|
||
if (this.rowitem) {
|
||
this.formdata.level = Number(this.rowitem.level) + Number(1);
|
||
this.formdata.parentId = this.rowitem.customerCompanyId;
|
||
// this.formdata.customerCompanyId = this.rowitem.customerCompanyId;
|
||
this.formdata.selectedArr = [String(this.rowitem.customerCompanyId)];
|
||
}
|
||
|
||
this.modaltitle = "添加业主单位";
|
||
},
|
||
|
||
upxiangmu() {
|
||
//详情
|
||
this.isedit = true;
|
||
getcustomerCompanyIdinfo(this.rowitem.customerCompanyId).then(res => {
|
||
//debugger
|
||
this.formdata = res.data;
|
||
this.formdata.selectedArr = [String(this.formdata.customerCompanyId)];
|
||
this.addshow = true;
|
||
});
|
||
|
||
},
|
||
baocun() {
|
||
//保存
|
||
// debugger
|
||
if (this.formdata.selectedArr.length == 0) {
|
||
this.$modal.msgError("请选择上级单位！")
|
||
return;
|
||
} else if (!this.formdata.name) {
|
||
this.$modal.msgError("请输入单位名称！")
|
||
return;
|
||
} else if (!this.formdata.shortName) {
|
||
this.$modal.msgError("请输入公司简称！")
|
||
return;
|
||
}
|
||
|
||
|
||
// debugger
|
||
if (this.formdata.customerCompanyId) {
|
||
//编辑
|
||
upsafety_hazardcompany(this.formdata).then(res => {
|
||
//debugger
|
||
this.$modal.msgSuccess("修改成功！");
|
||
this.addshow = false;
|
||
|
||
setTimeout(() => {
|
||
this.getlistinfo(); //获取列表
|
||
}, 300);
|
||
|
||
});
|
||
} else {
|
||
// debugger
|
||
|
||
if (this.formdata.level == 4) {
|
||
this.$modal.msgError("单位级别最大为三级！")
|
||
return;
|
||
|
||
}
|
||
this.formdata.customerCompanyId = this.formdata.selectedArr[0].toString();
|
||
|
||
addsafety_hazardcompany(this.formdata).then(res => {
|
||
// debugger
|
||
this.$modal.msgSuccess("添加成功！");
|
||
this.addshow = false;
|
||
setTimeout(() => {
|
||
this.getlistinfo();
|
||
}, 300);
|
||
|
||
});
|
||
}
|
||
|
||
},
|
||
shanchujiancha() {
|
||
//删除
|
||
// debugger
|
||
|
||
this.$modal.confirm('确定要删除此条信息吗？').then(() => {
|
||
// debugger
|
||
delsafety_hazardcompany([this.rowitem.customerCompanyId]).then((res) => {
|
||
// debugger
|
||
// this.$modal.msgSuccess("删除成功！");
|
||
this.shanchushow = true;
|
||
this.shanchujg = res.data;
|
||
setTimeout(() => {
|
||
this.getlistinfo(); //获取列表
|
||
}, 300);
|
||
})
|
||
});
|
||
},
|
||
xuanzechange(e) {
|
||
//debugger
|
||
// if (this.rowitem) {
|
||
// this.formdata.level = e.level;
|
||
// this.formdata.parentId = e.parentId;
|
||
// this.formdata.status = e.status;
|
||
// } else {
|
||
// debugger
|
||
// this.formdata.level = Number(e.level) + Number(1);
|
||
// this.formdata.parentId = e.customerCompanyId;
|
||
|
||
// }
|
||
if (this.isedit) {
|
||
|
||
} else {
|
||
this.formdata.level = Number(e.level) + Number(1);
|
||
this.formdata.parentId = e.customerCompanyId;
|
||
|
||
}
|
||
|
||
|
||
|
||
},
|
||
|
||
statusswitch(e, item, index) {
|
||
//更改状态
|
||
// debugger
|
||
let that = this;
|
||
let text = e == 1 ? '停用' : '正常';
|
||
// this.$modal.confirm(`确定要将此条信息状态改为${text}吗？`).then(() => {
|
||
// debugger
|
||
// }).fail(() => {
|
||
// debugger
|
||
// });
|
||
uni.showModal({
|
||
title: '系统提示',
|
||
content: `确定要将此条信息状态改为${text}吗？`,
|
||
cancelText: '取消',
|
||
confirmText: '确定',
|
||
customStyle: 'class=custom-modal',
|
||
success: function(res) {
|
||
// debugger
|
||
if (res.confirm) {
|
||
setsafety_hazardcompanystatus(item.customerCompanyId, e).then(res => {
|
||
that.$modal.msgSuccess("修改成功！");
|
||
|
||
});
|
||
} else {
|
||
if (e == 1) {
|
||
item.status = 0;
|
||
} else {
|
||
item.status = 1;
|
||
}
|
||
}
|
||
}
|
||
})
|
||
},
|
||
},
|
||
onShow() {
|
||
|
||
this.getlistinfo();
|
||
|
||
// this.getxmdwlist(); //获取项目单位列表
|
||
const userStore = useUserStore();
|
||
userStore.setparentmenutitle('项目');
|
||
userStore.setchildrenmenutitle('业主单位');
|
||
},
|
||
onLoad() {
|
||
// this.getUser()
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
|
||
}
|
||
|
||
@for $i from 0 through 100 {
|
||
.w-#{$i} {
|
||
width: $i + '%';
|
||
}
|
||
|
||
.h-#{$i} {
|
||
height: $i + '%';
|
||
}
|
||
|
||
.padding-#{$i} {
|
||
padding: $i + rpx;
|
||
}
|
||
|
||
.padding-left-#{$i} {
|
||
padding-left: $i + rpx;
|
||
}
|
||
|
||
.padding-right-#{$i} {
|
||
padding-right: $i + rpx;
|
||
}
|
||
|
||
.padding-top-#{$i} {
|
||
padding-top: $i + rpx;
|
||
}
|
||
|
||
.padding-bottom-#{$i} {
|
||
padding-bottom: $i + rpx;
|
||
}
|
||
|
||
.margin-#{$i} {
|
||
margin: $i + rpx;
|
||
}
|
||
|
||
.margin-left-#{$i} {
|
||
margin-left: $i + rpx;
|
||
}
|
||
|
||
.margin-right-#{$i} {
|
||
margin-right: $i + rpx;
|
||
}
|
||
|
||
.margin-top-#{$i} {
|
||
margin-top: $i + rpx;
|
||
}
|
||
|
||
.margin-bottom-#{$i} {
|
||
margin-bottom: $i + rpx;
|
||
}
|
||
}
|
||
|
||
.d-table {
|
||
display: table;
|
||
width: 98%;
|
||
vertical-align: middle;
|
||
text-align: center;
|
||
table-layout: fixed;
|
||
font-size: 28rpx;
|
||
word-break: break-all;
|
||
background-color: white;
|
||
border-collapse: collapse;
|
||
margin: 0 auto;
|
||
|
||
&.primary {
|
||
&.dark {
|
||
.d-thead {
|
||
background-color: #2b85e4;
|
||
}
|
||
}
|
||
|
||
&.disabled {
|
||
.d-thead {
|
||
background-color: #a0cfff;
|
||
}
|
||
}
|
||
|
||
&.light {
|
||
.d-thead {
|
||
background-color: #ecf5ff;
|
||
}
|
||
}
|
||
|
||
.d-thead {
|
||
background-color: #2979ff;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
&.success {
|
||
&.dark {
|
||
.d-thead {
|
||
background-color: #18b566;
|
||
}
|
||
}
|
||
|
||
&.disabled {
|
||
.d-thead {
|
||
background-color: #71d5a1;
|
||
}
|
||
}
|
||
|
||
&.light {
|
||
.d-thead {
|
||
background-color: #dbf1e1;
|
||
}
|
||
}
|
||
|
||
.d-thead {
|
||
background-color: #19be6b;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
&.warning {
|
||
&.dark {
|
||
.d-thead {
|
||
background-color: #f29100;
|
||
}
|
||
}
|
||
|
||
&.disabled {
|
||
.d-thead {
|
||
background-color: #fcbd71;
|
||
}
|
||
}
|
||
|
||
&.light {
|
||
.d-thead {
|
||
background-color: #fdf6ec;
|
||
}
|
||
}
|
||
|
||
.d-thead {
|
||
background-color: #ff9900;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
&.danger {
|
||
&.dark {
|
||
.d-thead {
|
||
background-color: #dd6161;
|
||
}
|
||
}
|
||
|
||
&.disabled {
|
||
.d-thead {
|
||
background-color: #fab6b6;
|
||
}
|
||
}
|
||
|
||
&.light {
|
||
.d-thead {
|
||
background-color: #fef0f0;
|
||
}
|
||
}
|
||
|
||
.d-thead {
|
||
background-color: #fa3534;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
&.info {
|
||
&.dark {
|
||
.d-thead {
|
||
background-color: #82848a;
|
||
}
|
||
}
|
||
|
||
&.disabled {
|
||
.d-thead {
|
||
background-color: #c8c9cc;
|
||
}
|
||
}
|
||
|
||
&.light {
|
||
.d-thead {
|
||
background-color: #f4f4f5;
|
||
}
|
||
}
|
||
|
||
.d-thead {
|
||
background-color: #909399;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
&.gray {
|
||
.d-thead {
|
||
background-color: #aaa;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
&.border-under {
|
||
|
||
.d-td,
|
||
.d-th {
|
||
@extend .noBorder;
|
||
}
|
||
|
||
.d-tr {
|
||
@extend .border-bottom;
|
||
}
|
||
|
||
.d-table {
|
||
.d-tr {
|
||
@extend .noBorder;
|
||
}
|
||
}
|
||
}
|
||
|
||
&.large {
|
||
|
||
.d-td,
|
||
.d-th {
|
||
height: 80rpx;
|
||
}
|
||
}
|
||
|
||
&.middle {
|
||
|
||
.d-td,
|
||
.d-th {
|
||
height: 60rpx;
|
||
}
|
||
}
|
||
|
||
.d-td,
|
||
.d-th {
|
||
@extend .border;
|
||
}
|
||
|
||
.d-table {
|
||
height: 100%;
|
||
|
||
.d-td,
|
||
.d-th {
|
||
@extend .noBorder;
|
||
}
|
||
|
||
// .d-tr {
|
||
// &:first-child {
|
||
// .d-td{
|
||
// &.border-bottom {
|
||
// border-bottom: none;
|
||
// }
|
||
// &.border-top {
|
||
// border-top: none;
|
||
// }
|
||
// }
|
||
// }
|
||
// }
|
||
}
|
||
|
||
input.borderInput {
|
||
border: 1px solid #ccc;
|
||
border-radius: 6rpx;
|
||
width: 80%;
|
||
height: 80%;
|
||
display: inline-flex;
|
||
}
|
||
}
|
||
|
||
.d-caption {
|
||
display: table-caption;
|
||
background-color: inherit;
|
||
}
|
||
|
||
.d-thead {
|
||
display: table-header-group;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.d-tbody {
|
||
display: table-row-group;
|
||
}
|
||
|
||
.d-tfoot {
|
||
display: table-footer-group;
|
||
}
|
||
|
||
.d-tr {
|
||
display: table-row;
|
||
width: 100%;
|
||
}
|
||
|
||
.d-td,
|
||
.d-th {
|
||
display: table-cell;
|
||
vertical-align: middle;
|
||
height: 60rpx;
|
||
font-size: 28rpx;
|
||
padding: 10rpx 10rpx;
|
||
;
|
||
}
|
||
|
||
.d-th {
|
||
font-weight: 600;
|
||
}
|
||
|
||
.border-top {
|
||
border-top: 1px solid #efefef !important;
|
||
}
|
||
|
||
.border-left {
|
||
border-left: 1px solid #efefef !important;
|
||
}
|
||
|
||
.border-bottom {
|
||
border-bottom: 1px solid #efefef !important;
|
||
}
|
||
|
||
.border-right {
|
||
border-right: 1px solid #efefef !important;
|
||
}
|
||
|
||
.border {
|
||
border: 1px solid #efefef;
|
||
}
|
||
|
||
.noBorder {
|
||
border: 0;
|
||
}
|
||
|
||
.flex {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
&-wrap {
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
&-nowrap {
|
||
flex-wrap: nowrap;
|
||
}
|
||
|
||
&-direction {
|
||
flex-direction: column;
|
||
}
|
||
}
|
||
|
||
@each $type in center,
|
||
space-between,
|
||
space-around,
|
||
flex-start,
|
||
flex-end {
|
||
.row-#{$type} {
|
||
justify-content: $type;
|
||
}
|
||
}
|
||
|
||
@each $type in center,
|
||
stretch,
|
||
flex-start,
|
||
flex-end {
|
||
.col-#{$type} {
|
||
align-items: $type;
|
||
}
|
||
}
|
||
|
||
@each $type in center,
|
||
left,
|
||
right {
|
||
.text-#{$type} {
|
||
text-align: $type !important;
|
||
}
|
||
}
|
||
|
||
.zhixing_top {
|
||
width: 98%;
|
||
margin: 0 auto;
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-top: 20px;
|
||
|
||
|
||
}
|
||
|
||
.querybox {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
|
||
.querybox_title {
|
||
font-size: 13px;
|
||
// text-align: right;
|
||
justify-content: end;
|
||
}
|
||
}
|
||
|
||
.querybox1 {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
margin-right: 60rpx;
|
||
font-size: 14px;
|
||
|
||
.querybox_title {
|
||
width: 100px;
|
||
|
||
display: flex;
|
||
flex-direction: row;
|
||
|
||
justify-content: end;
|
||
}
|
||
|
||
.imgbox {
|
||
width: calc(100% - 100px);
|
||
}
|
||
}
|
||
</style>
|
||
|
||
|
||
|
||
<style lang="scss" scoped>
|
||
.table-wrapper {
|
||
width: 100%;
|
||
overflow: hidden;
|
||
// border-radius: 8px;
|
||
background-color: #fff;
|
||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||
}
|
||
|
||
.table-content {
|
||
position: relative;
|
||
overflow: hidden;
|
||
border: 1px solid #e5e5e5;
|
||
}
|
||
|
||
.table-header {
|
||
position: sticky;
|
||
top: 0;
|
||
background-color: #f8f8f8;
|
||
z-index: 0;
|
||
border-bottom: 2px solid #e5e5e5;
|
||
/* 表头下边框 */
|
||
}
|
||
|
||
.table-body {
|
||
overflow-y: auto;
|
||
overflow-x: auto;
|
||
/* 启用横向滚动 */
|
||
scrollbar-width: none;
|
||
border-top: 1px solid #e5e5e5;
|
||
min-width: 100%;
|
||
/* 确保容器宽度 */
|
||
padding-bottom: 10px;
|
||
}
|
||
|
||
.table-row {
|
||
display: flex;
|
||
width: 100%;
|
||
border-bottom: 1px solid #e5e5e5;
|
||
}
|
||
|
||
.table-row:last-child {
|
||
// border-bottom: none;
|
||
}
|
||
|
||
.table-header-cell,
|
||
.table-body-cell {
|
||
flex: 0 0 auto;
|
||
padding: 12px 15px;
|
||
box-sizing: border-box;
|
||
border-right: 1px solid #e5e5e5;
|
||
// background-color: #fff;
|
||
font-size: 28rpx;
|
||
white-space: normal;
|
||
/* 允许换行 */
|
||
word-break: break-word;
|
||
/* 强制换行 */
|
||
display: flex;
|
||
justify-content: center;
|
||
/* 水平居中 */
|
||
align-items: center;
|
||
/* 垂直居中 */
|
||
min-height: 60rpx;
|
||
/* 最小高度 */
|
||
}
|
||
|
||
/* 内容超出处理 */
|
||
.table-body-cell {
|
||
max-width: calc(100% - 30px);
|
||
/* 保留滚动条空间 */
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
/* 超出显示省略号 */
|
||
}
|
||
|
||
/* 长文本换行样式 */
|
||
.table-body-cell.long-text {
|
||
white-space: pre-wrap;
|
||
text-overflow: clip;
|
||
overflow: visible;
|
||
}
|
||
|
||
.table-header-cell:first-child,
|
||
.table-body-cell:first-child {
|
||
border-left: 2px solid #e5e5e5;
|
||
}
|
||
|
||
.table-header-cell:last-child,
|
||
.table-body-cell:last-child {
|
||
border-right: none;
|
||
}
|
||
|
||
/* 悬停效果 */
|
||
.table-body-row:hover {
|
||
background-color: #fafafa;
|
||
}
|
||
|
||
/* 滚动条样式 */
|
||
.table-body::-webkit-scrollbar {
|
||
width: 6px;
|
||
}
|
||
|
||
.table-body::-webkit-scrollbar-thumb {
|
||
background-color: #c1c1c1;
|
||
border-radius: 3px;
|
||
}
|
||
|
||
.table-body::-webkit-scrollbar-track {
|
||
background-color: #f5f5f5;
|
||
}
|
||
</style> |