Merge branch 'dev_2307' of http://182.92.169.222:3000/zhc077/projectManagement into dev_2307

ant-design-vue-jeecg/src/views/requirementitem/RequirementItemList.vue

@@ -6,12 +6,13 @@
         <a-row :gutter="24">
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <a-form-item label="项目">
-              <j-dict-select-tag placeholder="请选择项目" v-model="queryParam.projectId" dictCode="projectx,project_name,id"/>
+              <j-dict-select-tag placeholder="请选择项目" v-model="queryParam.projectId" dictCode="projectx,project_name,id" />
             </a-form-item>
           </a-col>
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <a-form-item label="类型">
-              <j-dict-select-tag placeholder="请选择类型" v-model="queryParam.typeId" dictCode="requirement_type,type_name,id"/>
+              <j-dict-select-tag placeholder="请选择类型" v-model="queryParam.typeId"
+                dictCode="requirement_type,type_name,id" />
             </a-form-item>
           </a-col>
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
@@ -26,12 +27,14 @@
           </a-col>
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <a-form-item label="需求等级">
-                <j-dict-select-tag placeholder="请选择需求等级" v-model="queryParam.requirementLevel" dictCode="requirement_level"></j-dict-select-tag>
+              <j-dict-select-tag placeholder="请选择需求等级" v-model="queryParam.requirementLevel"
+                dictCode="requirement_level"></j-dict-select-tag>
             </a-form-item>
           </a-col>
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
             <a-form-item label="需求状态">
-                <j-dict-select-tag placeholder="请选择需求状态" v-model="queryParam.requirementStatus" dictCode="requirement_status"></j-dict-select-tag>
+              <j-dict-select-tag placeholder="请选择需求状态" v-model="queryParam.requirementStatus"
+                dictCode="requirement_status"></j-dict-select-tag>
             </a-form-item>
           </a-col>
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
@@ -47,42 +50,36 @@
 
     <!-- 操作按钮区域 -->
     <div class="table-operator">
-      <a-button @click="handleAddxqlx(1,'')" type="primary" icon="plus">新增</a-button>
+      <a-button @click="handleAddxqlx(1, '')" type="primary" icon="plus">新增</a-button>
       <a-button type="primary" icon="download" @click="handleExportXls('需求管理')">导出</a-button>
-      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
+      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl"
+        @change="handleImportExcel">
         <a-button type="primary" icon="import">导入</a-button>
       </a-upload>
       <a-button @click="wdxq()" type="primary" icon="search">我的需求</a-button>
       <!-- 高级查询区域 -->
-      <j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>
+      <j-super-query :fieldList="superFieldList" ref="superQueryModal"
+        @handleSuperQuery="handleSuperQuery"></j-super-query>
     </div>
 
     <!-- table区域-begin -->
     <div>
       <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
-        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
+        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{
+          selectedRowKeys.length }}</a>项
         <a style="margin-left: 24px" @click="onClearSelected">清空</a>
       </div>
 
-      <a-table
-        ref="table"
-        size="middle"
-        :scroll="{x:true}"
-        bordered
-        rowKey="id"
-        :columns="columns"
-        :dataSource="dataSource"
-        :pagination="ipagination"
-        :loading="loading"
-        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
-        class="j-table-force-nowrap"
+      <a-table ref="table" size="middle" :scroll="{ x: true }" bordered rowKey="id" :columns="columns"
+        :dataSource="dataSource" :pagination="ipagination" :loading="loading"
+        :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }" class="j-table-force-nowrap"
         @change="handleTableChange">
-        <span slot="zh" slot-scope="text, record" v-if="record.xqflag==='1'">
+        <span slot="zh" slot-scope="text, record" v-if="record.xqflag === '1'">
           <a @click="zhmk(record)">模块</a>
-          <a-divider type="vertical"/>
+          <a-divider type="vertical" />
 
           <a @click="zhgn(record)">功能</a>
-          <a-divider type="vertical"/>
+          <a-divider type="vertical" />
           <a @click="zhgz(record)">规则</a>
         </span>
         <span v-else>无操作权限</span>
@@ -96,18 +93,12 @@
         </template>
         <template slot="fileSlot" slot-scope="text">
           <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
-          <a-button
-            v-else
-            :ghost="true"
-            type="primary"
-            icon="download"
-            size="small"
-            @click="downloadFile(text)">
+          <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="downloadFile(text)">
             下载
           </a-button>
         </template>
 
-        <span slot="action" slot-scope="text, record">
+        <!-- <span slot="action" slot-scope="text, record">
           <a @click="checkqx(record)">编辑</a>
 
           <a-divider type="vertical" />
@@ -117,13 +108,30 @@
             <a>删除</a>
           </a-popconfirm>
           <a-divider type="vertical" />
-          <a @click="handleAddxqlx(0,record)">拆分</a>
+          <a @click="handleAddxqlx(0, record)">拆分</a>
+          <a-divider type="vertical" />
+          <a @click="cqdx(record)">抽取对象</a>
+          <a-divider type="vertical" />
+          <a v-if="record.xqflag === '1'" @click="qrxq(record.id)">确认需求</a>
+        </span> -->
+        <span slot="action" slot-scope="text, record" class="action-buttons">
+          <div>
+            <a @click="checkqx(record)">编辑</a>
+            <a-divider type="vertical" />
+            <a @click="handleDetail(record)">详情</a>
+            <a-divider type="vertical" />
+            <a-popconfirm title="确定删除吗?" @confirm="() => handleDeleteQx(record)">
+              <a>删除</a>
+            </a-popconfirm>
+          </div>
+          <div>
+            <a @click="handleAddxqlx(0, record)">拆分</a>
             <a-divider type="vertical" />
             <a @click="cqdx(record)">抽取对象</a>
             <a-divider type="vertical" />
-          <a v-if="record.xqflag==='1'" @click="qrxq(record.id)">确认需求</a>
+            <a v-if="record.xqflag === '1'" @click="qrxq(record.id)">确认需求</a>
+          </div>
         </span>
-
       </a-table>
     </div>
 
@@ -137,24 +145,24 @@
 
 <script>
 
-  import '@/assets/less/TableExpand.less'
-  import { mixinDevice } from '@/utils/mixin'
-  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
-  import RequirementItemModal from './modules/RequirementItemModal'
-  import {filterMultiDictText} from '@/components/dict/JDictSelectUtil'
-  import { httpAction, getAction } from '@/api/manage'
-  import ModulexModal1 from "../modulex/modules/ModulexModal1";
-  import FunctionxModal1 from "../functionx/modules/FunctionxModal1";
-  import RulexModal1 from "../rulex/modules/RulexModal1";
-  import RequirementEntityList1 from "../requiremententity/RequirementEntityList1";
-
-  export default {
+import '@/assets/less/TableExpand.less'
+import { mixinDevice } from '@/utils/mixin'
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import RequirementItemModal from './modules/RequirementItemModal'
+import { filterMultiDictText } from '@/components/dict/JDictSelectUtil'
+import { httpAction, getAction } from '@/api/manage'
+import ModulexModal1 from "../modulex/modules/ModulexModal1";
+import FunctionxModal1 from "../functionx/modules/FunctionxModal1";
+import RulexModal1 from "../rulex/modules/RulexModal1";
+import RequirementEntityList1 from "../requiremententity/RequirementEntityList1";
+import { Tooltip, Typography } from 'ant-design-vue';
+export default {
   name: 'RequirementItemList',
-    mixins:[JeecgListMixin, mixinDevice],
+  mixins: [JeecgListMixin, mixinDevice],
   components: {
-      RequirementItemModal,ModulexModal1,FunctionxModal1,RulexModal1,RequirementEntityList1
+    RequirementItemModal, ModulexModal1, FunctionxModal1, RulexModal1, RequirementEntityList1
   },
-    data () {
+  data() {
     return {
       description: '需求管理管理页面',
       // 表头
@@ -162,17 +170,18 @@
         {
           title: '#',
           dataIndex: '',
-            key:'rowIndex',
-            width:60,
-            align:"center",
-            customRender:function (t,r,index) {
-              return parseInt(index)+1;
+          key: 'rowIndex',
+          width: 60,
+          align: "center",
+          customRender: function (t, r, index) {
+            return parseInt(index) + 1;
           }
         },
         {
-            title:'项目',
-            align:"center",
-            dataIndex: 'projectId_dictText'
+          title: '项目',
+          align: "center",
+          dataIndex: 'projectId_dictText',
+          customRender: this.renderTextColumn
         },
         {
           title: '类型',
@@ -180,68 +189,126 @@
           dataIndex: 'typeId_dictText'
         },
         {
-            title:'上级需求',
-            align:"center",
-            dataIndex: 'upperId_dictText'
+          title: '上级需求',
+          align: "center",
+          dataIndex: 'upperId_dictText',
+          customRender: this.renderTextColumn
         },
+        // {
+        //   title:'需求编码',
+        //   align:"center",
+        //   dataIndex: 'requirementCode'
+        // },
         {
-            title:'需求编码',
-            align:"center",
-            dataIndex: 'requirementCode'
+          title: '需求编码',
+          align: 'center',
+          dataIndex: 'requirementCode',
+          customRender: (text) => {
+            if (text) {
+              const truncatedText = text.length > 10 ? text.substring(0, 10) : text;
+              return (
+                <Tooltip title={text}>
+                  <span>{truncatedText}</span>
+                </Tooltip>
+              );
+            } else {
+              return null;
+            }
+          }
         },
         {
-            title:'中文名称',
-            align:"center",
-            dataIndex: 'requirementName'
+          title: '中文名称',
+          align: "center",
+          dataIndex: 'requirementName',
+          customRender: this.renderTextColumn
         },
         {
-            title:'需求等级',
-            align:"center",
+          title: '需求等级',
+          align: "center",
           dataIndex: 'requirementLevel_dictText'
         },
         {
-            title:'需求状态',
-            align:"center",
+          title: '需求状态',
+          align: "center",
           dataIndex: 'requirementStatus_dictText'
         },
+        // {
+        //   title: '需求描述',
+        //   align: "center",
+        //   dataIndex: 'requirementDescribe',
+        //   scopedSlots: { customRender: 'htmlSlot' },
+        // },
         {
-            title:'需求描述',
-            align:"center",
+          title: '需求描述',
+          align: "center",
           dataIndex: 'requirementDescribe',
-            scopedSlots: {customRender: 'htmlSlot'},
+          scopedSlots: {
+            customRender: 'htmlSlot'
+          },
+          customRender: (text) => {
+            if (text) {
+              // 去掉<p>标签
+              const strippedText = text.replace(/<p>/g, '').replace(/<\/p>/g, '')
+              if (strippedText.length > 40) {
+                return (
+                  <Tooltip title={strippedText}>
+                    <div class="ellipsis-text" style="text-align: left;">
+                      <span>{strippedText.slice(0, 20)}</span>
+                      <br />
+                      <span>{strippedText.slice(20, 40)}</span>
+                    </div>
+                  </Tooltip>
+                );
+              } else if (strippedText.length > 20) {
+                return (
+                  <div style="text-align: left;">
+                    <span>{strippedText.slice(0, 20)}</span>
+                    <br />
+                    <span>{strippedText.slice(20)}</span>
+                  </div>
+                );
+              } else {
+                return <span style="text-align: left;">{strippedText}</span>;
+              }
+            } else {
+              return null; // or any fallback value you prefer
+            }
+          }
         },
         {
-            title:'需求图片',
-            align:"center",
-            dataIndex: 'requirementPic'
+          title: '图片',
+          align: "center",
+          dataIndex: 'requirementPic',
+          scopedSlots: {customRender: 'imgSlot'}
         },
         {
-            title:'需求文件',
-            align:"center",
-            dataIndex: 'requirementFile'
+          title: '文件',
+          align: "center",
+          dataIndex: 'requirementFile',
+          scopedSlots: { customRender: 'fileSlot' }
         },
         {
-            title:'创建人',
-            align:"center",
+          title: '创建人',
+          align: "center",
           dataIndex: 'createBy_dictText'
         },
         {
-            title:'修改人',
-            align:"center",
+          title: '修改人',
+          align: "center",
           dataIndex: 'updateBy_dictText'
         },
         {
           title: '转化',
           dataIndex: 'zh',
           align: "center",
-            scopedSlots: {customRender: 'zh'}
+          scopedSlots: { customRender: 'zh' }
         },
         {
           title: '操作',
           dataIndex: 'action',
-            align:"center",
-            fixed:"right",
-            width:147,
+          align: "center",
+          fixed: "right",
+          width: 147,
           scopedSlots: { customRender: 'action' }
         }
       ],
@@ -251,106 +318,151 @@
         deleteBatch: "/requirementitem/requirementItem/deleteBatch",
         exportXlsUrl: "/requirementitem/requirementItem/exportXls",
         importExcelUrl: "requirementitem/requirementItem/importExcel",
-          qrxq:"/requirementitem/requirementItem/qrxq",
-          checkqx:"/requirementtype/requirementType/checkqx",
-          wdxqlist:"/requirementitem/requirementItem/wdxqlist",
-          checkzh:"/modulex/modulex/checkzh",
+        qrxq: "/requirementitem/requirementItem/qrxq",
+        checkqx: "/requirementtype/requirementType/checkqx",
+        wdxqlist: "/requirementitem/requirementItem/wdxqlist",
+        checkzh: "/modulex/modulex/checkzh",
 
       },
-        dictOptions:{},
-        superFieldList:[],
+      dictOptions: {},
+      superFieldList: [],
     }
   },
   created() {
     this.getSuperFieldList();
   },
   computed: {
-      importExcelUrl: function(){
+    importExcelUrl: function () {
       return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
     },
   },
   methods: {
-      zhmk(record){
-        getAction(this.url.checkzh,{requirementid:record.id,funlevel:2}).then((res)=>{
+    // 定义换行在列表里超过10个字符自动换行，超过20个字符，列表里依旧显示换过行的字符在第二行多余的字符省略，鼠标移动可以浮现完整内容
+    renderTextColumn(text) {
+      if (text) {
+        if (text.length > 20) {
+          return (
+            <Tooltip title={text}>
+              <div class="ellipsis-text" style="text-align: center;">
+                <span>{text.slice(0, 10)}</span>
+                <br />
+                <span>{text.slice(10, 20)}</span>
+              </div>
+            </Tooltip>
+          );
+        } else if (text.length > 10) {
+          return (
+            <div style="text-align: center;">
+              <span>{text.slice(0, 10)}</span>
+              <br />
+              <span>{text.slice(10)}</span>
+            </div>
+          );
+        } else {
+          return <span style="text-align: center;">{text}</span>;
+        }
+      } else {
+        return null; // or any fallback value you prefer
+      }
+    },
+    zhmk(record) {
+      getAction(this.url.checkzh, { requirementid: record.id, funlevel: 2 }).then((res) => {
         if (res.success) {
           this.$refs.modulex.add(record);
           this.$refs.modulex.title = "新增";
           this.$refs.modulex.disableSubmit = false;
-          }else{
+        } else {
           this.$message.warning(res.message);
         }
       });
     },
-      zhgn(record){
-        getAction(this.url.checkzh,{requirementid:record.id,funlevel:3}).then((res)=>{
+    zhgn(record) {
+      getAction(this.url.checkzh, { requirementid: record.id, funlevel: 3 }).then((res) => {
         if (res.success) {
           this.$refs.functionxm.add(record);
           this.$refs.functionxm.title = "新增";
           this.$refs.functionxm.disableSubmit = false;
-          }else{
+        } else {
           this.$message.warning(res.message);
         }
       });
     },
-      zhgz(record){
-        getAction(this.url.checkzh,{requirementid:record.id,funlevel:4}).then((res)=>{
+    zhgz(record) {
+      getAction(this.url.checkzh, { requirementid: record.id, funlevel: 4 }).then((res) => {
         if (res.success) {
           this.$refs.rulexmd.add(record);
           this.$refs.rulexmd.title = "新增";
           this.$refs.rulexmd.disableSubmit = false;
-          }else{
+        } else {
           this.$message.warning(res.message);
         }
       });
     },
-      checkqx(record){
-        getAction(this.url.checkqx,{createBy:record.createBy}).then((res)=>{
+    checkqx(record) {
+      getAction(this.url.checkqx, { createBy: record.createBy }).then((res) => {
         if (res.success) {
           this.$refs.modalForm.edit(record);
           this.$refs.modalForm.title = "编辑";
           this.$refs.modalForm.disableSubmit = false;
-          }else{
+        } else {
           this.$message.warning(res.message);
         }
       });
     },
-      cqdx(record){
+    cqdx(record) {
       this.$refs.rel1.showModal();
       this.$refs.rel1.edit(record);
       this.$refs.rel1.disableSubmit = false;
     },
-      wdxq(){
+    wdxq() {
       this.searchQuerywdxq();
     },
-      qrxq(id){
-        getAction(this.url.qrxq,{id:id}).then((res)=>{
+    qrxq(id) {
+      getAction(this.url.qrxq, { id: id }).then((res) => {
         if (res.success) {
           this.$message.success(res.message);
           this.loadData();
-          }else{
+        } else {
           this.$message.warning(res.message);
         }
       });
     },
-      initDictConfig(){
+    initDictConfig() {
     },
-      getSuperFieldList(){
-        let fieldList=[];
-        fieldList.push({type:'string',value:'projectId',text:'项目id',dictCode:'projectx,project_name,id'})
-        fieldList.push({type:'string',value:'typeId',text:'类型id',dictCode:'requirement_type,type_name,id'})
-        fieldList.push({type:'string',value:'upperId',text:'上级需求',dictCode:'requirement_item,requirement_name,id'})
-        fieldList.push({type:'string',value:'requirementCode',text:'需求编码',dictCode:''})
-        fieldList.push({type:'string',value:'requirementName',text:'中文名称',dictCode:''})
-        fieldList.push({type:'int',value:'requirementLevel',text:'需求等级',dictCode:'requirement_level'})
-        fieldList.push({type:'int',value:'requirementStatus',text:'需求状态',dictCode:'requirement_status'})
-        fieldList.push({type:'string',value:'requirementDescribe',text:'需求描述',dictCode:''})
-        fieldList.push({type:'string',value:'requirementPic',text:'需求图片',dictCode:''})
-        fieldList.push({type:'string',value:'requirementFile',text:'需求文件',dictCode:''})
+    getSuperFieldList() {
+      let fieldList = [];
+      fieldList.push({ type: 'string', value: 'projectId', text: '项目id', dictCode: 'projectx,project_name,id' })
+      fieldList.push({ type: 'string', value: 'typeId', text: '类型id', dictCode: 'requirement_type,type_name,id' })
+      fieldList.push({ type: 'string', value: 'upperId', text: '上级需求', dictCode: 'requirement_item,requirement_name,id' })
+      fieldList.push({ type: 'string', value: 'requirementCode', text: '需求编码', dictCode: '' })
+      fieldList.push({ type: 'string', value: 'requirementName', text: '中文名称', dictCode: '' })
+      fieldList.push({ type: 'int', value: 'requirementLevel', text: '需求等级', dictCode: 'requirement_level' })
+      fieldList.push({ type: 'int', value: 'requirementStatus', text: '需求状态', dictCode: 'requirement_status' })
+      fieldList.push({ type: 'string', value: 'requirementDescribe', text: '需求描述', dictCode: '' })
+      fieldList.push({ type: 'string', value: 'requirementPic', text: '需求图片', dictCode: '' })
+      fieldList.push({ type: 'string', value: 'requirementFile', text: '需求文件', dictCode: '' })
       this.superFieldList = fieldList
     }
   }
-  }
+}
 </script>
 <style scoped>
-  @import '~@assets/less/common.less';
-</style>
+@import '~@assets/less/common.less';
+
+.action-buttons {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+}
+
+.button-group {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  margin-bottom: 8px;
+}
+
+.button-group a {
+  margin-right: 8px;
+  white-space: nowrap;
+}</style>