shaojiahao
/
ShangHaiYuan-AnXin
2
0
Fork 0
Code Issues 11 Pull Requests Projects Releases Wiki Activity
Browse Source

[新增]在线创建预案标题排序

tangshan
邵佳豪 4 years ago
parent
aeacfbea3d
commit
bf93b989e5
4 changed files with 125 additions and 113 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      src/app/plan-management/create-plan-online-five/create-plan-online-five.component.html
  2. 217
      src/app/plan-management/create-plan-online-five/create-plan-online-five.component.scss
  3. 5
      src/app/plan-management/create-plan-online-five/create-plan-online-five.component.ts
  4. 12
      src/app/ui/role/role.component.ts

4
src/app/plan-management/create-plan-online-five/create-plan-online-five.component.html
Unescape View File

@ -1,7 +1,7 @@
<div class="bigbox">
<div class="titlebox" *ngIf="pattern == 'edit'">
<div class="titleitembox">
<div class="item" *ngFor="let item of planTemplateData;let key = index" (click)="clickTitleItem(item)"
<div class="titleitembox" cdkDropList cdkDropListOrientation="horizontal" (cdkDropListDropped)="drop($event)">
<div cdkDrag class="item" *ngFor="let item of planTemplateData;let key = index" (click)="clickTitleItem(item)"
[ngClass]="{'selectedItem': selectedItem == item.groupName}" [title]="item.groupName">
{{key + 1}}.{{item.groupName}}
</div>

217
src/app/plan-management/create-plan-online-five/create-plan-online-five.component.scss
Unescape View File

@ -63,7 +63,7 @@
}
}
}
.contentbox {
height: 100%;
box-sizing: border-box;
@ -214,7 +214,7 @@
}
}
}
.leftnew{
.leftnew {
position: fixed;
width: 14%;
height: 90%;
@ -224,40 +224,40 @@
overflow-y: auto;
display: flex;
flex-direction: column;
.newHead{
.newHead {
width: 100%;
height: 40px;
text-align: center;
background-color: #e1f1ff;
span{
text-align: center;
font-size: 16px;
color: #2196F3;
height: 40px;
line-height: 40px;
}
span {
text-align: center;
font-size: 16px;
color: #2196f3;
height: 40px;
line-height: 40px;
}
}
.newBody{
.newBody {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.search{
.search {
margin: 10px;
width: 280px;
height: 32px;
background-color: #E8E9E9;
background-color: #e8e9e9;
border-radius: 20px;
display: flex;
.searchChoose{
.searchChoose {
width: 30%;
height: 70%;
margin-top: 2%;
border-right: 1px solid #9EAAB4;
border-right: 1px solid #9eaab4;
//text-align: center;
select{
select {
background-color: transparent;
border: 0;
border: 0;
outline: none;
margin-left: 5px;
//height: 22px;
@ -267,7 +267,7 @@
bottom: 3px;
}
}
.searchText{
.searchText {
width: 65%;
height: 100%;
input {
@ -276,19 +276,18 @@
height: 100%;
border: none;
outline: none;
background-color: #E8E9E9;
background-color: #e8e9e9;
//line-height: 32px;
//border-radius: 3px;
}
.queryField {
height: 32px;
//margin: 0 10px;
}
.ordiv{
}
.ordiv {
position: relative;
.organizationbox{
width:280px;
.organizationbox {
width: 280px;
height: 600px;
background: white;
position: absolute;
@ -297,19 +296,19 @@
z-index: 999;
border: 1px solid grey;
overflow-y: auto;
li{
li {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
mat-tree-node{
mat-tree-node {
cursor: pointer;
white-space:pre;
white-space: pre;
}
mat-tree-node:hover{
background: rgba(225, 225, 225, 0.8);
mat-tree-node:hover {
background: rgba(225, 225, 225, 0.8);
}
.closediv{
.closediv {
z-index: 100;
position: absolute;
right: 0;
@ -320,29 +319,28 @@
line-height: 30px;
text-align: center;
}
.closediv:hover{
background:rgba(225, 225, 225, 0.8);
.closediv:hover {
background: rgba(225, 225, 225, 0.8);
}
}
}
.zdy{
.zdy {
width: 100%;
height: 100%;
}
}
.searImg{
.searImg {
width: 15%;
height: 100%;
cursor: pointer;
img{
img {
position: relative;
top: 20%;
left: 10%;
}
}
}
.newBodycenter{
.newBodycenter {
height: 86%;
width: 100%;
display: flex;
@ -350,33 +348,33 @@
align-content: flex-start;
overflow-y: auto;
//flex-direction: column;
.centerfen{
.centerfen {
//width: 50%;
margin: 15px 0 12px 24px;
//height: 150px;
display: flex;
flex-direction: column;
.tu{
.tu {
height: 100px;
width: 110px;
cursor: pointer;
img{
img {
width: 110px;
height: 100px;
}
}
.org{
.org {
width: 110px;
}
.lry{
.lry {
width: 110px;
}
span{
span {
display: inline-block;
}
}
}
.fenye{
.fenye {
width: 100%;
}
}
@ -398,7 +396,7 @@
height: 28px;
line-height: 28px;
}
input{
input {
width: 140px;
}
p {
@ -786,43 +784,41 @@
}
}
}
.building{
.building {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
}
.onetext{
.onetext {
height: 40px;
width: 100%;
border-bottom: 1px solid #F2F4F5;
span{
border-bottom: 1px solid #f2f4f5;
span {
height: 40px;
width: 40%;
font-size: 16px;
background-color: #F2F4F5;
background-color: #f2f4f5;
}
input{
input {
height: 40px;
//width: 60%;
font-size: 16px;
border: none;
outline: none;
border-bottom: 1px solid #F2F4F5;
border-bottom: 1px solid #f2f4f5;
}
img{
img {
height: 20px;
width: 20px;
position: relative;
top: 10px;
}
}
.file{
.file {
width: 100%;
height: 100%;
.fileHead{
.fileHead {
height: 40px;
width: 100%;
background-color: #ffd91d;
@ -835,62 +831,61 @@
color: #b99a00;
}
}
.fileBody{
.fileBody {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
}
}
.fouradj{
.fouradj {
width: 100%;
height: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
//flex-direction: column;
.adjtop,.adjbottom{
.adjtop,
.adjbottom {
width: 100%;
height: 50%;
display: flex;
.adjbody{
.adjbody {
height: 100%;
width: 50%;
input{
input {
height: 40px;
//width: 60%;
font-size: 16px;
border: none;
outline: none;
}
}
}
.fourTexttwo{
.fourTexttwo {
height: 40px;
width: 50%;
border-bottom: 1px solid #F2F4F5;
input{
height: 40px;
//width: 60%;
font-size: 16px;
border: none;
outline: none;
border-bottom: 1px solid #f2f4f5;
input {
height: 40px;
//width: 60%;
font-size: 16px;
border: none;
outline: none;
}
}
}
.parts{
.parts {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
.partsHead{
.partsHead {
width: 100%;
height: 40px;
background-color: #ffd91d;
text-align: center;
input{
input {
height: 40px;
font-size: 16px;
border: none;
@ -907,21 +902,21 @@
margin-right: 10px;
}
}
.partsBody{
.partsBody {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.duohang{
.duohang {
width: 100%;
height: 40px;
display: flex;
border-bottom: 1px solid #FFFFFF;
.duohangHalf{
border-bottom: 1px solid #ffffff;
.duohangHalf {
height: 40px;
width: 50%;
input{
input {
height: 40px;
//width: 60%;
font-size: 16px;
@ -930,11 +925,11 @@
}
}
}
.danhang{
.danhang {
width: 100%;
height: 40px;
//border-top: 1px solid #FFFFFF;
input{
input {
height: 40px;
//width: 60%;
font-size: 16px;
@ -995,42 +990,42 @@
margin: 10px 0;
}
}
.titleItem{
.titleItem {
width: 100%;
height: 36px;
line-height: 36px;
background-color: #2196F3;
background-color: #2196f3;
text-align: center;
color: white;
}
}
.toolDiv{
.toolDiv {
position: fixed;
right: 20%;
bottom: 20px;
display: flex;
flex-direction: column;
button{
button {
margin: 5px 0;
}
}
.oldData{
.oldData {
width: 100px;
height: 36px;
background-color: #FFFFFF;
background-color: #ffffff;
border-radius: 0px 60px 60px 0px;
position: fixed;
right: 25.3%;
top: 120px;
display: flex;
cursor: pointer;
span{
span {
color: #2196f3;
font-size: 16px;
line-height: 36px;
margin-left: 5px;
}
img{
img {
width: 18px;
height: 15px;
position: relative;
@ -1039,31 +1034,31 @@
}
}
}
.noPadding{
.noPadding {
padding-top: 10px;
}
.quitPreview{
.quitPreview {
position: fixed;
top: 10px;
right: 15px;
}
}
.yinrubox{
.yinrubox {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.yinruboxHead{
.yinruboxHead {
width: 100%;
height:7%;
border-bottom:1px solid #8b8c8c;
span{
height: 7%;
border-bottom: 1px solid #8b8c8c;
span {
font-size: 18px;
color: #2196f3;
line-height: 40px;
}
button{
button {
float: right;
}
}
@ -1209,3 +1204,27 @@
}
}
.cdk-drag-preview {
height: 36px;
line-height: 36px;
background: white;
color: #8b8c8c;
margin: 0 3px;
text-align: center;
box-sizing: border-box;
padding: 0 10px;
font-size: 14px;
overflow: hidden; /*超出部分隐藏*/
white-space: nowrap; /*不换行*/
text-overflow: ellipsis; /*超出部分文字以...显示*/
box-sizing: border-box;
border-radius: 40px;
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
0 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.cdk-drag-placeholder {
opacity: 0;
}
.cdk-drag-animating {
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}

5
src/app/plan-management/create-plan-online-five/create-plan-online-five.component.ts
Unescape View File

@ -19,6 +19,7 @@ import { PageEvent } from '@angular/material/paginator';
import { TreeService } from '../../http-interceptors/tree.service'
import Viewer from 'viewerjs';
import { async } from 'rxjs/internal/scheduler/async';
import {CdkDragDrop, moveItemInArray} from '@angular/cdk/drag-drop';
declare var $: any
@Component({
selector: 'app-create-plan-online-five',
@ -363,6 +364,10 @@ export class CreatePlanOnlineFiveComponent implements OnInit {
}
}
drop(event: CdkDragDrop<string[]>) {
moveItemInArray(this.planTemplateData, event.previousIndex, event.currentIndex);
}
//获取建筑信息
buildingsData=[]
buildDataName

12
src/app/ui/role/role.component.ts
Unescape View File

@ -4,7 +4,6 @@ import {FormControl} from '@angular/forms';
import { HttpClient } from '@angular/common/http';
import { CacheTokenService } from '../../http-interceptors/cache-token.service'
import format from 'date-fns/format';
import {CdkDragDrop, moveItemInArray} from '@angular/cdk/drag-drop';
import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree';
import {FlatTreeControl} from '@angular/cdk/tree';
import { TreeService } from '../../http-interceptors/tree.service'
@ -169,17 +168,6 @@ export class RoleComponent implements OnInit {
)
}
drop(event: CdkDragDrop<string[]>) {//拖拽函数
moveItemInArray(this.dataSource, event.previousIndex, event.currentIndex);
this.dataSource.forEach((item, index) => {
item.order = index;
})
const a = [...this.dataSource];
this.dataSource = [];
setTimeout(() => {
this.dataSource = a;
}, 10);
};
}

Write Preview
Loading…
Cancel
Save