接口自动化平台优化登录页面和首页； 项目看板增加多个统计数据和详细数据信息，看板布局和样式优化

hyb

2026-01-20 536b18a7c5d53d72d78ffab579ff24ac9146d5ab

 测试组/Test_platform/Interface_automation/frontend/src/pages/httprunner/DebugTalk.vue

@@ -18,6 +18,14 @@
                    @click="handleRunCode"
                    >在线运行</el-button
                >
                <el-button
                    round
                    icon="el-icon-document-copy"
                    type="success"
                    size="small"
                    @click="handleImportCode"
                    >插入其他项目代码</el-button
                >
            </div>
        </el-header>

@@ -44,6 +52,65 @@
        >
            <RunCodeResult :msg="resp.msg"></RunCodeResult>
        </el-drawer>

        <el-dialog
            title="插入其他项目代码"
            :visible.sync="importDialogVisible"
            width="70%"
            :close-on-click-modal="false"
        >
            <div style="margin-bottom: 20px;">
                <el-select
                    v-model="selectedProjectId"
                    placeholder="请选择项目"
                    filterable
                    @change="handleProjectChange"
                    style="width: 100%;"
                >
                    <el-option
                        v-for="project in projectList"
                        :key="project.id"
                        :label="project.name"
                        :value="project.id"
                    >
                        <span style="float: left">{{ project.name }}</span>
                        <span style="float: right; color: #8492a6; font-size: 13px">{{ project.responsible }}</span>
                    </el-option>
                </el-select>
            </div>

            <div v-if="selectedProjectCode" style="margin-bottom: 20px;">
                <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
                    <span style="font-weight: bold;">代码预览:</span>
                    <el-button
                        type="primary"
                        size="small"
                        icon="el-icon-document-copy"
                        @click="handleCopyAll"
                    >
                        全部复制
                    </el-button>
                </div>
                <el-input
                    type="textarea"
                    :rows="15"
                    v-model="selectedProjectCode"
                    readonly
                    style="font-family: 'Courier New', monospace;"
                ></el-input>
            </div>

            <span slot="footer" class="dialog-footer">
                <el-button @click="importDialogVisible = false">取 消</el-button>
                <el-button
                    type="primary"
                    @click="handleConfirmImport"
                    :disabled="!selectedProjectCode"
                >
                    确定插入
                </el-button>
            </span>
        </el-dialog>
    </el-container>
</template>

@@ -64,6 +131,10 @@
            editor: null,
            timeStamp: "",
            isShowDebug: false,
            importDialogVisible: false,
            projectList: [],
            selectedProjectId: "",
            selectedProjectCode: "",
            options: {
                selectOnLineNumbers: false,
                scrollbar: {
@@ -103,6 +174,50 @@
            this.$api.getDebugtalk(this.$route.params.id).then(resp => {
                this.code = resp;
            });
        },
        handleImportCode() {
            this.importDialogVisible = true;
            this.getProjectList();
        },
        getProjectList() {
            this.$api.getProjectList().then(resp => {
                this.projectList = resp.results || [];
            });
        },
        handleProjectChange(projectId) {
            if (projectId) {
                this.$api.getDebugtalk(projectId).then(resp => {
                    this.selectedProjectCode = resp.code || "";
                }).catch(err => {
                    this.$message.error("获取项目驱动代码失败");
                    this.selectedProjectCode = "";
                });
            }
        },
        handleCopyAll() {
            if (this.selectedProjectCode) {
                const textarea = document.createElement("textarea");
                textarea.value = this.selectedProjectCode;
                document.body.appendChild(textarea);
                textarea.select();
                try {
                    document.execCommand("copy");
                    this.$message.success("代码已复制到剪贴板");
                } catch (err) {
                    this.$message.error("复制失败，请手动复制");
                }
                document.body.removeChild(textarea);
            }
        },
        handleConfirmImport() {
            if (this.selectedProjectCode && this.editor) {
                const currentCode = this.editor.getValue();
                const newCode = currentCode + "\n\n" + this.selectedProjectCode;
                this.editor.setValue(newCode);
                this.code.code = newCode;
                this.$message.success("代码已插入");
                this.importDialogVisible = false;
            }
        }
    },
    watch: {