|
@@ -8,48 +8,51 @@
|
|
center
|
|
center
|
|
>
|
|
>
|
|
<div class="content">
|
|
<div class="content">
|
|
- <div class="content_left">
|
|
|
|
- <h4>选择</h4>
|
|
|
|
- <div class="search">
|
|
|
|
- <el-input v-model="searchVal" placeholder="搜索">
|
|
|
|
- <template slot="prepend">
|
|
|
|
- <img src="../../../assets/images/search.jpg" alt />
|
|
|
|
- </template>
|
|
|
|
- </el-input>
|
|
|
|
- </div>
|
|
|
|
- <div class="allList">
|
|
|
|
- <div v-for="(item,i) in deal_personList" :key="item.id">
|
|
|
|
- <h5>
|
|
|
|
- <i class="seleced" @click="selectGroup(item,i)" :class="item.status"></i>
|
|
|
|
- <span class="noselect" @click="toggle(item,i)">{{ item.name }}</span>
|
|
|
|
- <i class="el-icon-arrow-down"></i>
|
|
|
|
- </h5>
|
|
|
|
- <div class="itemList" :class="{toggle:!item.toggle}">
|
|
|
|
- <div
|
|
|
|
- v-for="val in item.users"
|
|
|
|
- :key="val.user_id"
|
|
|
|
- @click="chooseUser(val,'single')"
|
|
|
|
- :class="{active:val.checked}"
|
|
|
|
- >
|
|
|
|
- <span class="userName">{{ val.username }}</span>
|
|
|
|
- <span>{{ val.phone }}</span>
|
|
|
|
|
|
+ <h2>选择分发人员</h2>
|
|
|
|
+ <div class="conts">
|
|
|
|
+ <div class="content_left">
|
|
|
|
+ <h4>选择</h4>
|
|
|
|
+ <div class="search">
|
|
|
|
+ <el-input v-model="searchVal" placeholder="搜索">
|
|
|
|
+ <template slot="prepend">
|
|
|
|
+ <img src="../../../assets/images/search.jpg" alt />
|
|
|
|
+ </template>
|
|
|
|
+ </el-input>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="allList">
|
|
|
|
+ <div v-for="(item,i) in deal_personList" :key="item.id">
|
|
|
|
+ <h5>
|
|
|
|
+ <i class="seleced" @click="selectGroup(item,i)" :class="item.status"></i>
|
|
|
|
+ <span class="noselect" @click="toggle(item,i)">{{ item.name }}</span>
|
|
|
|
+ <i class="el-icon-arrow-down"></i>
|
|
|
|
+ </h5>
|
|
|
|
+ <div class="itemList" :class="{toggle:!item.toggle}">
|
|
|
|
+ <div
|
|
|
|
+ v-for="val in item.users"
|
|
|
|
+ :key="val.user_id"
|
|
|
|
+ @click="chooseUser(val,'single')"
|
|
|
|
+ :class="{active:val.checked}"
|
|
|
|
+ >
|
|
|
|
+ <span class="userName">{{ val.username }}</span>
|
|
|
|
+ <span>{{ val.phone }}</span>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- </div>
|
|
|
|
- <div class="content_right">
|
|
|
|
- <h4>已选</h4>
|
|
|
|
- <ul>
|
|
|
|
- <li v-for="(item,i) in selectedList" :key="item.id">
|
|
|
|
- <span class="userName">{{ item.username }}</span>
|
|
|
|
- <span>{{ item.phone }}</span>
|
|
|
|
- <i class="el-icon-error" @click="delChooseUser(i)"></i>
|
|
|
|
- </li>
|
|
|
|
- </ul>
|
|
|
|
|
|
+ <div class="content_right">
|
|
|
|
+ <h4>已选</h4>
|
|
|
|
+ <ul>
|
|
|
|
+ <li v-for="(item,i) in selectedList" :key="item.id">
|
|
|
|
+ <span class="userName">{{ item.username }}</span>
|
|
|
|
+ <span>{{ item.phone }}</span>
|
|
|
|
+ <i class="el-icon-error" @click="delChooseUser(i)"></i>
|
|
|
|
+ </li>
|
|
|
|
+ </ul>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <p v-if="currentIndex == 0">已选择{{ personList.checked }}人共购买{{ personList.quota }}人</p>
|
|
|
|
|
|
+ <p v-if="currentIndex == 0">已选择{{ selectedList.length }}人共购买{{ personList.quota }}人</p>
|
|
<span slot="footer" class="dialog-footer btns">
|
|
<span slot="footer" class="dialog-footer btns">
|
|
<button @click="saveDepart" class="save">保存</button>
|
|
<button @click="saveDepart" class="save">保存</button>
|
|
<button @click="centerDialogVisible = false" class="cancle">取消</button>
|
|
<button @click="centerDialogVisible = false" class="cancle">取消</button>
|
|
@@ -267,10 +270,19 @@ export default {
|
|
.el-dialog__header {
|
|
.el-dialog__header {
|
|
font-size: 26px;
|
|
font-size: 26px;
|
|
color: $weight_color;
|
|
color: $weight_color;
|
|
|
|
+ padding: 0;
|
|
}
|
|
}
|
|
.content {
|
|
.content {
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
|
|
+ h2 {
|
|
|
|
+ padding: 0 0 40px 0;
|
|
|
|
+ text-align: center;
|
|
|
|
+ font-size: 20px;
|
|
|
|
+ line-height: 26px;
|
|
|
|
+ }
|
|
|
|
+ .conts {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ }
|
|
.content_left,
|
|
.content_left,
|
|
.content_right {
|
|
.content_right {
|
|
width: 400px;
|
|
width: 400px;
|