diff --git a/src/api/image-management.js b/src/api/image-management.js
new file mode 100644
index 0000000..2fe46fe
--- /dev/null
+++ b/src/api/image-management.js
@@ -0,0 +1,75 @@
+import request from '@/utils/request'
+
+// 获取图像管理列表
+export function getImageList(params) {
+  return request({
+    url: '/image-model/page',
+    method: 'post',
+    params: params // 使用params而不是data，这样参数会作为URL查询参数传递
+  })
+}
+
+// 获取图像详情
+export function getImageDetail(id) {
+  return request({
+    url: `/api/image-management/${id}`,
+    method: 'get'
+  })
+}
+
+// 创建图像
+export function createImage(data) {
+  return request({
+    url: '/api/image-management',
+    method: 'post',
+    data
+  })
+}
+
+// 更新图像
+export function updateImage(id, data) {
+  return request({
+    url: `/api/image-management/${id}`,
+    method: 'put',
+    data
+  })
+}
+
+// 删除图像
+export function deleteImage(uuid) {
+  return request({
+    url: `/image-model/delete/${uuid}`,
+    method: 'delete'
+  })
+}
+
+// 批量删除图像
+export function batchDeleteImages(ids) {
+  return request({
+    url: '/api/image-management/batch-delete',
+    method: 'post',
+    data: { ids }
+  })
+}
+
+// 上传素材
+export function uploadMaterial(formData, params = {}) {
+  return request({
+    url: '/image-model/upload',
+    method: 'post',
+    data: formData,
+    params: params, // 添加查询参数
+    headers: {
+      'Content-Type': 'multipart/form-data'
+    }
+  })
+}
+
+// 去除水印
+export function removeWatermark(data) {
+  return request({
+    url: '/image-model/removeWatermar',
+    method: 'post',
+    data
+  })
+}
diff --git a/src/api/legal-model.js b/src/api/legal-model.js
new file mode 100644
index 0000000..8d8f7a7
--- /dev/null
+++ b/src/api/legal-model.js
@@ -0,0 +1,42 @@
+import request from '@/utils/request'
+
+/**
+ * 法律模型咨询API
+ * @param {Object} data 咨询数据
+ * @param {string} data.consultationType 咨询类型
+ * @param {string} data.model 法律模型
+ * @param {string} data.coreDemand 核心诉求
+ * @param {string} data.consultationPurpose 咨询目的
+ * @param {string} data.inputText 咨询内容
+ * @returns {Promise} 返回咨询结果
+ */
+export function legalConsult(data) {
+  return request({
+    url: '/translation/legal',
+    method: 'post',
+    data: data,
+    timeout: 50000 // 设置50秒超时
+  })
+}
+
+/**
+ * 获取法律模型列表
+ * @returns {Promise} 返回模型列表
+ */
+export function getLegalModels() {
+  return request({
+    url: '/legal/models',
+    method: 'get'
+  })
+}
+
+/**
+ * 获取咨询类型列表
+ * @returns {Promise} 返回咨询类型列表
+ */
+export function getConsultationTypes() {
+  return request({
+    url: '/api/legal/consultation-types',
+    method: 'get'
+  })
+}
diff --git a/src/components/Pagination/index.vue b/src/components/Pagination/index.vue
new file mode 100644
index 0000000..f246640
--- /dev/null
+++ b/src/components/Pagination/index.vue
@@ -0,0 +1,101 @@
+<template>
+  <div :class="{ 'hidden': hidden }" class="pagination-container">
+    <el-pagination
+      :background="background"
+      :current-page.sync="currentPage"
+      :page-size.sync="pageSize"
+      :layout="layout"
+      :page-sizes="pageSizes"
+      :total="total"
+      v-bind="$attrs"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+    />
+  </div>
+</template>
+
+<script>
+import { scrollTo } from '@/utils/scroll-to'
+
+export default {
+  name: 'Pagination',
+  props: {
+    total: {
+      required: true,
+      type: Number
+    },
+    page: {
+      type: Number,
+      default: 1
+    },
+    limit: {
+      type: Number,
+      default: 20
+    },
+    pageSizes: {
+      type: Array,
+      default() {
+        return [10, 20, 30, 50]
+      }
+    },
+    layout: {
+      type: String,
+      default: 'total, sizes, prev, pager, next, jumper'
+    },
+    background: {
+      type: Boolean,
+      default: true
+    },
+    autoScroll: {
+      type: Boolean,
+      default: true
+    },
+    hidden: {
+      type: Boolean,
+      default: false
+    }
+  },
+  computed: {
+    currentPage: {
+      get() {
+        return this.page
+      },
+      set(val) {
+        this.$emit('update:page', val)
+      }
+    },
+    pageSize: {
+      get() {
+        return this.limit
+      },
+      set(val) {
+        this.$emit('update:limit', val)
+      }
+    }
+  },
+  methods: {
+    handleSizeChange(val) {
+      this.$emit('pagination', { page: this.currentPage, limit: val })
+      if (this.autoScroll) {
+        scrollTo(0, 800)
+      }
+    },
+    handleCurrentChange(val) {
+      this.$emit('pagination', { page: val, limit: this.pageSize })
+      if (this.autoScroll) {
+        scrollTo(0, 800)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.pagination-container {
+  background: #fff;
+  padding: 32px 16px;
+}
+.pagination-container.hidden {
+  display: none;
+}
+</style>
diff --git a/src/directive/waves/index.js b/src/directive/waves/index.js
new file mode 100644
index 0000000..5036af5
--- /dev/null
+++ b/src/directive/waves/index.js
@@ -0,0 +1,66 @@
+import './waves.css'
+
+const context = '@@wavesContext'
+
+function handleClick(el, binding) {
+  function handle(e) {
+    const customOpts = Object.assign({}, binding.value)
+    const opts = Object.assign({
+      ele: el, // 波纹作用元素
+      type: 'hit', // hit 点击位置扩散 center中心点扩展
+      color: 'rgba(0, 0, 0, 0.15)' // 波纹颜色
+    },
+    customOpts
+    )
+    const target = opts.ele
+    if (target) {
+      target.style.position = 'relative'
+      target.style.overflow = 'hidden'
+      const rect = target.getBoundingClientRect()
+      let ripple = target.querySelector('.waves-ripple')
+      if (!ripple) {
+        ripple = document.createElement('span')
+        ripple.className = 'waves-ripple'
+        ripple.style.height = ripple.style.width = Math.max(rect.width, rect.height) + 'px'
+        target.appendChild(ripple)
+      } else {
+        ripple.className = 'waves-ripple'
+      }
+      switch (opts.type) {
+        case 'center':
+          ripple.style.top = (rect.height / 2 - ripple.offsetHeight / 2) + 'px'
+          ripple.style.left = (rect.width / 2 - ripple.offsetWidth / 2) + 'px'
+          break
+        default:
+          ripple.style.top = (e.pageY - rect.top - ripple.offsetHeight / 2 - document.documentElement.scrollTop || document.body.scrollTop) + 'px'
+          ripple.style.left = (e.pageX - rect.left - ripple.offsetWidth / 2 - document.documentElement.scrollLeft || document.body.scrollLeft) + 'px'
+      }
+      ripple.style.backgroundColor = opts.color
+      ripple.className = 'waves-ripple z-active'
+      return false
+    }
+  }
+  if (!el[context]) {
+    el[context] = {
+      removeHandle: handle
+    }
+  } else {
+    el[context].removeHandle = handle
+  }
+  return handle
+}
+
+export default {
+  bind(el, binding) {
+    el.addEventListener('click', handleClick(el, binding), false)
+  },
+  update(el, binding) {
+    el.removeEventListener('click', el[context].removeHandle, false)
+    el.addEventListener('click', handleClick(el, binding), false)
+  },
+  unbind(el) {
+    el.removeEventListener('click', el[context].removeHandle, false)
+    el[context] = null
+    delete el[context]
+  }
+}
diff --git a/src/directive/waves/waves.css b/src/directive/waves/waves.css
new file mode 100644
index 0000000..b8b0989
--- /dev/null
+++ b/src/directive/waves/waves.css
@@ -0,0 +1,26 @@
+.waves-ripple {
+  position: absolute;
+  border-radius: 100%;
+  background-color: rgba(0, 0, 0, 0.15);
+  background-clip: padding-box;
+  pointer-events: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  -webkit-transform: scale(0);
+  -ms-transform: scale(0);
+  transform: scale(0);
+  opacity: 1;
+}
+
+.waves-ripple.z-active {
+  opacity: 0;
+  -webkit-transform: scale(2);
+  -ms-transform: scale(2);
+  transform: scale(2);
+  -webkit-transition: opacity 0.8s ease-out, -webkit-transform 0.8s ease-out;
+  transition: opacity 0.8s ease-out, -webkit-transform 0.8s ease-out;
+  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
+  transition: opacity 0.8s ease-out, transform 0.8s ease-out, -webkit-transform 0.8s ease-out;
+}
diff --git a/src/router/index.js b/src/router/index.js
index ade7452..e172a74 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -288,6 +288,52 @@ export const constantRoutes = [
         name: 'Translation',
         component: () => import('@/views/text-model/translation'),
         meta: { title: '翻译模型', icon: 'el-icon-translation' }
+      },
+      {
+        path: 'legal-model',
+        name: 'LegalModel',
+        component: () => import('@/views/text-model/legal-model'),
+        meta: { title: '法律模型', icon: 'el-icon-scale' }
+      }
+    ]
+  },
+
+  {
+    path: '/image-model',
+    component: Layout,
+    redirect: '/image-model/background-model',
+    name: 'ImageModelRoot',
+    meta: { title: '图像模型', icon: 'el-icon-picture' },
+    children: [
+      {
+        path: 'image-list',
+        name: 'ImageList',
+        component: () => import('@/views/image-model/image-list'),
+        meta: { title: '图像管理列表', icon: 'el-icon-picture' }
+      },
+      {
+        path: 'poster-generation',
+        name: 'PosterGeneration',
+        component: () => import('@/views/image-model/poster-generation'),
+        meta: { title: '海报生成', icon: 'el-icon-picture-outline-round' }
+      },
+      {
+        path: 'remove-watermark',
+        name: 'RemoveWatermark',
+        component: () => import('@/views/image-model/remove-watermark'),
+        meta: { title: '去除水印', icon: 'el-icon-brush' }
+      },
+      {
+        path: 'background-model',
+        name: 'BackgroundModel',
+        component: () => import('@/views/image-model/background-model'),
+        meta: { title: '图像背景模型', icon: 'el-icon-picture-outline' }
+      },
+      {
+        path: 'virtual-model',
+        name: 'VirtualModel',
+        component: () => import('@/views/image-model/virtual-model'),
+        meta: { title: '虚拟模特儿模型', icon: 'el-icon-user' }
       }
     ]
   },
diff --git a/src/utils/scroll-to.js b/src/utils/scroll-to.js
new file mode 100644
index 0000000..c5d8e04
--- /dev/null
+++ b/src/utils/scroll-to.js
@@ -0,0 +1,58 @@
+Math.easeInOutQuad = function(t, b, c, d) {
+  t /= d / 2
+  if (t < 1) {
+    return c / 2 * t * t + b
+  }
+  t--
+  return -c / 2 * (t * (t - 2) - 1) + b
+}
+
+// requestAnimationFrame for Smart Animating http://goo.gl/sx5sts
+var requestAnimFrame = (function() {
+  return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function(callback) { window.setTimeout(callback, 1000 / 60) }
+})()
+
+/**
+ * Because it's so fucking difficult to detect the scrolling element, just move them all
+ * @param {number} amount
+ */
+function move(amount) {
+  document.documentElement.scrollTop = amount
+  document.body.parentNode.scrollTop = amount
+  document.body.scrollTop = amount
+}
+
+function position() {
+  return document.documentElement.scrollTop || document.body.parentNode.scrollTop || document.body.scrollTop
+}
+
+/**
+ * @param {number} to
+ * @param {number} duration
+ * @param {Function} callback
+ */
+export function scrollTo(to, duration, callback) {
+  const start = position()
+  const change = to - start
+  const increment = 20
+  let currentTime = 0
+  duration = (typeof (duration) === 'undefined') ? 500 : duration
+  var animateScroll = function() {
+    // increment the time
+    currentTime += increment
+    // find the value with the quadratic in-out easing function
+    var val = Math.easeInOutQuad(currentTime, start, change, duration)
+    // move the document.body
+    move(val)
+    // do the animation unless its over
+    if (currentTime < duration) {
+      requestAnimFrame(animateScroll)
+    } else {
+      if (callback && typeof (callback) === 'function') {
+        // the animation is done so lets callback
+        callback()
+      }
+    }
+  }
+  animateScroll()
+}
diff --git a/src/views/image-model/background-model.vue b/src/views/image-model/background-model.vue
new file mode 100644
index 0000000..22261d5
--- /dev/null
+++ b/src/views/image-model/background-model.vue
@@ -0,0 +1,26 @@
+<template>
+  <div class="app-container">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>图像背景模型</span>
+      </div>
+
+      <div class="content">
+        <el-empty description="功能建设中，敬请期待" />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'BackgroundModel'
+}
+</script>
+
+<style scoped>
+.content {
+  padding: 20px 0;
+}
+</style>
+
diff --git a/src/views/image-model/image-list.vue b/src/views/image-model/image-list.vue
new file mode 100644
index 0000000..f7196d1
--- /dev/null
+++ b/src/views/image-model/image-list.vue
@@ -0,0 +1,910 @@
+<template>
+  <div class="app-container">
+    <!-- 搜索区域 -->
+    <div class="filter-container">
+      <el-input
+        v-model="listQuery.imageName"
+        placeholder="图像名称"
+        style="width: 200px;"
+        class="filter-item"
+        @keyup.enter.native="handleFilter"
+      />
+      <el-input
+        v-model="listQuery.modelName"
+        placeholder="模型名称"
+        style="width: 200px;"
+        class="filter-item"
+        @keyup.enter.native="handleFilter"
+      />
+      <el-input
+        v-model="listQuery.ownerName"
+        placeholder="所属人姓名"
+        style="width: 200px;"
+        class="filter-item"
+        @keyup.enter.native="handleFilter"
+      />
+      <el-input
+        v-model="listQuery.ownerPhone"
+        placeholder="所属人电话"
+        style="width: 200px;"
+        class="filter-item"
+        @keyup.enter.native="handleFilter"
+      />
+      <el-select
+        v-model="listQuery.imageType"
+        placeholder="图片类型"
+        clearable
+        style="width: 200px;"
+        class="filter-item"
+      >
+        <el-option label="全部" value="" />
+        <el-option label="背景图" value="background" />
+        <el-option label="人物图" value="person" />
+        <el-option label="产品图" value="product" />
+        <el-option label="素材图" value="material" />
+        <el-option label="其他" value="other" />
+      </el-select>
+      <el-button
+        v-waves
+        class="filter-item"
+        type="primary"
+        icon="el-icon-search"
+        @click="handleFilter"
+      >
+        搜索
+      </el-button>
+      <el-button
+        class="filter-item"
+        style="margin-left: 10px;"
+        type="primary"
+        icon="el-icon-plus"
+        @click="handleCreate"
+      >
+        新增
+      </el-button>
+      <el-button
+        class="filter-item"
+        type="success"
+        icon="el-icon-upload"
+        @click="handleUpload"
+      >
+        上传素材
+      </el-button>
+      <el-button
+        v-if="multipleSelection.length > 0"
+        class="filter-item"
+        type="danger"
+        icon="el-icon-delete"
+        @click="handleBatchDelete"
+      >
+        批量删除
+      </el-button>
+    </div>
+
+    <!-- 表格区域 -->
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      element-loading-text="Loading"
+      border
+      fit
+      highlight-current-row
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column
+        type="selection"
+        width="55"
+        align="center"
+      />
+      <el-table-column align="center" label="序号" width="80">
+        <template slot-scope="scope">
+          {{ (listQuery.current - 1) * listQuery.size + scope.$index + 1 }}
+        </template>
+      </el-table-column>
+      <el-table-column label="图像名称" min-width="150">
+        <template slot-scope="scope">
+          <span>{{ scope.row.imageName }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="模型名称" min-width="120">
+        <template slot-scope="scope">
+          <span>{{ scope.row.modelName }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="所属人" min-width="100">
+        <template slot-scope="scope">
+          <span>{{ scope.row.ownerName }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="联系电话" min-width="120">
+        <template slot-scope="scope">
+          <span>{{ scope.row.ownerPhone }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="图片类型" width="100" align="center">
+        <template slot-scope="scope">
+          <el-tag :type="getImageTypeTag(scope.row.imageType)">
+            {{ getImageTypeText(scope.row.imageType) }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="素材图片" width="100" align="center">
+        <template slot-scope="scope">
+          <el-button
+            v-if="scope.row.materialTempUrl"
+            type="text"
+            size="small"
+            @click="openMaterialUrl( scope.row.materialTempUrl)"
+          >
+            查看
+          </el-button>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="成品图片" width="100" align="center">
+        <template slot-scope="scope">
+          <el-button
+            v-if="scope.row.resultImageTempUrl "
+            type="text"
+            size="small"
+            @click="previewImage(scope.row.resultImageTempUrl)"
+          >
+            查看
+          </el-button>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="提示词" min-width="200" show-overflow-tooltip>
+        <template slot-scope="scope">
+          <span>{{ scope.row.prompt || '-' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="功能函数" min-width="120" show-overflow-tooltip>
+        <template slot-scope="scope">
+          <span>{{ scope.row.functionName || '-' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="放大倍数" width="100" align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.scaleFactor || '-' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="更新时间" width="160" align="center">
+        <template slot-scope="scope">
+          <span>{{ formatDateTime(scope.row.updateTime) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="280" align="center">
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click="handleView(scope.row)"
+          >
+            查看
+          </el-button>
+          <el-button
+            type="text"
+            size="small"
+            @click="handleEdit(scope.row)"
+          >
+            编辑
+          </el-button>
+          <el-button
+            type="text"
+            size="small"
+            style="color: #409eff;"
+            @click="handleRemoveWatermark(scope.row)"
+          >
+            去除水印
+          </el-button>
+          <el-button
+            type="text"
+            size="small"
+            style="color: #f56c6c;"
+            @click="handleDelete(scope.row)"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页 -->
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="listQuery.current"
+      :limit.sync="listQuery.size"
+      @pagination="getList"
+    />
+
+    <!-- 图片预览对话框 -->
+    <el-dialog
+      title="图片预览"
+      :visible.sync="previewDialogVisible"
+      width="60%"
+      center
+    >
+      <div style="text-align: center;">
+        <img
+          v-if="previewImageUrl"
+          :src="previewImageUrl"
+          style="max-width: 100%; max-height: 500px;"
+          alt="预览图片"
+        >
+      </div>
+    </el-dialog>
+
+    <!-- 新增/编辑对话框 -->
+    <el-dialog
+      :title="dialogTitle"
+      :visible.sync="dialogVisible"
+      width="60%"
+      center
+    >
+      <el-form
+        ref="dataForm"
+        :rules="rules"
+        :model="temp"
+        label-position="left"
+        label-width="120px"
+        style="width: 100%;"
+      >
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="图像名称" prop="imageName">
+              <el-input v-model="temp.imageName" placeholder="请输入图像名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="模型名称" prop="modelName">
+              <el-input v-model="temp.modelName" placeholder="请输入模型名称" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="所属人姓名" prop="ownerName">
+              <el-input v-model="temp.ownerName" placeholder="请输入所属人姓名" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="所属人电话" prop="ownerPhone">
+              <el-input v-model="temp.ownerPhone" placeholder="请输入所属人电话" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="图片类型" prop="imageType">
+              <el-select v-model="temp.imageType" placeholder="请选择图片类型" style="width: 100%;">
+                <el-option label="背景图" value="background" />
+                <el-option label="人物图" value="person" />
+                <el-option label="产品图" value="product" />
+                <el-option label="素材图" value="material" />
+                <el-option label="其他" value="other" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="放大倍数">
+              <el-input-number
+                v-model="temp.scaleFactor"
+                :min="0"
+                :precision="2"
+                placeholder="请输入放大倍数"
+                style="width: 100%;"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="素材URL">
+          <el-input v-model="temp.materialUrl" placeholder="请输入素材URL" />
+        </el-form-item>
+        <el-form-item label="成品图片URL">
+          <el-input v-model="temp.resultImageUrl" placeholder="请输入成品图片URL" />
+        </el-form-item>
+        <el-form-item label="提示词">
+          <el-input
+            v-model="temp.prompt"
+            type="textarea"
+            :rows="3"
+            placeholder="请输入提示词"
+          />
+        </el-form-item>
+        <el-form-item label="功能函数名称">
+          <el-input v-model="temp.functionName" placeholder="请输入功能函数名称" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">
+          取消
+        </el-button>
+        <el-button type="primary" @click="dialogStatus === 'create' ? createData() : updateData()">
+          确认
+        </el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 上传素材对话框 -->
+    <el-dialog
+      title="上传素材"
+      :visible.sync="uploadDialogVisible"
+      width="50%"
+      center
+    >
+      <el-form
+        ref="uploadForm"
+        :rules="uploadRules"
+        :model="uploadForm"
+        label-position="left"
+        label-width="120px"
+        style="width: 100%;"
+      >
+        <el-form-item label="素材名称" prop="imageName">
+          <el-input v-model="uploadForm.imageName" placeholder="请输入素材名称" />
+        </el-form-item>
+        <el-form-item label="上传文件" prop="file">
+          <el-upload
+            ref="upload"
+            :auto-upload="false"
+            :on-change="handleFileChange"
+            :before-upload="beforeUpload"
+            :file-list="fileList"
+            action="#"
+            drag
+            accept="image/*"
+            :limit="1"
+          >
+            <i class="el-icon-upload" />
+            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过10MB</div>
+          </el-upload>
+        </el-form-item>
+        <el-form-item label="所属人姓名" prop="ownerName">
+          <el-input v-model="uploadForm.ownerName" placeholder="请输入所属人姓名" />
+        </el-form-item>
+        <el-form-item label="所属人电话" prop="ownerPhone">
+          <el-input v-model="uploadForm.ownerPhone" placeholder="请输入所属人电话" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="uploadDialogVisible = false">
+          取消
+        </el-button>
+        <el-button type="primary" :loading="uploadLoading" @click="confirmUpload">
+          确认上传
+        </el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getImageList, createImage, updateImage, deleteImage, batchDeleteImages, uploadMaterial, removeWatermark } from '@/api/image-management'
+import waves from '@/directive/waves' // waves directive
+import Pagination from '@/components/Pagination' // secondary package based on el-pagination
+import { mapGetters } from 'vuex'
+
+export default {
+  name: 'ImageList',
+  components: { Pagination },
+  directives: { waves },
+  data() {
+    return {
+      list: null,
+      total: 0,
+      listLoading: true,
+      listQuery: {
+        current: 1,
+        size: 20,
+        imageName: undefined,
+        modelName: undefined,
+        ownerName: undefined,
+        ownerPhone: undefined,
+        imageType: undefined
+      },
+      multipleSelection: [],
+      temp: {
+        id: undefined,
+        imageName: '',
+        modelName: '',
+        ownerName: '',
+        ownerPhone: '',
+        imageType: '',
+        materialUrl: '',
+        materialTempUrl: '',
+        resultImageUrl: '',
+        resultImageTempUrl: '',
+        prompt: '',
+        functionName: '',
+        scaleFactor: null
+      },
+      dialogVisible: false,
+      dialogStatus: '',
+      dialogTitle: '',
+      previewDialogVisible: false,
+      previewImageUrl: '',
+      // 上传素材相关
+      uploadDialogVisible: false,
+      uploadLoading: false,
+      fileList: [],
+      uploadForm: {
+        imageName: '',
+        ownerName: '',
+        ownerPhone: '',
+        file: null
+      },
+      uploadRules: {
+        imageName: [{ required: true, message: '素材名称不能为空', trigger: 'blur' }],
+        ownerName: [{ required: true, message: '所属人姓名不能为空', trigger: 'blur' }],
+        ownerPhone: [{ required: true, message: '所属人电话不能为空', trigger: 'blur' }],
+        file: [{ required: true, message: '请选择要上传的文件', trigger: 'change' }]
+      },
+      rules: {
+        imageName: [{ required: true, message: '图像名称不能为空', trigger: 'blur' }],
+        modelName: [{ required: true, message: '模型名称不能为空', trigger: 'blur' }],
+        ownerName: [{ required: true, message: '所属人姓名不能为空', trigger: 'blur' }],
+        ownerPhone: [{ required: true, message: '所属人电话不能为空', trigger: 'blur' }],
+        imageType: [{ required: true, message: '图片类型不能为空', trigger: 'change' }]
+      }
+    }
+  },
+  computed: {
+    ...mapGetters(['name', 'phone'])
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    getList() {
+      this.listLoading = true
+      console.log('开始查询图像列表，查询参数：', this.listQuery)
+      console.log('发送到后端的参数：', {
+        current: this.listQuery.current,
+        size: this.listQuery.size,
+        ownerName: this.listQuery.ownerName,
+        imageName: this.listQuery.imageName,
+        ownerPhone: this.listQuery.ownerPhone,
+        modelName: this.listQuery.modelName,
+        imageType: this.listQuery.imageType
+      })
+      getImageList(this.listQuery).then(response => {
+        console.log('图像列表API响应：', response)
+        console.log('响应数据结构：', {
+          success: response.success,
+          data: response.data,
+          total: response.total,
+          message: response.message
+        })
+
+        // 检查响应是否成功 - 根据日志显示success为undefined，但数据存在，说明成功
+        const isSuccess = response.success === true || (response.data && response.data.length >= 0)
+        console.log('判断是否成功：', {
+          'response.success': response.success,
+          'response.data存在': !!response.data,
+          'isSuccess': isSuccess
+        })
+
+        if (isSuccess) {
+          // 根据后端返回的数据结构，数据在response.data中
+          console.log('原始数据：', response.data)
+          this.list = response.data || []
+          this.total = response.total || 0
+          console.log('设置后的列表数据：', this.list)
+          console.log('设置后的总数：', this.total)
+        } else {
+          console.error('查询失败：', response.message)
+          this.$message.error(response.message || '查询失败')
+          this.list = []
+          this.total = 0
+        }
+        this.listLoading = false
+      }).catch(error => {
+        console.error('查询异常：', error)
+        this.$message.error('查询异常: ' + error.message)
+        this.list = []
+        this.total = 0
+        this.listLoading = false
+      })
+    },
+    handleFilter() {
+      this.listQuery.current = 1
+      this.getList()
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val
+    },
+    handleCreate() {
+      this.resetTemp()
+      this.dialogStatus = 'create'
+      this.dialogTitle = '新增图像'
+      this.dialogVisible = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].clearValidate()
+      })
+    },
+    handleView(row) {
+      this.temp = Object.assign({}, row)
+      this.dialogStatus = 'view'
+      this.dialogTitle = '查看图像详情'
+      this.dialogVisible = true
+    },
+    handleEdit(row) {
+      this.temp = Object.assign({}, row)
+      this.dialogStatus = 'update'
+      this.dialogTitle = '编辑图像'
+      this.dialogVisible = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].clearValidate()
+      })
+    },
+    handleDelete(row) {
+      this.$confirm('此操作将永久删除该图像, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        console.log('删除图像，UUID：', row.uuid)
+        deleteImage(row.uuid).then(response => {
+          console.log('删除响应：', response)
+          if (response.success) {
+            this.$notify({
+              title: '成功',
+              message: response.message || '删除成功',
+              type: 'success',
+              duration: 2000
+            })
+            this.getList()
+          } else {
+            this.$message.error(response.message || '删除失败')
+          }
+        }).catch(error => {
+          console.error('删除异常：', error)
+          console.error('错误详情：', {
+            message: error.message,
+            response: error.response,
+            status: error.response?.status,
+            data: error.response?.data
+          })
+
+          // 根据不同的错误状态码显示不同的错误信息
+          let errorMessage = '删除失败'
+          if (error.response) {
+            const status = error.response.status
+            const data = error.response.data
+
+            if (status === 500) {
+              errorMessage = `服务器内部错误: ${data?.message || error.message}`
+            } else if (status === 404) {
+              errorMessage = '接口不存在或UUID无效'
+            } else if (status === 400) {
+              errorMessage = `请求参数错误: ${data?.message || error.message}`
+            } else {
+              errorMessage = `请求失败 (${status}): ${data?.message || error.message}`
+            }
+          } else {
+            errorMessage = `网络错误: ${error.message}`
+          }
+
+          this.$message.error(errorMessage)
+        })
+      })
+    },
+    handleBatchDelete() {
+      if (this.multipleSelection.length === 0) {
+        this.$message.warning('请选择要删除的数据')
+        return
+      }
+      this.$confirm(`此操作将永久删除选中的 ${this.multipleSelection.length} 条图像数据, 是否继续?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        const ids = this.multipleSelection.map(item => item.id)
+        batchDeleteImages(ids).then(() => {
+          this.$notify({
+            title: '成功',
+            message: '批量删除成功',
+            type: 'success',
+            duration: 2000
+          })
+          this.getList()
+        })
+      })
+    },
+    createData() {
+      this.$refs['dataForm'].validate((valid) => {
+        if (valid) {
+          createImage(this.temp).then(() => {
+            this.list.unshift(this.temp)
+            this.dialogVisible = false
+            this.$notify({
+              title: '成功',
+              message: '创建成功',
+              type: 'success',
+              duration: 2000
+            })
+            this.getList()
+          })
+        }
+      })
+    },
+    updateData() {
+      this.$refs['dataForm'].validate((valid) => {
+        if (valid) {
+          const tempData = Object.assign({}, this.temp)
+          updateImage(tempData.id, tempData).then(() => {
+            this.dialogVisible = false
+            this.$notify({
+              title: '成功',
+              message: '更新成功',
+              type: 'success',
+              duration: 2000
+            })
+            this.getList()
+          })
+        }
+      })
+    },
+    resetTemp() {
+      this.temp = {
+        id: undefined,
+        imageName: '',
+        modelName: '',
+        ownerName: '',
+        ownerPhone: '',
+        imageType: '',
+        materialUrl: '',
+        materialTempUrl: '',
+        resultImageUrl: '',
+        resultImageTempUrl: '',
+        prompt: '',
+        functionName: '',
+        scaleFactor: null
+      }
+    },
+    previewImage(url) {
+      this.previewImageUrl = url
+      this.previewDialogVisible = true
+    },
+    openMaterialUrl(url) {
+      if (url) {
+        console.log('打开素材图片URL：', url)
+        // 在新标签页中打开URL
+        window.open(url, '_blank')
+      } else {
+        this.$message.warning('素材图片URL不存在')
+      }
+    },
+    getImageTypeTag(type) {
+      const typeMap = {
+        background: 'success',
+        person: 'primary',
+        product: 'warning',
+        material: 'danger',
+        other: 'info'
+      }
+      return typeMap[type] || 'info'
+    },
+    getImageTypeText(type) {
+      const typeMap = {
+        background: '背景图',
+        person: '人物图',
+        product: '产品图',
+        material: '素材图',
+        other: '其他'
+      }
+      return typeMap[type] || '未知'
+    },
+    // 格式化日期时间
+    formatDateTime(dateTime) {
+      if (!dateTime) {
+        return '-'
+      }
+      const date = new Date(dateTime)
+      if (isNaN(date.getTime())) {
+        return '-'
+      }
+      return date.toLocaleString('zh-CN', {
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit'
+      })
+    },
+    // 上传素材相关方法
+    handleUpload() {
+      this.resetUploadForm()
+      this.uploadDialogVisible = true
+      this.$nextTick(() => {
+        this.$refs['uploadForm'].clearValidate()
+      })
+    },
+    resetUploadForm() {
+      this.uploadForm = {
+        imageName: '',
+        ownerName: this.name || '',
+        ownerPhone: this.phone || '',
+        file: null
+      }
+      this.fileList = []
+      this.$refs.upload && this.$refs.upload.clearFiles()
+    },
+    handleFileChange(file, fileList) {
+      console.log('文件选择变化：', file, fileList)
+      this.uploadForm.file = file.raw
+      this.fileList = fileList
+      // 触发表单验证
+      this.$refs.uploadForm.validateField('file')
+    },
+    beforeUpload(file) {
+      console.log('上传前检查：', file)
+      const isImage = file.type.startsWith('image/')
+      const isLt10M = file.size / 1024 / 1024 < 10
+
+      if (!isImage) {
+        this.$message.error('只能上传图片文件!')
+        return false
+      }
+      if (!isLt10M) {
+        this.$message.error('上传图片大小不能超过 10MB!')
+        return false
+      }
+      return false // 阻止自动上传，我们手动处理
+    },
+    confirmUpload() {
+      this.$refs['uploadForm'].validate((valid) => {
+        if (valid) {
+          if (!this.uploadForm.file) {
+            this.$message.error('请选择要上传的文件')
+            return
+          }
+          this.uploadLoading = true
+          console.log('开始上传素材：', this.uploadForm)
+
+          // 这里调用上传API
+          this.uploadMaterial()
+        }
+      })
+    },
+    uploadMaterial() {
+      // 创建FormData对象
+      const formData = new FormData()
+      formData.append('file', this.uploadForm.file)
+      // 注意：imageName, ownerName, ownerPhone 作为查询参数传递，而不是FormData
+
+      // 准备查询参数
+      const params = {
+        imageName: this.uploadForm.imageName,
+        ownerName: this.uploadForm.ownerName,
+        ownerPhone: this.uploadForm.ownerPhone
+      }
+
+      console.log('上传数据：', {
+        imageName: this.uploadForm.imageName,
+        ownerName: this.uploadForm.ownerName,
+        ownerPhone: this.uploadForm.ownerPhone,
+        fileName: this.uploadForm.file.name,
+        fileSize: this.uploadForm.file.size
+      })
+
+      // 调用真实的上传API，传递查询参数
+      uploadMaterial(formData, params).then(response => {
+        console.log('上传响应：', response)
+        this.uploadLoading = false
+        this.uploadDialogVisible = false
+        this.$message.success('素材上传成功')
+        this.getList() // 刷新列表
+        this.resetUploadForm()
+      }).catch(error => {
+        console.error('上传失败：', error)
+        this.uploadLoading = false
+        this.$message.error('上传失败: ' + (error.message || '未知错误'))
+      })
+    },
+    // 去除水印处理方法
+    handleRemoveWatermark(row) {
+      this.$confirm('此操作将对图像进行水印去除处理，是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        console.log('开始去除水印，图像信息：', row)
+
+        // 构建请求参数
+        const requestData = {
+          uuid: row.uuid,
+          imageName: row.imageName,
+          modelName: row.modelName,
+          ownerName: row.ownerName,
+          ownerPhone: row.ownerPhone,
+          imageType: row.imageType,
+          materialUrl: row.materialUrl,
+          materialTempUrl: row.materialTempUrl,
+          prompt: row.prompt,
+          functionName: row.functionName,
+          scaleFactor: row.scaleFactor
+        }
+
+        console.log('去除水印请求参数：', requestData)
+        console.log('UUID值：', row.uuid)
+
+        // 显示加载状态
+        const loading = this.$loading({
+          lock: true,
+          text: '正在处理水印去除，请稍候...',
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.7)'
+        })
+
+        // 调用去除水印API
+        removeWatermark(requestData).then(response => {
+          console.log('去除水印响应：', response)
+          loading.close()
+
+          if (response.success) {
+            this.$notify({
+              title: '成功',
+              message: response.message || '水印去除处理成功',
+              type: 'success',
+              duration: 3000
+            })
+            // 刷新列表
+            this.getList()
+          } else {
+            this.$message.error(response.message || '水印去除处理失败')
+          }
+        }).catch(error => {
+          console.error('去除水印异常：', error)
+          loading.close()
+
+          // 根据不同的错误状态码显示不同的错误信息
+          let errorMessage = '水印去除处理失败'
+          if (error.response) {
+            const status = error.response.status
+            const data = error.response.data
+
+            if (status === 500) {
+              errorMessage = `服务器内部错误: ${data?.message || error.message}`
+            } else if (status === 404) {
+              errorMessage = '接口不存在或参数无效'
+            } else if (status === 400) {
+              errorMessage = `请求参数错误: ${data?.message || error.message}`
+            } else {
+              errorMessage = `请求失败 (${status}): ${data?.message || error.message}`
+            }
+          } else {
+            errorMessage = `网络错误: ${error.message}`
+          }
+
+          this.$message.error(errorMessage)
+        })
+      }).catch(() => {
+        // 用户取消操作
+        console.log('用户取消去除水印操作')
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.filter-container {
+  padding-bottom: 10px;
+}
+
+.filter-item {
+  display: inline-block;
+  vertical-align: middle;
+  margin-bottom: 10px;
+  margin-right: 10px;
+}
+
+.dialog-footer {
+  text-align: right;
+}
+</style>
diff --git a/src/views/image-model/poster-generation.vue b/src/views/image-model/poster-generation.vue
new file mode 100644
index 0000000..a599aa7
--- /dev/null
+++ b/src/views/image-model/poster-generation.vue
@@ -0,0 +1,27 @@
+<template>
+  <div class="app-container">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>海报生成</span>
+      </div>
+
+      <div class="content">
+        <el-empty description="功能建设中，敬请期待" />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'PosterGeneration'
+}
+</script>
+
+<style scoped>
+.content {
+  padding: 20px 0;
+}
+</style>
+
+
diff --git a/src/views/image-model/remove-watermark.vue b/src/views/image-model/remove-watermark.vue
new file mode 100644
index 0000000..095785e
--- /dev/null
+++ b/src/views/image-model/remove-watermark.vue
@@ -0,0 +1,26 @@
+<template>
+  <div class="app-container">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>去除水印</span>
+      </div>
+
+      <div class="content">
+        <el-empty description="功能建设中，敬请期待" />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'RemoveWatermark'
+}
+</script>
+
+<style scoped>
+.content {
+  padding: 20px 0;
+}
+</style>
+
diff --git a/src/views/image-model/virtual-model.vue b/src/views/image-model/virtual-model.vue
new file mode 100644
index 0000000..b7db46f
--- /dev/null
+++ b/src/views/image-model/virtual-model.vue
@@ -0,0 +1,26 @@
+<template>
+  <div class="app-container">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>虚拟模特儿模型</span>
+      </div>
+
+      <div class="content">
+        <el-empty description="功能建设中，敬请期待" />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'VirtualModel'
+}
+</script>
+
+<style scoped>
+.content {
+  padding: 20px 0;
+}
+</style>
+
diff --git a/src/views/text-model/index.vue b/src/views/text-model/index.vue
index 4b42b18..601d73a 100644
--- a/src/views/text-model/index.vue
+++ b/src/views/text-model/index.vue
@@ -19,12 +19,12 @@
             </el-col>
 
             <el-col :span="8">
-              <el-card class="feature-card disabled" shadow="hover">
+              <el-card class="feature-card" shadow="hover" @click.native="goToLegalModel">
                 <div class="feature-icon">
-                  <i class="el-icon-edit" />
+                  <i class="el-icon-scale" />
                 </div>
-                <div class="feature-title">文本生成</div>
-                <div class="feature-desc">智能文本生成，即将上线</div>
+                <div class="feature-title">法律模型</div>
+                <div class="feature-desc">专业法律咨询，提供法律问题解答服务</div>
               </el-card>
             </el-col>
 
@@ -50,6 +50,9 @@ export default {
   methods: {
     goToTranslation() {
       this.$router.push('/text-model/translation')
+    },
+    goToLegalModel() {
+      this.$router.push('/text-model/legal-model')
     }
   }
 }
diff --git a/src/views/text-model/legal-model.vue b/src/views/text-model/legal-model.vue
new file mode 100644
index 0000000..63ded89
--- /dev/null
+++ b/src/views/text-model/legal-model.vue
@@ -0,0 +1,311 @@
+<template>
+  <div class="app-container">
+    <div class="legal-model-container">
+      <el-card class="box-card">
+        <div slot="header" class="clearfix">
+          <span>法律模型</span>
+        </div>
+
+        <el-form :model="legalForm" label-width="120px" class="legal-form">
+          <!-- 咨询类型 -->
+          <el-form-item label="咨询类型">
+            <el-select v-model="legalForm.consultationType" placeholder="请选择咨询类型" style="width: 300px">
+              <el-option
+                v-for="item in consultationTypeOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+
+          <!-- 法律模型 -->
+          <el-form-item label="法律模型">
+            <el-select v-model="legalForm.model" placeholder="请选择法律模型" style="width: 300px">
+              <el-option
+                v-for="item in modelOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+
+          <!-- 核心诉求 -->
+          <el-form-item label="核心诉求">
+            <el-input
+              v-model="legalForm.coreDemand"
+              type="textarea"
+              :rows="3"
+              placeholder="请描述您的核心诉求，想要什么，列举 1-3 条"
+              maxlength="500"
+              show-word-limit
+            />
+          </el-form-item>
+
+          <!-- 咨询目的 -->
+          <el-form-item label="咨询目的">
+            <el-input
+              v-model="legalForm.consultationPurpose"
+              type="textarea"
+              :rows="3"
+              placeholder="请说明您的咨询目的，比如： 1、帮我写一个诉状， 2、分析一下我的要求是否合理 ；3、帮我写一个合同"
+              maxlength="500"
+              show-word-limit
+            />
+          </el-form-item>
+
+          <!-- 咨询内容 -->
+          <el-form-item label="咨询内容">
+            <el-input
+              v-model="legalForm.inputText"
+              type="textarea"
+              :rows="6"
+              placeholder="请输入您的法律咨询内容，详细描述和咨询相关的内容"
+              maxlength="2000"
+              show-word-limit
+            />
+          </el-form-item>
+
+          <!-- 提交按钮 -->
+          <el-form-item>
+            <el-button
+              type="primary"
+              :loading="processing"
+              :disabled="!legalForm.inputText.trim() || !legalForm.consultationType || !legalForm.model || !legalForm.coreDemand.trim() || !legalForm.consultationPurpose.trim()"
+              @click="handleConsult"
+            >
+              {{ processing ? '处理中...' : '提交咨询' }}
+            </el-button>
+            <el-button @click="handleClear">清空</el-button>
+          </el-form-item>
+
+          <!-- 返回结果 -->
+          <el-form-item v-if="legalForm.outputText" label="返回结果">
+            <el-input
+              v-model="legalForm.outputText"
+              type="textarea"
+              :rows="8"
+              readonly
+              placeholder="法律咨询结果将显示在这里"
+            />
+          </el-form-item>
+
+          <!-- 使用量信息 -->
+          <el-form-item v-if="usageInfo" label="使用量">
+            <el-card class="usage-card">
+              <div class="usage-info">
+                <div class="usage-item">
+                  <span class="usage-label">输入tokens:</span>
+                  <span class="usage-value">{{ usageInfo.input_tokens }}</span>
+                </div>
+                <div class="usage-item">
+                  <span class="usage-label">输出tokens:</span>
+                  <span class="usage-value">{{ usageInfo.output_tokens }}</span>
+                </div>
+                <div class="usage-item">
+                  <span class="usage-label">总tokens:</span>
+                  <span class="usage-value">{{ usageInfo.total_tokens }}</span>
+                </div>
+              </div>
+            </el-card>
+          </el-form-item>
+        </el-form>
+      </el-card>
+    </div>
+  </div>
+</template>
+
+<script>
+import { legalConsult } from '@/api/legal-model'
+
+export default {
+  name: 'LegalModel',
+  data() {
+    return {
+      processing: false,
+      legalForm: {
+        consultationType: '',
+        model: 'farui-plus',
+        coreDemand: '',
+        consultationPurpose: '',
+        inputText: '',
+        outputText: ''
+      },
+      consultationTypeOptions: [
+        { value: 'legal_question', label: '法律问题' },
+        { value: 'case_recommendation', label: '推荐裁判类案' },
+        { value: 'case_analysis', label: '辅助案情分析' },
+        { value: 'document_generation', label: '生成法律文书' },
+        { value: 'knowledge_search', label: '检索法律知识' },
+        { value: 'contract_review', label: '审查合同条款' }
+      ],
+      modelOptions: [
+        { value: 'farui-plus', label: 'farui-plus' }
+      ],
+      usageInfo: null
+    }
+  },
+  methods: {
+    async handleConsult() {
+      if (!this.legalForm.coreDemand.trim()) {
+        this.$message.warning('请输入核心诉求')
+        return
+      }
+
+      if (!this.legalForm.consultationPurpose.trim()) {
+        this.$message.warning('请输入咨询目的')
+        return
+      }
+
+      if (!this.legalForm.inputText.trim()) {
+        this.$message.warning('请输入咨询内容')
+        return
+      }
+
+      if (!this.legalForm.consultationType) {
+        this.$message.warning('请选择咨询类型')
+        return
+      }
+
+      if (!this.legalForm.model) {
+        this.$message.warning('请选择法律模型')
+        return
+      }
+
+      this.processing = true
+
+      try {
+        await this.callLegalAPI()
+        this.$message.success('咨询提交成功')
+      } catch (error) {
+        this.$message.error('咨询失败，请重试')
+        console.error('Legal consultation error:', error)
+      } finally {
+        this.processing = false
+      }
+    },
+
+    // 调用法律咨询API
+    async callLegalAPI() {
+      const requestData = {
+        consultationPurpose: this.legalForm.consultationPurpose,
+        consultationType: this.legalForm.consultationType,
+        coreDemand: this.legalForm.coreDemand,
+        inputText: this.legalForm.inputText,
+        model: this.legalForm.model
+      }
+
+      try {
+        const response = await legalConsult(requestData)
+        console.log('法律咨询API响应:', response)
+
+        if (response.code === 20000) {
+          // request.js拦截器现在会确保response.data包含原始的法律咨询结果
+          console.log('法律咨询成功，响应数据:', response.data)
+
+          // 处理后端返回的数据格式：{ answer: "...", success: true, message: "..." }
+          if (response.data && response.data.answer) {
+            this.legalForm.outputText = response.data.answer
+            console.log('设置后的咨询结果:', this.legalForm.outputText)
+          } else if (response.data && response.data.outputText) {
+            // 兼容旧格式
+            this.legalForm.outputText = response.data.outputText
+            console.log('设置后的咨询结果:', this.legalForm.outputText)
+          } else {
+            console.error('法律咨询API响应数据结构异常，未找到answer或outputText:', response.data)
+            throw new Error('咨询结果数据结构异常')
+          }
+
+          // 设置使用量信息
+          if (response.data && response.data.usage) {
+            this.usageInfo = response.data.usage
+          }
+        } else {
+          console.log('法律咨询失败，响应:', response)
+          throw new Error(response.message || '法律咨询失败')
+        }
+      } catch (error) {
+        console.error('API调用失败:', error)
+        throw error
+      }
+    },
+
+    handleClear() {
+      this.legalForm.coreDemand = ''
+      this.legalForm.consultationPurpose = ''
+      this.legalForm.inputText = ''
+      this.legalForm.outputText = ''
+      this.legalForm.consultationType = ''
+      this.legalForm.model = 'farui-plus'
+      this.usageInfo = null
+    }
+  }
+}
+</script>
+
+<style scoped>
+.legal-model-container {
+  max-width: 1000px;
+  margin: 0 auto;
+}
+
+.legal-form {
+  padding: 20px;
+}
+
+.box-card {
+  margin-bottom: 20px;
+}
+
+.clearfix:before,
+.clearfix:after {
+  display: table;
+  content: "";
+}
+
+.clearfix:after {
+  clear: both;
+}
+
+.el-textarea {
+  font-size: 14px;
+}
+
+.el-form-item {
+  margin-bottom: 20px;
+}
+
+.el-button {
+  margin-right: 10px;
+}
+
+.usage-card {
+  background-color: #f8f9fa;
+  border: 1px solid #e9ecef;
+}
+
+.usage-info {
+  display: flex;
+  gap: 30px;
+  flex-wrap: wrap;
+}
+
+.usage-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.usage-label {
+  font-size: 12px;
+  color: #666;
+  margin-bottom: 5px;
+}
+
+.usage-value {
+  font-size: 16px;
+  font-weight: bold;
+  color: #409EFF;
+}
+</style>