123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198 |
- <template>
- <div class="contentRuls">
- <p class="content_p">
- <span class="strat_red">*</span>
- <span class="content_ts">推送内容</span>
- <span class="content_err" v-if="isError">静态信息和附加信息必须填写至少一项!</span>
- </p>
- <el-form :model="formData" label-width="120px" ref="formData" :rules="rules" class="form-address">
- <el-row>
- <el-col :span='10'>
- <el-form-item label="关联静态信息" prop="gljtxx">
- <el-select
- v-model.trim="formData.gljtxx"
- placeholder="请选择"
- multiple
- collapse-tags
- filterable
- remote
- :multiple-limit="50"
- reserve-keyword
- :remote-method="getStaicTypes"
- @visible-change="changeValue1"
- >
- <el-option v-for="item in opts_type" :key="item.id" :label="item.name" :value="item.id"></el-option>
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row>
- <el-col :span='24'>
- <el-form-item label="附加信息" prop="fjxx">
- <el-input type="textarea" :rows="2" v-model.trim="formData.fjxx" resize="none" :maxlength='251'></el-input>
- </el-form-item>
- </el-col>
- </el-row>
- </el-form>
- </div>
- </template>
- <script type="text/javascript">
- import api from "@api/knowledgeLib.js";
- export default {
- name: "AddNewRuleContent",
- props: {
- isContent: {
- type: Boolean,
- default:false,
- },
- formEidtCopy:{
- type:Object,
- },
- isError: {
- type: Boolean,
- default:false,
- },
- },
- watch:{
- isError:{
- handler(val){
- console.log(val)
- }
- }
- },
- data(){
- return {
- formData:{
- gljtxx:[],//关联静态知识
- fjxx:'' //附加信息
- },
- opts_type:[],
- rules:{
- fjxx:{min: 0,max: 250,message: '输入字符长度不能超过250位',trigger: 'change'}
- },
- }
- },
-
- created() {
- console.log('formEidtCopy',this.formEidtCopy)
- //编辑回显
- if(this.isContent){
- //关联静态知识
- this.formEidtCopy.klRuleByIdGroup[0].klRuleStaticSub.forEach((item)=>{
- let obj={}
- obj.id=item.conceptId;
- obj.name=item.name;
- this.opts_type.push(obj)
- this.formData.gljtxx.push(obj.id)
- })
- //附加信息
- this.formData.fjxx=this.formEidtCopy.parMsg
- }
- },
- mounted() {
- this.getStaicTypes()
- },
- methods:{
- //初始化
- clearFormData(){
- this.formData={
- gljtxx:[],//关联静态知识
- fjxx:'' //附加信息
- },
- this.opts_type=[];
- this.isErr=false;
- },
- //获取关联静态知识
- getStaicTypes(query){
- console.log(query)
- let param={
- inputStr: query,
- types: [9]
- }
- if (query == '') {
- return;
- }
- if (query){
- api.getStaicTypes(param).then((res) => {
- console.log(res)
- if (res.data.code == 0) {
- this.opts_type=res.data.data
- } else {
- this.$message({
- message: res.data.msg,
- type: "warning",
- });
- }
- });
- }
-
-
- },
- changeValue1(query){
- console.log(this.formData.gljtxx)
- if(this.formData.gljtxx.length==0){
- this.opts_type=[]
- }
- },
- setName(val){
- if(val&&val.length>6){
- val=val.substring(0,6)
- }
- return val
- }
- },
- watch:{
- formData:{
- handler(newName, oldName) {
- if(newName){
- this.$emit('ruleContent',this.formData)
- }
- },
- immediate: true,
- deep: true
- }
- }
- }
- </script>
- <style lang="less" scoped>
- .contentRuls{
- background: #fff;
- padding: 20px;
- padding-left: 30px;
- padding-bottom:0px;
- font-size: 14px;
- color: #606266;
- .content_p{
- position: relative;
- padding-bottom: 10px;
- .strat_red{
- color: #F56C6C;
- position: absolute;
- top: 0;
- left: -10px;
- }
- .content_ts{
- color: #333;
- font-size: 16px;
- }
- .content_err{
- color: red;
- font-size: 14px;
- margin-left: 20px;
- }
- }
- .form-address{
- /deep/.el-select{
- width: 100%;
- }
- /deep/.el-select__tags-text {
- overflow: hidden;
- text-overflow: ellipsis;
- max-width: 90px;
- }
- }
-
- }
- </style>
|