|
@@ -30,6 +30,7 @@
|
|
|
<div class="table-wrap">
|
|
|
<div class="left-box">
|
|
|
<p style="margin-bottom:20px">待选指标(选择指标数量不超过50)</p>
|
|
|
+ <div>
|
|
|
<el-cascader
|
|
|
v-model="filter.classify"
|
|
|
:options="classifyOpt"
|
|
@@ -64,10 +65,56 @@
|
|
|
placeholder="指标ID/指标名称"
|
|
|
v-model="filter.keyword"
|
|
|
style="width: 200px"
|
|
|
+ @blur="handleFilter"
|
|
|
>
|
|
|
<i slot="prefix" class="el-input__icon el-icon-search"></i>
|
|
|
</el-input>
|
|
|
-
|
|
|
+ <el-checkbox
|
|
|
+ label="列表全选"
|
|
|
+ v-model="isCheckAll"
|
|
|
+ :indeterminate="isCheckIndeterminate"
|
|
|
+ style="margin-left:10px"
|
|
|
+ @change="listCheckAllChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="list"
|
|
|
+ border
|
|
|
+ @sort-change="sortChange"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ ref="edbDataRef"
|
|
|
+ @select="selectHandle"
|
|
|
+ @select-all="selectAllHandle"
|
|
|
+ height="500px"
|
|
|
+ >
|
|
|
+ <el-table-column type="selection" min-width="50" align="center" />
|
|
|
+ <el-table-column label="指标全称" align="center" prop="EdbName"/>
|
|
|
+ <el-table-column label="最新日期" align="center" prop="LatestDate" sortable="custom" width="120px" />
|
|
|
+ <el-table-column label="最新值" align="center" prop="LatestValue" width="80px"/>
|
|
|
+ <el-table-column label="创建人" align="center" prop="SysUserRealName" width="80px"/>
|
|
|
+ <el-table-column label="频度" align="center" prop="Frequency" width="50px"/>
|
|
|
+ <el-table-column label="单位" align="center" prop="Unit" width="50px"/>
|
|
|
+ </el-table>
|
|
|
+ <m-page
|
|
|
+ class="table-page"
|
|
|
+ v-show="total"
|
|
|
+ :total="total"
|
|
|
+ :pageSize="pageSize"
|
|
|
+ :page_no="page"
|
|
|
+ @handleCurrentChange="pageNumberChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary">加入已选指标</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="right-box">
|
|
|
+ <el-table
|
|
|
+ :data="selectList"
|
|
|
+ border
|
|
|
+ height="500px"
|
|
|
+ >
|
|
|
+ <el-table-column label="指标全称" align="center" prop="EdbName"/>
|
|
|
+ </el-table>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -75,8 +122,11 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import mPage from '@/components/mPage.vue'
|
|
|
import {computedBatchTypesV2} from './util'
|
|
|
+import { dataBaseInterface } from '@/api/api.js';
|
|
|
export default {
|
|
|
+ components:{mPage},
|
|
|
props:{
|
|
|
isShow:{
|
|
|
type: Boolean
|
|
@@ -84,8 +134,8 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- computedBatchTypes:computedBatchTypesV2,
|
|
|
- computedType:computedBatchTypesV2[0].type,
|
|
|
+ computedBatchTypes:computedBatchTypesV2,//计算类型筛选项
|
|
|
+ computedType:computedBatchTypesV2[0].type,//当前选中的计算类型
|
|
|
|
|
|
filter:{
|
|
|
classify:'',
|
|
@@ -102,13 +152,92 @@ export default {
|
|
|
children: 'Children',
|
|
|
checkStrictly: true
|
|
|
},
|
|
|
+
|
|
|
+ isCheckAll:false,//是否全选
|
|
|
+ isCheckIndeterminate:false,// 标志列表当前是全选状态还是不是全选状态和 isCheckAll不一样
|
|
|
+
|
|
|
+ page:1,
|
|
|
+ pageSize:20,
|
|
|
+ total:0,
|
|
|
+ list:[],
|
|
|
+
|
|
|
+ selectList:[],//当前勾选的数据
|
|
|
+
|
|
|
+ isAddList:[],//添加到右侧的数据
|
|
|
+
|
|
|
+
|
|
|
}
|
|
|
},
|
|
|
+ mounted() {
|
|
|
+ this.getEDBList()
|
|
|
+ },
|
|
|
|
|
|
methods: {
|
|
|
handleClose(){
|
|
|
this.$emit('close')
|
|
|
- }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 获取指标列表
|
|
|
+ async getEDBList(){
|
|
|
+ const res=await dataBaseInterface.targetSearchByPage({
|
|
|
+ CurrentIndex:this.page,
|
|
|
+ PageSize: this.pageSize,
|
|
|
+ })
|
|
|
+ if(res.Ret===200){
|
|
|
+ this.list=res.Data.List||[]
|
|
|
+ this.total=res.Data.Paging.Totals
|
|
|
+
|
|
|
+ // 判断是否要选中列表数据
|
|
|
+ if(this.isCheckAll){
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ pageNumberChange(e){
|
|
|
+ this.page=e
|
|
|
+ this.getEDBList()
|
|
|
+ },
|
|
|
+
|
|
|
+ handleFilter(){
|
|
|
+ this.page=1
|
|
|
+ this.list=[]
|
|
|
+ this.getEDBList()
|
|
|
+ },
|
|
|
+
|
|
|
+ // 切换列表全选按钮状态
|
|
|
+ listCheckAllChange(check){
|
|
|
+ if(check){
|
|
|
+ // 全选
|
|
|
+ this.$refs.edbDataRef && this.$refs.edbDataRef.clearSelection()
|
|
|
+ this.$refs.edbDataRef && this.$refs.edbDataRef.toggleAllSelection()
|
|
|
+ }else{
|
|
|
+ //全不选
|
|
|
+ this.$refs.edbDataRef && this.$refs.edbDataRef.clearSelection()
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ //用户手动勾选数据行的 Checkbox 时触发的事件
|
|
|
+ selectHandle(selection, row){
|
|
|
+ console.log(selection, row);
|
|
|
+
|
|
|
+ let check=false
|
|
|
+ if(selection.some(it => it.IndexCode == row.IndexCode)){
|
|
|
+ // 勾选
|
|
|
+
|
|
|
+ }else{
|
|
|
+ // 取消勾选
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 用户手动勾选全选 Checkbox 时触发的事件
|
|
|
+ selectAllHandle(selection){
|
|
|
+ console.log(selection);
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
},
|
|
|
}
|
|
|
</script>
|
|
@@ -116,12 +245,20 @@ export default {
|
|
|
<style lang="scss">
|
|
|
.batch-computed-dialog{
|
|
|
max-width: 1200px;
|
|
|
- width:85vw;
|
|
|
+ width:90vw;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
.batch-computed-wrap{
|
|
|
.table-wrap{
|
|
|
margin-top: 50px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ .left-box{
|
|
|
+ width: 50%;
|
|
|
+ }
|
|
|
+ .right-box{
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</style>
|