电签角色库修改

src/views/digital/signer.vue

@@ -71,6 +71,7 @@
                                 prop="name"
                                 label="字符类型"
                                >
+                        
                                 </el-table-column>
                                 <el-table-column
                                 prop="address"
@@ -143,18 +144,35 @@
                                 label="字符类型"
                                >
                                <template slot-scope="scope">
-                                
-                               </template>
+                                    <el-select
+                                    v-model="scope.row.elementType"
+                                    disabled
+                                    size="small"
+                                    placeholder="请选择"
+                                    >
+                                    <el-option
+                                        v-for="item in dataTypeList"
+                                        :key="item.id"
+                                        :label="item.dictValue"
+                                        :value="item.dictKey"
+                                    ></el-option>
+                                    </el-select>
+                                </template>
                                 </el-table-column>
                                 <el-table-column
                                 prop="address"
                                 label="元素来源"
                                >
+                               <template slot-scope="scope">
+                                <el-link type="primary" @click="eleCheck(scope.row)">请选择</el-link>
+                               </template>
                                 </el-table-column>
                                 <el-table-column
                                 prop="address"
                                 label="绑定岗位"
-                               >
+                               >   <template slot-scope="scope">
+                                <el-link type="primary" @click="selectPost(scope.row)">请选择</el-link>
+                               </template>
                                 </el-table-column>
                                 <el-table-column
                                     prop="tag"
@@ -162,23 +180,122 @@
                                     width="100"
                                     >
                                     <template slot-scope="scope">
-                                        <!-- <el-tag
-                                        :type="scope.row.tag === '家' ? 'primary' : 'success'"
-                                        disable-transitions>{{scope.row.tag}}</el-tag> -->
-                                    </template>
+                                    <el-button type="text" @click="handleAdd(scope.row)">
+                                        <i class="el-icon-circle-plus-outline" style="font-size: 20px;color:#67C23A"></i>
+                                    </el-button>
+                                    <el-button type="text" @click="handleDelete(scope.row)">
+                                        <i class="el-icon-remove-outline" style="font-size: 20px;color:red"></i>
+                                    </el-button>
+                                </template>
                                     </el-table-column>
                             </el-table>
            </div>
             <span slot="footer" class="dialog-footer">
-                <el-button @click="dialogVisible = false">取 消</el-button>
-                <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+                <el-button @click="addDialogVisible = false">取 消</el-button>
+                <el-button type="primary" @click="addDialogVisible = false">确 定</el-button>
             </span>
             </el-dialog>
+            <!-- 选择元素来源 -->
+            <el-dialog
+            append-to-body
+                title="选择元素来源"
+                :visible.sync="sourceDialogVisible"
+                width="30%"
+                :before-close="handleSourceClose">
+                <div>
+                    <p class="tip-text" >
+                        提示：配置之后会把所有元素表该元素字段都自动配置电签岗位对应关系。
+                    </p>
+                   <div class="source-radio-group">
+                    <el-radio-group v-model="selectedSourceOption">
+                        <el-radio :label="1">适配所有元素表</el-radio>
+                        <el-radio :label="2">部分元素表</el-radio>
+                    </el-radio-group>
+                   </div>
+                 <!-- 并行显示的下拉框 -->
+                        <div v-if="selectedSourceOption === 2" class="dropdown-container">
+                            <el-select v-model="elementCategorySelect" placeholder="请选择表分类" style="flex: 1; margin-right: 10px;" clearable>
+                                <el-option
+                                    v-for="item in elementCategoryOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value">
+                                </el-option>
+                            </el-select>
+                            <el-select v-model="elementTableNameSelect" placeholder="请输入元素表名称进行模糊检索" style="flex: 1;" filterable clearable >
+                                <el-option
+                                    v-for="item in elementTableOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value">
+                                </el-option>
+                            </el-select>
+                        </div>
+                        <div v-if="selectedSourceOption === 2" class="element-list-container">
+                            <el-scrollbar> <!-- 18行 * 每行30px = 540px -->
+                                <ul class="element-checkbox-list">
+                                    <li v-for="(item, index) in elementList" :key="index" class="element-item">
+                                        <el-checkbox v-model="item.checked">{{ item.name }}</el-checkbox>
+                                    </li>
+                                </ul>
+                            </el-scrollbar>
+                        </div>
+                </div>
+                <span slot="footer" class="dialog-footer">
+                    <el-button @click="sourceDialogVisible = false">取 消</el-button>
+                    <el-button type="primary" @click="confirmSourceSelection">确 定</el-button>
+                </span>
+            </el-dialog>
+            <!-- 绑定岗位弹窗 -->
+            <el-dialog
+                append-to-body
+                title="绑定岗位"
+                :visible.sync="bindPostDialogVisible"
+                width="50%"
+                :before-close="handleBindPostClose">
+                <div class="bind-post-content">
+                    <!-- 参建方分类 + 岗位名称下拉框 -->
+                    <div class="dropdown-pair">
+                        <el-select v-model="partyCategorySelect" placeholder="请选择参建方分类" style="flex: 1; margin-right: 10px;">
+                            <el-option
+                                v-for="item in partyCategoryOptions"
+                                :key="item.value"
+                                :label="item.label"
+                                :value="item.value">
+                            </el-option>
+                        </el-select>
+                        <el-select v-model="positionNameSelect" filterable placeholder="请输入岗位名称进行模糊检索" style="flex: 1;">
+                            <el-option
+                                v-for="item in positionNameOptions"
+                                :key="item.value"
+                                :label="item.label"
+                                :value="item.value">
+                            </el-option>
+                        </el-select>
+                    </div>
+
+                    <!-- 岗位列表 -->
+                    <div class="position-list-container">
+                        <el-scrollbar > <!-- 18行 * 30px = 540px -->
+                            <ul class="position-checkbox-list">
+                                <li v-for="(item, index) in positionList" :key="index" class="position-item">
+                                    <el-checkbox v-model="item.checked">{{ item.name }}</el-checkbox>
+                                </li>
+                            </ul>
+                        </el-scrollbar>
+                    </div>
+                </div>
+                <span slot="footer" class="dialog-footer">
+                    <el-button @click="bindPostDialogVisible = false">取 消</el-button>
+                    <el-button type="primary" @click="confirmBindPostSelection">确 定</el-button>
+                </span>
+            </el-dialog>
     </basic-container>
 </template>
 
 <script>
   import {getRoleList,getListPage,getElementList} from "@/api/sigital/signer.js";
+  import { getDictionary } from "@/api/system/dict";
     export default {
         data() {
             return {
@@ -197,7 +314,44 @@
                 tableData1: [{}],
                 eleOptions: [
                   
-                ]
+                ],
+                dataTypeList: [],
+                sourceDialogVisible: false, // 控制弹窗显示
+                eleCheckRow: {},
+                selectedSourceOption: 1, // 默认选中 "适配所有元素表"
+                elementCategorySelect: '', // 元素分类表分类选中值
+                elementTableNameSelect: '', // 元素表名称筛选选中值
+                elementCategoryOptions: [
+                    // 元素分类表分类选项数据
+                    { value: 'category1', label: '分类1' },
+                    { value: 'category2', label: '分类2' }
+                ],
+                elementTableOptions: [
+                    // 元素表名称筛选选项数据
+                    { value: 'table1', label: '表1' },
+                    { value: 'table2', label: '表2' }
+                ],
+                elementList: Array.from({ length: 30 }, (_, i) => ({
+                    name: `元素表名称 ${i + 1}`,
+                    checked: false
+                })),
+                bindPostDialogVisible: false,
+                partyCategorySelect: '', // 参建方分类选中值
+                positionNameSelect: '', // 岗位名称选中值
+                partyCategoryOptions: [
+                    { value: 'contractor', label: '施工单位' },
+                    { value: 'supervisor', label: '监理单位' },
+                    { value: 'owner', label: '业主单位' }
+                ],
+                positionNameOptions: [
+                    { value: 'manager', label: '项目经理' },
+                    { value: 'supervise', label: '现场监理' },
+                    { value: 'engineer', label: '技术负责人' }
+                ],
+                positionList: Array.from({ length: 20 }, (_, i) => ({
+                    name: `岗位名称 ${i + 1}`,
+                    checked: false
+                })),
             }
         },
         methods: {
@@ -275,12 +429,83 @@
                         
                     }
                 });
-            }
+            },
+            getDataTypelist() {
+                if (this.dataTypeList.length > 1) {
+                    return;
+                }
+                getDictionary({
+                    code: "data_type",
+                }).then((res) => {
+                    res.data.data.forEach((element) => {
+                    element.dictKey = Number(element.dictKey);
+                    });
+                    this.dataTypeList = res.data.data;
+                });
+            },
+            handleAdd(row) {
+                console.log('新增', row);
+                // 新增操作的逻辑
+            },
+            handleDelete(row) {
+                console.log('删除', row);
+                // 删除操作的逻辑
+            },
+            //选择元素来源
+            eleCheck(row) {
+              console.log('选择元素来源');
+              this.eleCheckRow = row;
+              this.sourceDialogVisible = true;
+              
+            },
+                    // 弹窗关闭时的回调
+            handleSourceClose(done) {
+                this.sourceDialogVisible = false;
+                done();
+            },
+            // 确认按钮点击事件
+            confirmSourceSelection() {
+                if (this.selectedSourceOption === 1) {
+                    // 处理适配所有元素表的逻辑
+                    console.log("适配所有元素表");
+                    this.eleCheckRow.tableType = 1;
+                } else {
+                    // 处理适配部分元素表的逻辑
+                    console.log("适配部分元素表");
+                    this.eleCheckRow.tableType = 2
+                }
+                
+                // 关闭弹窗
+                this.sourceDialogVisible = false;
+            },
+            // 打开绑定岗位弹窗
+            selectPost(row) {
+                this.bindPostDialogVisible = true;
+                this.selectedPostRow = row;
+            },
+
+            // 弹窗关闭回调
+            handleBindPostClose(done) {
+                this.bindPostDialogVisible = false;
+                done();
+            },
+
+            // 确认选择岗位
+            confirmBindPostSelection() {
+                const selectedPositions = this.positionList.filter(item => item.checked);
+                console.log('选中的岗位:', selectedPositions);
+
+                // 示例：将选中岗位赋值给当前行
+                this.selectedPostRow.selectedPositions = selectedPositions.map(i => i.name);
+
+                this.bindPostDialogVisible = false;
+            },
+    
         },
         mounted() {
-            this.getRoleData();
-            this.getTableData();
-            this.getEleOptions();
+            // this.getRoleData();
+            // this.getTableData();
+            // this.getEleOptions();
         },
         components: {}
     }
@@ -377,4 +602,61 @@
         }
     }
 }
+.tip-text {
+margin-top: -20px;
+    color: red;
+  
+}
+.source-radio-group{
+    margin-top: 40px;
+    text-align: center;
+}
+.dropdown-container {
+    display: flex;
+    margin-top: 20px;
+}
+.element-list-container {
+    margin-top: 20px;
+    height: 300px;
+    overflow-y: auto
+}
+
+.element-checkbox-list {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+.element-item {
+    line-height: 30px;
+    padding-left: 10px;
+}
+
+.bind-post-content {
+    padding-bottom: 20px;
+}
+
+.dropdown-pair {
+    display: flex;
+    margin-bottom: 20px;
+}
+
+.position-list-container {
+    border: 1px solid #e4e7ed;
+    border-radius: 4px;
+    padding: 10px;
+    height: 300px;
+    overflow-y: auto;
+}
+
+.position-checkbox-list {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+.position-item {
+    line-height: 30px;
+    padding-left: 10px;
+}
 </style>