智能方案管理页面

src/router/routes/modules/propertyMarketing.ts

@@ -28,7 +28,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
           requiresAuth: true,
           roles: ['*'],
         },
-        component: () => import('@/views/property-marketing/repository/test'),
+        component: () => import('@/views/property-marketing/enterpriseKnowledge/brandMaterials.vue'),
       },
     ],
   },
@@ -153,7 +153,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
           requiresAuth: true,
           roles: ['*'],
         },
-        component: () => import('@/views/property-marketing/repository/test'),
+        component: () => import('@/views/property-marketing/intelligent-solution/businessAnalysisReport'),
       },
       {
         path: 'competitiveProductAnalysisReport',
@@ -163,7 +163,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
           requiresAuth: true,
           roles: ['*'],
         },
-        component: () => import('@/views/property-marketing/repository/test'),
+        component: () => import('@/views/property-marketing/intelligent-solution/competitiveProductAnalysisReport'),
       },
     ],
   },

src/views/components/enterpriseKnowledge/userPainPoints.vue

@@ -0,0 +1,325 @@
+<template>
+  <view>
+    <a-space direction="vertical" style="background-color: #fff; width: 100%; padding: 24px; margin-bottom: 24px">
+      <div class="materials-page">
+        <!-- 顶部标题和新增按钮 -->
+        <div class="header-row">
+          <h2 class="page-title">品牌物料</h2>
+          <a-button type="primary" @click="handleAdd" class="add-btn">+ 添加品牌</a-button>
+        </div>
+
+        <!-- 搜索栏 -->
+        <div class="search-row">
+          品牌名称
+          <a-input v-model="listQuery.name" placeholder="请搜索..." allow-clear class="search-input" />
+          <a-button type="outline" @click="handleSearch">
+            <template #icon>
+              <icon-search />
+            </template>
+            <template #default>搜索</template>
+          </a-button>
+          <a-button type="outline" @click="handleReset">
+            <template #icon>
+              <icon-refresh />
+            </template>
+            <template #default>重置</template>
+          </a-button>
+        </div>
+
+        <!-- 表格 -->
+
+        <a-table :data="listResult.list" :pagination="false">
+          <template #columns>
+            <a-table-column title="品牌名称" data-index="name" />
+            <a-table-column title="品牌logo" data-index="logo">
+              <template #cell="{ record }">
+                <img :src="record.logo" style="width: 50px; height: 50px" />
+              </template>
+            </a-table-column>
+            <a-table-column title="Slogan" data-index="slogan" />
+            <a-table-column title="操作" data-index="optional">
+              <template #cell="{ record }">
+                <a-popconfirm
+                  content="确定删除吗?"
+                  type="warning"
+                  ok-text="确认删除"
+                  cancel-text="取消"
+                  @ok="deleteBrand(record.id)"
+                >
+                  <icon-delete></icon-delete>
+                </a-popconfirm>
+                <a-button type="outline" @click="handleEdit(record.id)">编辑</a-button>
+              </template>
+            </a-table-column>
+          </template>
+        </a-table>
+
+        <!-- 分页 -->
+        <a-space direction="vertical" size="large">
+          <a-pagination :total="listResult.total" :size="listQuery.page_size" show-total show-jumper show-page-size />
+        </a-space>
+
+        <!-- 新增/编辑品牌弹窗 -->
+        <a-modal
+          v-model:visible="modalVisible"
+          :title="modalTitle"
+          :mask-closable="false"
+          :esc-to-close="false"
+          width="480px"
+          @cancel="handleModalCancel"
+        >
+          <a-form
+            :model="form"
+            :label-col-props="{ span: 5, offset: 0 }"
+            :wrapper-col-props="{ span: 19, offset: 0 }"
+            label-align="left"
+            :rules="formRule"
+            ref="formRef"
+            layout="left"
+          >
+            <a-form-item field="name" label="品牌名称">
+              <a-input v-model="form.name" placeholder="请输入品牌名称" />
+            </a-form-item>
+            <a-form-item field="logo" label="标准版Logo">
+              <ImageUpload v-model="form.logo" :limit="1"></ImageUpload>
+              <div class="form-tip">品牌常规展示标识，支持PNG、JPG格式</div>
+            </a-form-item>
+            <a-form-item field="otherLogos" label="其他Logo">
+              <ImageUpload v-model="form.other_logos" :limit="3"></ImageUpload>
+            </a-form-item>
+            <a-form-item field="slogan" label="Slogan">
+              <a-textarea v-model="form.slogan" placeholder="请输入..." :max-length="50" show-word-limit />
+            </a-form-item>
+          </a-form>
+          <template #footer>
+            <a-button @click="handleModalCancel">取消</a-button>
+            <a-button type="primary" @click="handleModalOk">{{ btn_str }}</a-button>
+          </template>
+        </a-modal>
+      </div>
+    </a-space>
+  </view>
+</template>
+
+<script setup>
+import { ref, computed, reactive, onMounted } from 'vue';
+import { Message } from '@arco-design/web-vue';
+import { IconDelete } from '@arco-design/web-vue/es/icon';
+import {
+  addMaterials,
+  deleteMaterials,
+  getMaterialsList,
+  getMaterialsDetail,
+  updateMaterials,
+} from '@/api/all/enterpriseKnowledge';
+import ImageUpload from '@/components/upload/ImageUpload.vue';
+import { valid } from 'mockjs';
+
+const searchName = ref('');
+const current = ref(1);
+
+const listResult = reactive({
+  list: ref([]),
+  total: ref(0),
+});
+
+const listQuery = reactive({
+  page: ref(1),
+  name: ref(''),
+  page_size: ref('10'),
+});
+
+const modalVisible = ref(false);
+const modalTitle = ref('编辑品牌');
+const formRef = ref();
+//表单验证
+const formRule = {
+  name: [{ required: true, message: '请输入品牌名称', trigger: ['blur', 'change'] }],
+  logo: [{ required: true, message: '请上传品牌logo', trigger: ['blur', 'change'] }],
+};
+const form = reactive({
+  name: '',
+  logo: '',
+  id: 0,
+  other_logos: [], // [{ url: '' }]
+  slogan: '',
+});
+
+const btn_str = ref('确认添加');
+
+onMounted(() => {
+  handleSearch();
+});
+
+const handleSearch = () => {
+  getMaterialsList(listQuery).then((response) => {
+    listResult.list = response.data;
+  });
+};
+
+const deleteBrand = (id) => {
+  console.log(id, 'id');
+  deleteMaterials(id).then(() => {
+    Message.success('删除成功');
+    handleSearch();
+  });
+};
+
+function handleReset() {
+  searchName.value = '';
+  current.value = 1;
+}
+
+function handleAdd() {
+  modalTitle.value = '添加品牌';
+  btn_str.value = '确认添加';
+
+  Object.assign(form, {
+    name: '',
+    logo: '',
+    id: 0,
+    other_logos: [], // 或者 []
+    slogan: '',
+  });
+  modalVisible.value = true;
+}
+
+function handleModalCancel() {
+  modalVisible.value = false;
+}
+
+function handleModalOk() {
+  formRef.value
+    .validate()
+    .then((valid) => {
+      if (!valid) {
+        if (form.id) {
+          updateMaterials(form.id, form).then(() => {
+            Message.success('修改成功');
+          });
+        } else {
+          addMaterials(form).then(() => {
+            Message.success('新增成功');
+          });
+        }
+        handleSearch();
+        modalVisible.value = false;
+      }
+    })
+    .catch((error) => {
+      console.error('验证失败:', error);
+      Message.error('请检查表单填写是否正确');
+    });
+}
+
+function handleEdit(id) {
+  modalTitle.value = '编辑品牌';
+  //清空form 字段数据
+  formRef.value.resetFields();
+  modalVisible.value = true;
+  btn_str.value = '确认修改';
+  getMaterialsDetail(id).then((response) => {
+    //赋值给form表单
+    Object.assign(form, response);
+  });
+}
+</script>
+
+<style scoped>
+.materials-page {
+  background: #fff;
+  border-radius: 8px;
+  padding: 32px 24px 24px 24px;
+  min-height: 600px;
+}
+
+.header-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 24px;
+}
+
+.page-title {
+  font-size: 20px;
+  font-weight: 600;
+  margin: 0;
+}
+
+.add-btn {
+  font-size: 16px;
+  padding: 0 24px;
+}
+
+.search-row {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 20px;
+}
+
+.search-input {
+  width: 240px;
+}
+
+.search-btn,
+.reset-btn {
+  min-width: 72px;
+}
+
+.brand-table {
+  margin-bottom: 16px;
+}
+
+.logo-cell {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-weight: 500;
+}
+
+.logo-emoji {
+  font-size: 20px;
+}
+
+.logo-text {
+  font-size: 16px;
+}
+
+.pagination-row {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  margin-top: 8px;
+}
+
+.page-size-select {
+  width: 80px;
+}
+
+.upload-card {
+  width: 80px;
+  height: 80px;
+  border: 1px dashed #d9d9d9;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  color: #999;
+  font-size: 24px;
+  background: #fafafa;
+  border-radius: 6px;
+}
+
+.upload-tip {
+  font-size: 12px;
+  color: #999;
+  margin-top: 4px;
+}
+
+.form-tip {
+  font-size: 12px;
+  color: #999;
+  margin-top: 4px;
+}
+</style>

src/views/property-marketing/enterpriseKnowledge/brandMaterials.vue

@@ -0,0 +1,3 @@
+<template>
+  <view> </view>
+</template>

src/views/property-marketing/intelligent-solution/businessAnalysisReport.vue

@@ -0,0 +1,137 @@
+<template>
+  <view>
+    <a-space direction="vertical" style="background-color: #fff; width: 100%; padding: 24px; margin: 24px 0">
+      <a-space align="end">
+        <span class="part-div-header-title">业务分析报告 </span>
+      </a-space>
+      <a-space wrap :size="30">
+
+      </a-space>
+      <a-space align="center" class="search-form-div" size="medium">
+        <a-form-item field="name" class="search-form" label="服务/产品">
+          <a-input
+            v-model="listQuery.name"
+            placeholder="请搜索..."
+          />
+        </a-form-item>
+        <a-form-item field="name" label="生成日期">
+          <a-range-picker
+            showTime
+            :time-picker-props="{
+              defaultValue: ['00:00:00', '00:00:00'],
+            }"
+            style="width: 380px"
+          />
+        </a-form-item>
+        <a-form-item field="name">
+          <a-space>
+            <a-button type="outline" class="search-btn" @click="handleSearch">
+              <template #icon>
+                <icon-search />
+              </template>
+              <template #default>搜索</template>
+            </a-button>
+            <a-button type="outline" class="reset-btn" @click="handleSearch">
+              <template #icon>
+                <icon-refresh />
+              </template>
+              <template #default>重置</template>
+            </a-button>
+          </a-space>
+        </a-form-item>
+      </a-space>
+      <a-table
+        :columns="columns"
+        :data="listResult.data"
+        :filter-icon-align-left="alignLeft"
+        @change="handleChange"
+        :scroll="true"
+        :pagination="false"
+      >
+      </a-table>
+      <a-pagination style="float: right" :total="50" :size="size" show-total show-jumper show-page-size />
+    </a-space>
+  </view>
+</template>
+
+<script setup lang="ts">
+const listQuery = reactive({
+  name: '',
+});
+
+const listResult = reactive({
+  data: [],
+  total: 0,
+});
+
+const columns = [
+  {
+    title: '服务/产品',
+    dataIndex: 'rank',
+    slotName: 'rank',
+    width: 60,
+    minWidth: 60,
+  },
+  {
+    title: '生成日期',
+    dataIndex: 'name',
+    width: 120,
+    minWidth: 120,
+    sortable: {
+      sortDirections: ['ascend', 'descend'],
+    },
+  },
+  {
+    titleSlotName: 'hotTitle',
+    width: 180,
+    minWidth: 180,
+    title: '目标客群',
+    dataIndex: 'hot',
+    slotName: 'hot',
+  },
+  {
+    title: '价格区间',
+    dataIndex: 'name',
+    width: 120,
+    minWidth: 120,
+  },
+  {
+    titleSlotName: 'volume_rateTitle',
+    title: '最后更新日期',
+    dataIndex: 'volumeRate',
+    width: 180,
+    minWidth: 180,
+    sortable: {
+      sortDirections: ['ascend', 'descend'],
+    },
+    slotName: 'volumeRate',
+  },
+  {
+    title: '操作人',
+    dataIndex: 'name',
+    width: 120,
+    minWidth: 120,
+  },
+];
+</script>
+
+<style scoped lang="less">
+.part-div-header-title {
+  justify-content: center;
+  display: flex;
+  flex-direction: column;
+  color: var(--Text-1, #211f24);
+  font-size: 18px;
+  font-family: Alibaba PuHuiTi;
+  font-weight: 400;
+  line-height: 26px;
+  word-wrap: break-word;
+}
+
+.search-form-div {
+  margin-top: 10px;
+}
+
+.search-form {
+}
+</style>

src/views/property-marketing/intelligent-solution/competitiveProductAnalysisReport.vue

@@ -0,0 +1,114 @@
+<template>
+  <view>
+    <a-space direction="vertical" style="background-color: #fff; width: 100%; padding: 24px; margin: 24px 0">
+      <a-space align="end">
+        <span>业务分析报告 </span>
+      </a-space>
+      <a-space align="center" size="medium">
+        <a-form-item field="name" label="服务/产品">
+          <a-input v-model="listQuery.name" placeholder="请搜索" />
+        </a-form-item>
+        <a-form-item field="name" label="生成日期">
+          <a-range-picker
+            showTime
+            :time-picker-props="{
+              defaultValue: ['00:00:00', '00:00:00'],
+            }"
+            style="width: 380px"
+          />
+        </a-form-item>
+        <a-form-item field="name" >
+          <a-space>
+            <a-button type="outline" class="search-btn" @click="handleSearch">
+              <template #icon>
+                <icon-search />
+              </template>
+              <template #default>搜索</template>
+            </a-button>
+            <a-button type="outline" class="reset-btn" @click="handleSearch">
+              <template #icon>
+                <icon-refresh />
+              </template>
+              <template #default>重置</template>
+            </a-button>
+          </a-space>
+        </a-form-item>
+
+      </a-space>
+      <a-table
+        :columns="columns"
+        :data="listResult.data"
+        :filter-icon-align-left="alignLeft"
+        @change="handleChange"
+        :scroll="true"
+        :pagination="false"
+      >
+      </a-table>
+      <a-pagination style="float: right" :total="50" :size="size" show-total show-jumper show-page-size />
+
+    </a-space>
+  </view>
+</template>
+
+<script setup lang="ts">
+const listQuery = reactive({
+  name: '',
+});
+
+const listResult = reactive({
+  data: [],
+  total: 0,
+});
+
+const columns = [
+  {
+    title: '服务/产品',
+    dataIndex: 'rank',
+    slotName: 'rank',
+    width: 60,
+    minWidth: 60,
+  },
+  {
+    title: '生成日期',
+    dataIndex: 'name',
+    width: 120,
+    minWidth: 120,
+    sortable: {
+      sortDirections: ['ascend', 'descend'],
+    },
+  },
+  {
+    titleSlotName: 'hotTitle',
+    width: 180,
+    minWidth: 180,
+    title: '目标客群',
+    dataIndex: 'hot',
+    slotName: 'hot',
+  },
+  {
+    title: '价格区间',
+    dataIndex: 'name',
+    width: 120,
+    minWidth: 120,
+  },
+  {
+    titleSlotName: 'volume_rateTitle',
+    title: '最后更新日期',
+    dataIndex: 'volumeRate',
+    width: 180,
+    minWidth: 180,
+    sortable: {
+      sortDirections: ['ascend', 'descend'],
+    },
+    slotName: 'volumeRate',
+  },
+  {
+    title: '操作人',
+    dataIndex: 'name',
+    width: 120,
+    minWidth: 120,
+  },
+];
+</script>
+
+<style scoped lang="less"></style>