|
|
| 第1行： |
第1行： |
| {{ResourceLoader|Partner.js}} | | {{ResourceLoader|Partner.js}} |
| {{#css:
| |
| .agent-manager {
| |
| font-family: sans-serif;
| |
| max-width: 1200px;
| |
| margin: 0 auto;
| |
| padding: 20px;
| |
| }
| |
|
| |
| .agent-section {
| |
| background: white;
| |
| padding: 20px;
| |
| border-radius: 8px;
| |
| box-shadow: 0 2px 4px rgba(0,0,0,0.1);
| |
| }
| |
|
| |
| .agent-section h3 {
| |
| margin-top: 0;
| |
| color: #333;
| |
| border-bottom: 2px solid #0645ad;
| |
| padding-bottom: 10px;
| |
| }
| |
|
| |
| .agent-section h4 {
| |
| color: #555;
| |
| margin-top: 25px;
| |
| margin-bottom: 15px;
| |
| padding-bottom: 8px;
| |
| border-bottom: 1px solid #ddd;
| |
| }
| |
|
| |
| .agent-tabs {
| |
| display: flex;
| |
| gap: 10px;
| |
| margin-bottom: 20px;
| |
| border-bottom: 2px solid #ddd;
| |
| }
| |
|
| |
| .agent-tab {
| |
| padding: 10px 20px;
| |
| cursor: pointer;
| |
| background: #f5f5f5;
| |
| border: 1px solid #ddd;
| |
| border-bottom: none;
| |
| border-radius: 4px 4px 0 0;
| |
| transition: all 0.3s;
| |
| }
| |
|
| |
| .agent-tab:hover {
| |
| background: #e5e5e5;
| |
| }
| |
|
| |
| .agent-tab.active {
| |
| background: white;
| |
| border-bottom: 2px solid white;
| |
| margin-bottom: -2px;
| |
| font-weight: bold;
| |
| color: #0645ad;
| |
| }
| |
|
| |
| .agent-tab-content {
| |
| display: none;
| |
| animation: fadeIn 0.3s;
| |
| }
| |
|
| |
| .agent-tab-content.active {
| |
| display: block;
| |
| }
| |
|
| |
| @keyframes fadeIn {
| |
| from { opacity: 0; }
| |
| to { opacity: 1; }
| |
| }
| |
|
| |
| .agent-button {
| |
| display: inline-block;
| |
| padding: 10px 20px;
| |
| margin: 5px;
| |
| background: #0645ad;
| |
| color: white;
| |
| border: none;
| |
| border-radius: 4px;
| |
| cursor: pointer;
| |
| font-size: 14px;
| |
| transition: all 0.3s;
| |
| }
| |
|
| |
| .agent-button:hover {
| |
| background: #0b5ed7;
| |
| transform: translateY(-2px);
| |
| box-shadow: 0 2px 8px rgba(6, 69, 173, 0.3);
| |
| }
| |
|
| |
| .agent-button.secondary {
| |
| background: #6c757d;
| |
| }
| |
|
| |
| .agent-button.secondary:hover {
| |
| background: #5a6268;
| |
| }
| |
|
| |
| .agent-form-group {
| |
| margin-bottom: 15px;
| |
| }
| |
|
| |
| .agent-form-group label {
| |
| display: block;
| |
| margin-bottom: 5px;
| |
| font-weight: bold;
| |
| color: #333;
| |
| font-size: 13px;
| |
| }
| |
|
| |
| .agent-input,
| |
| .agent-select,
| |
| .agent-textarea {
| |
| width: 100%;
| |
| padding: 8px 12px;
| |
| border: 1px solid #ddd;
| |
| border-radius: 4px;
| |
| font-size: 14px;
| |
| box-sizing: border-box;
| |
| transition: border-color 0.3s;
| |
| }
| |
|
| |
| .agent-input:focus,
| |
| .agent-select:focus,
| |
| .agent-textarea:focus {
| |
| outline: none;
| |
| border-color: #0645ad;
| |
| box-shadow: 0 0 0 3px rgba(6, 69, 173, 0.1);
| |
| }
| |
|
| |
| .agent-select {
| |
| cursor: pointer;
| |
| background-color: white;
| |
| background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
| |
| background-repeat: no-repeat;
| |
| background-position: right 10px center;
| |
| padding-right: 35px;
| |
| appearance: none;
| |
| -webkit-appearance: none;
| |
| -moz-appearance: none;
| |
| }
| |
|
| |
| .agent-textarea {
| |
| min-height: 80px;
| |
| resize: vertical;
| |
| font-family: monospace;
| |
| }
| |
|
| |
| .agent-field-row {
| |
| display: grid;
| |
| grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
| |
| gap: 15px;
| |
| }
| |
|
| |
| .agent-grid {
| |
| display: grid;
| |
| grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
| |
| gap: 10px;
| |
| margin-top: 15px;
| |
| }
| |
|
| |
| .agent-list-item {
| |
| padding: 15px;
| |
| background: #f8f9fa;
| |
| border: 1px solid #ddd;
| |
| border-radius: 4px;
| |
| cursor: pointer;
| |
| transition: all 0.3s;
| |
| }
| |
|
| |
| .agent-list-item:hover {
| |
| background: #e9ecef;
| |
| border-color: #0645ad;
| |
| transform: translateY(-2px);
| |
| box-shadow: 0 2px 8px rgba(0,0,0,0.1);
| |
| }
| |
|
| |
| .agent-message {
| |
| padding: 12px 15px;
| |
| margin: 10px 0;
| |
| border-radius: 4px;
| |
| animation: slideDown 0.3s;
| |
| }
| |
|
| |
| @keyframes slideDown {
| |
| from {
| |
| opacity: 0;
| |
| transform: translateY(-10px);
| |
| }
| |
| to {
| |
| opacity: 1;
| |
| transform: translateY(0);
| |
| }
| |
| }
| |
|
| |
| .agent-message.success {
| |
| background: #d4edda;
| |
| color: #155724;
| |
| border: 1px solid #c3e6cb;
| |
| }
| |
|
| |
| .agent-message.error {
| |
| background: #f8d7da;
| |
| color: #721c24;
| |
| border: 1px solid #f5c6cb;
| |
| }
| |
|
| |
| .agent-message.info {
| |
| background: #d1ecf1;
| |
| color: #0c5460;
| |
| border: 1px solid #bee5eb;
| |
| }
| |
|
| |
| .agent-loading {
| |
| text-align: center;
| |
| padding: 40px;
| |
| color: #666;
| |
| font-size: 16px;
| |
| }
| |
|
| |
| .agent-loading::after {
| |
| content: '...';
| |
| animation: dots 1.5s infinite;
| |
| }
| |
|
| |
| @keyframes dots {
| |
| 0%, 20% { content: '.'; }
| |
| 40% { content: '..'; }
| |
| 60%, 100% { content: '...'; }
| |
| }
| |
|
| |
| @media (max-width: 768px) {
| |
| .agent-field-row {
| |
| grid-template-columns: 1fr;
| |
| }
| |
|
| |
| .agent-grid {
| |
| grid-template-columns: 1fr;
| |
| }
| |
|
| |
| .agent-tabs {
| |
| flex-direction: column;
| |
| }
| |
|
| |
| .agent-tab {
| |
| border-radius: 4px;
| |
| border: 1px solid #ddd;
| |
| }
| |
|
| |
| .agent-tab.active {
| |
| margin-bottom: 0;
| |
| }
| |
| }
| |
| }}
| |