itsm-pc-handle/assets/views/newOrderSeimin.html

<div>
  <div class="modal-header" draggable class="modal-dialog">
    <div class="modal-title fontcolor-two fontsizes-14">
      快速建单
      <button type="button" class="close pull-right" ng-click="cancel()">×</button>
    </div>
  </div>
  <div class="newOrder_content" style="width: 100%">
    <div class="leftList">
      <div class="DingW">
        <input
          type="text"
          class="SJFL_ipt"
          placeholder="请输入关键字"
          ng-model="jry_modelLeft"
          ng-change="jry_categorySearch(jry_modelLeft)"
        />
        <i class="glyphicon glyphicon-search jry_icon"></i>
      </div>
      <div class="newOrder_body">
        <span ng-if="loading_c">...加载中...</span>
        <ul class="newOrder_category newOrder_l" ng-if="!loading_c">
          <li
            ng-repeat="item in jry_categoryData track by item.id"
            ng-class="{active:item.id==categorySelectId}"
            ng-click="changeCategorySelect(item)"
            ng-bind-html="item.mutiCategory"
          ></li>
          <li class="noData" ng-show="jry_categoryData.length==0">
            <img src="./../../../../assets/images/404_wushuju.png" alt="" />
          </li>
        </ul>
      </div>
    </div>
    <div class="centerList">
      <div class="DingW" style="justify-content: space-between;">
        <!-- 来电号码：18086011111；故障现象：水电类-下水疏通-小便器堵了 由总务处理 -->
        <!-- <span><span ng-if="incidentModel.incomingPhone">来电号码：{{incidentModel.incomingPhone}}；</span><span ng-if="categorySelect">故障现象：{{categorySelect.category}}</span></span>
        <span ng-if="selectedDuty">由{{selectedDuty.dept}}处理</span> -->
        <div><span ng-if="categorySelect">故障现象：{{categorySelect.category}}；</span><strong ng-if="incidentModel.incomingPhone">来电号码：{{incidentModel.incomingPhone}}</strong></div>
        <div><strong ng-if="selectedDuty">责任科室：{{selectedDuty.dept}}</strong></div>
      </div>
      <div class="body clearfix">
        <div class="c_item clearfix">
          <label><span class="colorRed">*</span>院区：</label>
          <ui-select
            class="c_item_value branch"
            ng-model="incidentModel.branch"
            ng-change="changeBranch()"
            theme="bootstrap"
            ng-required="true"
            reset-search-input="false"
          >
            <ui-select-match placeholder="请选择院区">
              <span ng-bind="$select.selected.hosName"></span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in jry_branchData| filter:{$:$select.search}"
              refresh="jry_branchSearch($select.search)"
            >
              <div
                ng-bind-html="item.hosName | highlight: $select.search"
              ></div>
            </ui-select-choices>
          </ui-select>
        </div>
        <div class="c_item clearfix">
          <label><span class="colorRed">*</span>报修科室：</label>
          <ui-select
            class="c_item_value dept"
            ng-model="incidentModel.department"
            theme="bootstrap"
            ng-required="true"
            reset-search-input="false"
          >
            <ui-select-match placeholder="请选择报修科室">
              <span ng-bind="$select.selected.dept"></span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in jry_deptData"
              refresh="jry_deptSearch($select.search,incidentModel.branch.id)"
            >
              <div ng-bind-html="item.dept | highlight: $select.search"></div>
            </ui-select-choices>
          </ui-select>
        </div>
        <div class="c_item clearfix bxr">
          <label
            ><span class="colorRed">&nbsp;&nbsp;</span
            >报修人：</label
          >
          <ui-select
            class="c_item_value"
            style="min-width: 190px"
            ng-model="incidentModel.requester"
            theme="bootstrap"
            reset-search-input="false"
          >
            <ui-select-match allow-clear placeholder="请选择报修人">
              <span
                ng-bind="$select.selected.name + '('+$select.selected.account+')'"
              ></span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in jry_requesterData"
              refresh="jry_requesterSearch($select.search)"
            >
              <div
                ng-bind-html="(item.name + '('+item.account+')') | highlight: $select.search"
              ></div>
            </ui-select-choices>
          </ui-select>
        </div>
        <div class="c_item clearfix">
          <label
            ><span class="colorRed">&nbsp;&nbsp;</span
            >联系人：</label
          >
          <input
            class="c_item_value"
            style="width: 100px;min-width:100px;"
            type="text"
            ng-model="incidentModel.contacts"
            placeholder="请填写联系人"
          />
        </div>
        <div class="c_item clearfix">
          <label><span class="colorRed">*</span>电话：</label>
          <input
            class="c_item_value"
            style="width: 120px;min-width:120px;"
            ng-required="true"
            type="text"
            ng-model="incidentModel.contactsInformation"
            placeholder="请填写电话"
          />
        </div>
        <div class="c_item clearfix" ng-if="incidentModel.incomingPhone" style="margin-right: 0;">
          <button class="btn btn-primary" ng-click="incidentModel.contactsInformation = incidentModel.incomingPhone;">来电回填</button>
        </div>
        <div class="c_item clearfix">
          <label><span class="colorRed">&nbsp;&nbsp;</span>院区楼栋：</label>
          <ui-select
            class="c_item_value place"
            ng-model="incidentModel.area"
            ng-change="changeArea()"
            theme="bootstrap"
            ng-required="true"
            reset-search-input="false"
          >
            <ui-select-match placeholder="请选择区域">
              <span ng-bind="$select.selected.area"></span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in jry_areaData"
              refresh="jry_areaSearch($select.search,incidentModel.branch?incidentModel.branch.id:'')"
            >
              <div ng-bind-html="item.area | highlight: $select.search"></div>
            </ui-select-choices>
          </ui-select>
          <ui-select
            class="c_item_value place"
            ng-model="incidentModel.place"
            theme="bootstrap"
            ng-required="true"
            reset-search-input="false"
          >
            <ui-select-match placeholder="请选择地点">
              <span ng-bind="$select.selected.place"></span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in jry_placeData"
              refresh="jry_placeSearch($select.search,incidentModel.area?incidentModel.area.id:'')"
            >
              <div ng-bind-html="item.place | highlight: $select.search"></div>
            </ui-select-choices>
          </ui-select>
          <input
            class="c_item_value"
            ng-required="true"
            type="text"
            ng-model="incidentModel.address"
            placeholder="请填写详细地址"
          />
        </div>
        <div class="c_item clearfix">
          <label
            ><span class="colorRed">*</span>优先级：</label
          >
          <ui-select
            class="c_item_value priority"
            ng-model="incidentModel.priority"
            theme="bootstrap"
          >
            <ui-select-match placeholder="请选择优先级">
              <span ng-bind="$select.selected.name"> </span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in (priorityArray | filter:$select.search) track by item.id"
            >
              <span ng-bind="item.name"></span>
            </ui-select-choices>
          </ui-select>
        </div>
        <div class="c_item clearfix">
          <label><span class="colorRed">&nbsp;&nbsp;</span>事件来源：</label>
          <ui-select
            class="c_item_value source"
            ng-model="incidentModel.source"
            theme="bootstrap"
          >
            <ui-select-match placeholder="请选择事件来源">
              <span ng-bind="$select.selected.name"> </span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in (sourceArray | filter:$select.search) track by item.id"
            >
              <span ng-bind="item.name"> </span>
            </ui-select-choices>
          </ui-select>
        </div>
        <!-- <div class="c_item clearfix">
          <label
            ><span class="colorRed">&nbsp;&nbsp;</span>预约维修时间：</label
          >
          <span class="input-icon" style="float: left">
            <input
              type="text"
              class="c_item_value underline"
              style="width: 175px"
              ng-click="endOpen = !endOpen"
              datepicker-popup="yyyy-MM-dd HH:mm:ss"
              ng-model="incidentModel.yyTime"
              is-open="endOpen"
              min-date="minYYtime"
              close-on-date-selection="false"
              ng-init="endOpen = false"
              close-text="关闭"
              current-text="今天"
              clear-text="清空"
              save-text="确定"
              show-weeks="false"
            />
            <i class="ti-calendar"></i>
          </span>
        </div> -->
        <div class="c_item c_item_value_textarea clearfix">
          <label><span class="colorRed">*</span>故障描述：</label>
          <textarea
            class="c_item_value"
            ng-model="incidentModel.description"
            placeholder="请填写故障描述"
          ></textarea>
        </div>
        <div class="c_item clearfix" style="width: 400px; height: 100px" ng-if="requestImgs.length">
          <div class="col-xs-12 ui-repair-photos">
            <div class="row  fontcolor-two margin-top-15">
              <label><span class="colorRed">&nbsp;&nbsp;</span>图片上传：</label>
              <div class="imgsBox">
                <div class="fileupload pos-rlt" ng-repeat="(idx,img) in requestImgs" style="position: relative;">
                  <img ng-src="{{attachmentAddressSplicing(img.relativeFilePath)}}"  style="max-height:300px;object-fit: contain;"
                      class="pos-rlt" width=100%; height=100%; ng-click="previewNew('requestImgs', img.relativeFilePath, idx)" />
                </div>
              </div>
              <!-- <div class="col-md-12" style="padding:0;">
                  <div class="imgsBox">
                      <div class="fileupload pos-rlt" ng-repeat="(idx,img) in requestImgs" style="position: relative;">
                          <img ng-src="{{attachmentAddressSplicing(img.relativeFilePath)}}"  style="max-height:300px;object-fit: contain;"
                              class="pos-rlt" width=100%; height=100%; ng-click="preview('requestImgs', img.relativeFilePath, idx)" />
                      </div>
                  </div>
              </div> -->
            </div>
        </div>
        </div>
        <div class="c_item clearfix" style="width: 400px; height: 100px" ng-if="!requestImgs.length">
          <label><span class="colorRed">&nbsp;&nbsp;</span>图片上传：</label>
          <div class="imgsBox">
            <div
              class="fileupload pos-rlt"
              ng-repeat="(idx,imageSrc) in imgshows"
              style="position: relative"
            >
              <div
                style="
                  border-radius: 5px;
                  overflow: hidden;
                  width: 100%;
                  height: 100%;
                "
              >
                <img
                  ng-src="{{imageSrc}}"
                  style="
                    max-width: 200px;
                    max-height: 300px;
                    margin: 0 auto;
                    display: block;
                  "
                  class="pos-rlt"
                  width="100%;"
                  height="100%;"
                  ng-click="preview(imageSrc,idx)"
                />
              </div>
              <i class="icon close" ng-click="uploadimg_del($index, imgshows)"
                >×</i
              >
            </div>
            <div
              id="upupgogo"
              class="fileupload pos-rlt clear"
              style="position: relative"
            >
              <span class="icon ion-plus-round fileupload-icon">+</span>
              <input
                type="file"
                onchange="angular.element(this).scope().change(this)"
                style="
                  display: inline-block;
                  width: 100%;
                  height: 100%;
                  opacity: 0;
                "
                class="upinp"
                uploader="uploader"
                accept="image/png,image/gif,image/jpeg,image/jpg"
                name="uploadedFile"
                nv-file-select=""
              />
            </div>
          </div>
        </div>
        <div class="c_item" style="width: 100%">
          <label style="margin-right: 8px; cursor: pointer">
            <input
              type="radio"
              name="assign"
              ng-value="1"
              ng-model="incidentModel.assign"
            />
            派单给人
          </label>
          <label>
            <input
              type="radio"
              name="assign"
              ng-value="2"
              ng-model="incidentModel.assign"
            />
            派单给组
          </label>
        </div>
        <div class="c_item clearfix" ng-if="incidentModel.assign==1">
          <label><span class="colorRed">*</span>处理人：</label>
          <ui-select
            class="c_item_value"
            style="min-width: 300px"
            ng-model="incidentModel.user"
            theme="bootstrap"
            ng-required="true"
            reset-search-input="false"
          >
            <ui-select-match placeholder="请选择处理人">
              <span ng-bind="$select.selected.name"></span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in jry_userData| filter:{$:$select.search}"
              refresh="jry_userSearch($select.search)"
            >
              <div
                ng-bind-html="item.name | highlight: $select.search"
              ></div>
            </ui-select-choices>
          </ui-select>
        </div>
        <div class="c_item clearfix" ng-if="incidentModel.assign==2">
          <label><span class="colorRed">*</span>处理组：</label>
          <ui-select
            class="c_item_value"
            style="min-width: 300px"
            ng-model="incidentModel.group"
            theme="bootstrap"
            ng-required="true"
            reset-search-input="false"
          >
            <ui-select-match placeholder="处理组">
              <span ng-bind="$select.selected.groupName"></span>
            </ui-select-match>
            <ui-select-choices
              repeat="item in jry_groupData| filter:{$:$select.search}"
              refresh="jry_groupSearch($select.search)"
            >
              <div
                ng-bind-html="item.groupName | highlight: $select.search"
              ></div>
            </ui-select-choices>
          </ui-select>
        </div>
      </div>
    </div>
    <div class="rightList">
      <div class="DingW">
        <div
          class="tab_name"
          ng-click="changeTab(1)"
          ng-class="{active:selectTab==1}"
        >
          近期报修
        </div>
        <div
          class="tab_name"
          ng-click="changeTab(2)"
          ng-class="{active:selectTab==2}"
        >
          知识库
        </div>
      </div>
      <div class="newOrder_body" ng-if="selectTab==1">
        <span ng-if="loading_i">...加载中...</span>
        <ul class="newOrder_category newOrder_r" ng-if="!loading_i">
          <li ng-repeat="item in jry_incidentData track by item.id">
            <div class="newOrder_r_item">
              <div class="ll">{{item.incidentsign}}</div>
              <div class="rr">{{item.state?item.state.name:'无'}}</div>
            </div>
            <div class="newOrder_r_item">
              <div class="ll">{{item.description}}</div>
            </div>
            <div class="newOrder_r_item">
              <div class="ll">{{ (item.place ? (item.place.area ? item.place.area.area : '') : '') + (item.place ? (item.place.place ? item.place.place : '') : '') + (item.houseNumber ? item.houseNumber : '') }}</div>
            </div>
            <div class="newOrder_r_item">
              <div class="ll"></div>
              <div class="rr">{{item.acceptDate}}</div>
            </div>
          </li>
          <li class="noData" ng-show="jry_incidentData.length==0">
            <img src="./../../../../assets/images/404_wushuju.png" alt="" />
          </li>
        </ul>
      </div>
      <div class="newOrder_body" ng-if="selectTab==2">
        <span ng-if="loading_i">...加载中...</span>
        <ul class="newOrder_category newOrder_r" ng-if="!loading_i">
          <li ng-repeat="item in jry_solutionData track by item.id">
            <div class="newOrder_r_item">
              <div class="ll">故障现象：{{item.category.mutiCategory}}</div>
            </div>
            <div class="newOrder_r_item">
              <div class="ll">故障描述：{{item.title}}</div>
            </div>
            <div class="newOrder_r_item">
              <div class="ll">
                解决方案：
                <div ng-bind-html="item.content"></div>
              </div>
            </div>
            <div class="newOrder_r_item">
              <div class="ll" style="width: 100%">
                <div class="overVis clearfix">
                  <span class="fl">附件信息</span>
                  <span class="fr" ng-click="showAll(item.id)"
                    >{{(ifshow&&showId==item.id)?'收起':'展开'}}</span
                  >
                </div>
                <div
                  ng-class="{'showAllDiv':(showId==item.id&&ifshow),'showOverDiv':(showId!=item.id||!ifshow)}"
                >
                  <div ng-if="showId==item.id&&ifshow">
                    <table style="width: 252px" class="solutionTable">
                      <tbody>
                        <tr ng-repeat="attachment in attachments">
                          <td
                            class="hidden-xs"
                            style="width: 230px; word-break: break-all"
                          >
                            {{attachment.name}}
                          </td>
                          <td class="center">
                            <div
                              class="visible-md visible-lg hidden-sm hidden-xs"
                            >
                              <a
                                ng-click="download(attachment.token,attachment.name)"
                                class="downBtn"
                                tooltip-placement="top"
                                tooltip="下载"
                                ><i class="fa fa-download"></i
                              ></a>
                            </div>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                </div>
              </div>
            </div>
          </li>
          <li class="noData" ng-show="jry_solutionData.length==0">
            <img src="./../../../../assets/images/404_wushuju.png" alt="" />
          </li>
        </ul>
      </div>
    </div>
  </div>
  <div class="modal-footer">
    <label style="display: inline-flex;align-items:center;cursor: pointer;position: relative;top: 3px;right: 16px;"><input style="margin:0;" type="checkbox" ng-model="isBuildOrderAgagin">是否连续建单</label>
    <button class="btn btn-primary" ng-click="build()">直接解决</button>
    <button class="btn btn-primary" ng-click="buildAndAssign()">建单并派单</button>
    <button class="btn btn-primary" ng-click="temporaryStorage()">暂存</button>
    <button class="btn btn-primary btn-o" ng-click="cancel()">取消</button>
  </div>
</div>
<!-- 覆盖故障描述弹窗 -->
<div class="alert-mask" ng-if="isShowAlertMask">
  <div class="alert-block">
    <div class="sa-icon sa-warning pulseWarning"> <span class="sa-body pulseWarningIns"></span> <span class="sa-dot pulseWarningIns"></span> </div>
    <h2>提示</h2>
    <p>是否覆盖故障描述?</p>
    <button class="confirm" tabindex="1" ng-click="overlayAlertMask()">覆盖</button>
    <button class="confirm" tabindex="1" ng-click="overlayLeftAlertMask()">前追加</button>
    <button class="confirm" tabindex="1" ng-click="overlayRightAlertMask()">后追加</button>
    <button class="cancel" tabindex="2" ng-click="cancelAlertMask()">取消</button>
  </div>
</div>
<style>
  /* 弹窗 start */
  .alert-mask{
    background-color: rgba(0,0,0,.4);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 10000;
  }
  .alert-mask .alert-block {
    background-color: #fff;
    font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
    width: 390px;
    height: 220px;
    padding: 17px;
    border-radius: 5px;
    text-align: center;
    position: fixed;
    left: 50%;
    top: 50%;
    margin-left: -180px;
    margin-top: -150px;
    overflow: hidden;
    z-index: 99999;
  }
  .alert-mask .sa-icon {
    width: 48px!important;
    height: 48px!important;
    border: 4px solid gray;
    border-radius: 50%;
    -webkit-border-radius: 40px;
    border-radius: 50%;
    margin: 0 auto!important;
    padding: 0;
    position: relative;
    box-sizing: content-box;
    border-color: #F8BB86;
  }
  .alert-mask .pulseWarning {
    -webkit-animation: pulseWarning .75s infinite alternate;
    animation: pulseWarning .75s infinite alternate;
  }
  .alert-mask .sa-icon.sa-warning .sa-body {
    position: absolute;
    width: 5px;
    height: 20px;
    left: 50%;
    top: 10px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    margin-left: -2px;
    background-color: #F8BB86;
  }
  .alert-mask .sa-icon.sa-warning .sa-dot {
    position: absolute;
    width: 7px;
    height: 7px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin-left: -3px;
    left: 50%;
    bottom: 10px;
    background-color: #F8BB86;
  }
  .alert-mask .pulseWarningIns {
    -webkit-animation: pulseWarningIns .75s infinite alternate;
    animation: pulseWarningIns .75s infinite alternate;
  }
  .alert-mask h2 {
    color: #575757;
    font-size: 26px;
    text-align: center;
    font-weight: 400;
    text-transform: none;
    position: relative;
    margin: 0;
    padding: 0;
    line-height: 40px;
    display: block;
  }
  .alert-mask p {
    color: #93989e;
    font-size: 16px;
    font-weight: 300;
    position: relative;
    text-align: inherit;
    float: none;
    margin: 0;
    padding: 0;
    line-height: normal;
  }
  .alert-mask button {
    background-color: #fff;
    box-shadow: none;
    font-size: 17px;
    font-weight: 500;
    -webkit-border-radius: 4px;
    border-radius: 5px;
    border: 1px solid #d1d1d1;
    padding: 5px 15px;
    margin: 26px 5px 0;
    cursor: pointer;
    color: #93989e;
  }
  /* 弹窗 end */
  .newOrder_content .btn {
    margin-top: 0;
  }
  .newOrder_content .overVis span {
    display: inline-block;
    text-align: right;
    color: #005395;
  }

  .newOrder_content .showOverDiv {
    max-height: 100px;
    overflow: hidden;
    padding-bottom: 10px;
  }

  .newOrder_content .showAllDiv {
    height: auto;
    width: 100%;
    padding-bottom: 10px;
  }
  .newOrder_content .solutionTable td {
    line-height: 20px;
    color: #005395;
    text-decoration: underline;
  }
  .newOrder_content .solutionTable .downBtn {
    color: #005395;
  }
  .newOrder_content .solutionTable tr:hover {
    background: #fff;
  }
  @media (min-width: 768px) {
    .modal-dialog {
      width: 1300px;
      margin: 30px auto;
      height: 100%;
    }
  }
  .newOrder_content input::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #c2c2c5;
  }
  .newOrder_content input:-ms-input-placeholder {
    /* IE 10+ */
    color: #c2c2c5;
  }
  .newOrder_content input:-moz-placeholder {
    /* Firefox 18- */
    color: #c2c2c5;
    opacity: 1;
  }
  .newOrder_content input::-moz-placeholder {
    /* Firefox 19+ */
    color: #c2c2c5;
    opacity: 1;
  }

  .newOrder_content textarea::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #c2c2c5;
  }
  .newOrder_content textarea:-ms-input-placeholder {
    /* IE 10+ */
    color: #c2c2c5;
  }
  .newOrder_content textarea:-moz-placeholder {
    /* Firefox 18- */
    color: #c2c2c5;
    opacity: 1;
  }
  .newOrder_content textarea::-moz-placeholder {
    /* Firefox 19+ */
    color: #c2c2c5;
    opacity: 1;
  }

  .newOrder_content .colorRed {
    color: red;
  }
  .newOrder_content .imgsBox {
    display: flex;
    justify-content: space-between;
    padding: 10px 10px;
    background: #f9f9f9;
  }
  .newOrder_content .fileupload {
    width: 64px;
    height: 64px;
    border: 1px dotted #ccc;
    display: inline-block;
    background: #fff;
    border-radius: 5px;
    color: #d8d8d8;
  }

  .newOrder_content .fileupload-icon {
    font-size: 32px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .newOrder_content .close {
    position: absolute;
    top: -5px;
    right: -6px;
    font-size: 16px;
    display: inline-block;
    width: 14px;
    height: 14px;
    color: #fff;
    background: #bd2535;
    line-height: 8px;
    text-align: center;
    border-radius: 9px;
    border: 1px solid #bd2535;
    opacity: 1;
    overflow: hidden;
  }

  .newOrder_content .close:hover {
    opacity: 0.8;
  }
  .newOrder_content .category {
    margin-right: 8px;
  }
  .newOrder_content .newOrder_body {
    height: 652px;
    overflow-y: auto;
  }
  .newOrder_content .newOrder_category li {
    font-size: 14px;
    color: #606367;
    padding: 8px;
    border-bottom: 1px dashed #d3d3d3;
  }
  .newOrder_content .newOrder_l li {
    cursor: pointer;
  }
  .newOrder_content .newOrder_l li.active {
    background-color: #d3d3d3;
  }
  .newOrder_content .newOrder_l li:hover {
    background-color: #d3d3d3;
  }
  .newOrder_content .newOrder_l li.noData:hover {
    background-color: #f5f5f5;
  }
  .newOrder_content .newOrder_r_item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 0;
  }
  .newOrder_content .newOrder_r_item p {
    margin: 0;
    word-break: break-all;
  }
  .newOrder_content .newOrder_r_item .ll {
    flex: 1;
    text-align: left;
    word-break: break-all;
  }
  .newOrder_content .newOrder_r_item .rr {
    flex: 1;
    text-align: right;
  }

  .jry_positionFather .describe {
    width: 430px;
  }

  .jry_positionChild {
    position: absolute;
    height: 20px;
    margin-top: -10px;
    right: 14px;
    top: 50%;
  }

  .jry_positionFather {
    position: relative;
    width: 100%;
  }

  .jry_item {
    display: inline-block;
    margin-left: 5px;
  }

  .jry_icon {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-block;
    width: 20px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    border: 1px rgb(211, 211, 211) solid;
    background-color: white;
    border-radius: 0 4px 4px 0;
  }

  .DingW {
    position: relative;
    display: flex;
    justify-content: center;
    height: 36px;
    line-height: 36px;
    border-bottom: 1px solid #d3d3d3;
  }
  .DingW .ui-select-match {
    line-height: normal;
  }
  .DingW .tab_name {
    flex: 1;
    text-align: center;
    cursor: pointer;
    border-right: 1px solid #d3d3d3;
  }
  .DingW .tab_name:last-of-type {
    border-right: none;
  }
  .DingW .tab_name.active {
    color: #fff;
    background-color: #006bc0;
  }

  .SJFL_ipt {
    width: 100%;
    height: 30px;
    border-radius: 4px 0 0 4px !important;
  }

  .radio_left {
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .list {
    padding: 10px 0;
    border-bottom: 1px rgb(211, 211, 211) solid;
    border-top: 1px rgb(211, 211, 211) solid;
    display: flex;
  }

  .noData {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    border-bottom: none !important;
    padding-top: 30px !important;
    cursor: default !important;
  }

  .noData img {
    width: 120px;
  }

  .newOrder_content {
    display: flex;
  }

  .leftList {
    width: 280px;
    background-color: rgb(245, 245, 245);
    height: 700px;
    margin: 4px;
    border: 1px rgb(211, 211, 211) solid;
    border-radius: 4px;
    padding: 5px;
  }

  .centerList {
    /* width: 778px; */
    flex: 1;
    background-color: rgb(245, 245, 245);
    height: 700px;
    margin: 4px;
    border: 1px rgb(211, 211, 211) solid;
    border-radius: 4px;
    padding: 5px;
  }
  .centerList .c_item {
    height: 30px;
    margin-top: 16px;
    margin-right: 8px;
    float: left;
  }
  .centerList .c_item.bxr .ui-select-allow-clear {
    width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .centerList .c_item .c_item_value {
    min-width: 165px;
    height: 30px;
    float: left;
  }
  .centerList .c_item .c_item_value.branch {
    min-width: 240px;
    width: 240px;
    margin-right: 8px;
  }
  .centerList .c_item .c_item_value.dept {
    min-width: 300px;
    width: 300px;
  }
  .centerList .c_item .c_item_value.area {
    min-width: 150px;
    width: 150px;
    margin-right: 8px;
  }
  .centerList .c_item .c_item_value.place {
    min-width: 150px;
    width: 150px;
    margin-right: 8px;
  }
  .centerList .c_item .c_item_value.priority {
    min-width: 110px;
    width: 110px;
    margin-right: 8px;
  }
  .centerList .c_item .c_item_value.source {
    min-width: 110px;
    width: 110px;
    margin-right: 8px;
  }
  .centerList .c_item input[type="text"].c_item_value {
    width: 165px;
  }
  .centerList .c_item_value_textarea {
    width: 100%;
    height: 100px;
    display: flex;
  }
  .centerList .c_item_value_textarea .c_item_value {
    flex: 1;
    height: 100px;
    resize: none;
  }
  .centerList .c_item label {
    float: left;
    line-height: 30px;
    margin: 0;
  }

  .rightList {
    width: 280px;
    background-color: rgb(245, 245, 245);
    height: 700px;
    margin: 4px;
    border: 1px rgb(211, 211, 211) solid;
    border-radius: 4px;
    padding: 5px;
  }

  .head {
    color: #005395;
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    border-bottom: 1px rgb(211, 211, 211) solid;
  }
</style>